Skip to content

D
dizhen-ui
Commit a8a4c625 by cat
Options

zd 首页样式修改 缩略图弹窗显示 成果管理

parent 66a45d27
Showing with 294 additions and 39 deletions
src/api/yscgWjscqk/wjscqk.js
import request from '@/utils/request'
// 查询成果管理列表
// 查询成果列表列表
export function listWjscqk(query) {
return request({
url: '/yscgWjscqk/wjscqk/list',
method: 'get',
params: query
params: query,
})
}
// 查询成果管理详细
// 查询成果列表详细
export function getWjscqk(id) {
return request({
url: '/yscgWjscqk/wjscqk/' + id,
method: 'get'
method: 'get',
})
}
// 新增成果管理
// 新增成果列表
export function addWjscqk(data) {
return request({
url: '/yscgWjscqk/wjscqk',
method: 'post',
data: data
data: data,
})
}
// 修改成果管理
// 修改成果列表
export function updateWjscqk(data) {
return request({
url: '/yscgWjscqk/wjscqk',
method: 'put',
data: data
data: data,
})
}
// 删除成果管理
// 删除成果列表
export function delWjscqk(id) {
return request({
url: '/yscgWjscqk/wjscqk/' + id,
method: 'delete'
method: 'delete',
})
}
// 查询成果管理列表
export function listYscgList(query) {
return request({
url: '/ysqqXmxx/ysqqXmxx/yscgList',
method: 'get',
params: query,
})
}
src/api/yscgZllx/zllx.js
......@@ -5,7 +5,7 @@ export function listZllx(query) {
return request({
url: '/yscgZllx/zllx/list',
method: 'get',
params: query
params: query,
})
}
......@@ -13,7 +13,7 @@ export function listZllx(query) {
export function getZllx(id) {
return request({
url: '/yscgZllx/zllx/' + id,
method: 'get'
method: 'get',
})
}
......@@ -22,7 +22,7 @@ export function addZllx(data) {
return request({
url: '/yscgZllx/zllx',
method: 'post',
data: data
data: data,
})
}
......@@ -31,7 +31,7 @@ export function updateZllx(data) {
return request({
url: '/yscgZllx/zllx',
method: 'put',
data: data
data: data,
})
}
......@@ -39,6 +39,14 @@ export function updateZllx(data) {
export function delZllx(id) {
return request({
url: '/yscgZllx/zllx/' + id,
method: 'delete'
method: 'delete',
})
}
// 查询资料类型下拉选项
export function selectZllx() {
return request({
url: '/yscgZllx/zllx/selectZllx',
method: 'get',
})
}
src/assets/images/profile.jpg
src/assets/images/profile.jpg

79.2 KB | W: | H:

src/assets/images/profile.jpg

1.65 KB | W: | H:

src/assets/images/profile.jpg
src/assets/images/profile.jpg
src/assets/images/profile.jpg
src/assets/images/profile.jpg
  • 2-up
  • Swipe
  • Onion skin
src/router/index.js
......@@ -225,17 +225,30 @@ export const dynamicRoutes = [
},
],
},
{
path: '/yscgWjscqk/wjscqk',
component: Layout,
hidden: true,
children: [
{
path: 'index',
component: () => import('@/views/yscgWjscqk/wjscqk/index'),
name: 'WjscqkIndex',
meta: { title: '成果管理', activeMenu: '/yscgWjscqk/yscg' },
},
],
},
];
// 防止连续点击多次路由报错
let routerPush = Router.prototype.push;
let routerReplace = Router.prototype.replace;
// push
Router.prototype.push = function push(location) {
Router.prototype.push = function push (location) {
return routerPush.call(this, location).catch((err) => err);
};
// replace
Router.prototype.replace = function push(location) {
Router.prototype.replace = function push (location) {
return routerReplace.call(this, location).catch((err) => err);
};
......
src/views/index.vue
......@@ -19,11 +19,11 @@
<el-tab-pane label="待验收" name="pending">
<div class="card-container">
<el-row :gutter="16" v-loading="pendingLoading">
<el-col :span="6" v-for="item in pendingList" :key="item.id" class="card-item">
<el-col :span="4" v-for="item in pendingList" :key="item.id" class="card-item">
<el-card class="project-card" shadow="hover">
<div class="card-header" @click="goNav2(item)" style="cursor: pointer;">
<h3 class="project-title">{{ item.xmmc }}</h3>
<el-tag type="warning" size="small">待验收</el-tag>
<el-tag size="small" class="status-tag status-pending">待验收</el-tag>
</div>
<div class="card-content">
<div class="content-wrapper">
......@@ -46,7 +46,7 @@
</div>
</div>
<div class="button-section">
<el-button size="small" @click="handleComplete(item)">完成</el-button>
<el-button size="mini" @click="handleComplete(item)">完成</el-button>
</div>
</div>
</div>
......@@ -66,7 +66,7 @@
<el-tab-pane label="已验收" name="completed">
<div class="card-container">
<el-row :gutter="16" v-loading="completedLoading">
<el-col :span="6" v-for="item in completedList" :key="item.id" class="card-item">
<el-col :span="4" v-for="item in completedList" :key="item.id" class="card-item">
<el-card class="project-card" shadow="hover">
<div class="card-header">
<h3 class="project-title">{{ item.xmmc }}</h3>
......@@ -314,6 +314,7 @@ export default {
padding: 3px 0;
border-radius: 4px;
transition: background-color 0.2s ease;
align-items: center;
}
.info-item:hover {
......@@ -325,6 +326,7 @@ export default {
min-width: 70px;
flex-shrink: 0;
font-weight: 500;
white-space: nowrap;
}
.value {
......@@ -334,6 +336,7 @@ export default {
text-overflow: ellipsis;
white-space: nowrap;
font-weight: 400;
min-width: 0;
}
.button-section {
......@@ -346,11 +349,47 @@ export default {
}
.button-section .el-button {
width: 70px;
height: 28px;
width: 50px;
height: 25px;
font-size: 12px;
font-weight: 500;
border-radius: 14px;
border-radius: 20px;
background: linear-gradient(135deg, #409EFF 0%, #66b1ff 100%);
border: none;
color: #ffffff !important;
box-shadow: 0 1px 4px rgba(64, 158, 255, 0.2);
transition: all 0.2s ease-out;
position: relative;
overflow: hidden;
letter-spacing: 0.5px;
}
.button-section .el-button:hover {
background: linear-gradient(135deg, #337ecc 0%, #5a9eff 100%);
box-shadow: 0 2px 8px rgba(64, 158, 255, 0.25);
transform: translateY(-0.5px);
color: #ffffff !important;
}
.button-section .el-button:active {
transform: translateY(0);
box-shadow: 0 1px 3px rgba(64, 158, 255, 0.2);
color: #ffffff !important;
}
.button-section .el-button::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
transition: left 0.3s ease-out;
}
.button-section .el-button:hover::before {
left: 100%;
}
/* Safety: if any global rule hid buttons inside cards on non-hover, override */
......@@ -367,6 +406,17 @@ export default {
visibility: visible;
}
/* 状态标签：待验收（蓝色系，贴合系统主色） */
.status-tag {
border: none !important;
font-weight: 600;
}
.status-pending {
color: #1f3b64;
background: rgba(64, 158, 255, 0.12);
}
/* 分页固定在右下角 */
.pagination-wrapper {
position: fixed;
......@@ -377,13 +427,13 @@ export default {
/* 默认大屏下每行5列 */
.el-col {
width: 25% !important;
width: 20% !important;
}
/* 响应式设计 */
@media (max-width: 1400px) {
.el-col {
width: 25% !important;
width: 20% !important;
}
}
......
src/views/yscgWjscqk/yscg/index.vue 0 → 100644
<!-- 成果管理 -->
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="项目名称" prop="xmmc">
<el-input v-model="queryParams.xmmc" placeholder="请输入项目名称" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="区块" prop="qk">
<el-input v-model="queryParams.qk" placeholder="请输入区块" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-table border v-loading="loading" :data="yscgList" :span-method="spanMethod">
<el-table-column label="项目名称" align="center" prop="xmmc" min-width="150" show-overflow-tooltip />
<el-table-column label="区块" align="center" prop="qk" min-width="120" show-overflow-tooltip />
<el-table-column label="资料类型" align="center" prop="zllxmc" min-width="120" show-overflow-tooltip />
<el-table-column label="上传情况" align="center" min-width="120">
<template slot-scope="scope">
<i :class="scope.row.zlsl > 0 ? 'el-icon-check' : 'el-icon-close'"
:style="{ color: scope.row.zlsl > 0 ? '#67C23A' : '#F56C6C', fontSize: '18px' }">
</i>
</template>
</el-table-column>
<el-table-column label="成果" align="center" prop="id" min-width="100" show-overflow-tooltip>
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)">查看成果</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
</div>
</template>
<script>
import { listYscgList } from "@/api/yscgWjscqk/wjscqk"
export default {
name: "Yscg",
data() {
return {
// 遮罩层
loading: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 成果管理表格数据
yscgList: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
xmmc: null,
qk: null
}
}
},
created() {
this.getList()
},
methods: {
/** 查询成果管理列表 */
getList() {
this.loading = true
listYscgList(this.queryParams).then(response => {
this.yscgList = response.rows
this.total = response.total
this.loading = false
})
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm")
this.handleQuery()
},
/** 成果按钮操作 */
handleView(row) {
// 跳转到成果详情页面，传id
this.$router.push({
path: '/yscgWjscqk/wjscqk/index',
query: {
xmid: row.id
}
})
},
/** 表格行合并方法 */
spanMethod({ row, column, rowIndex, columnIndex }) {
// 项目名称列（第0列）、区块列（第1列）和成果列（第3列）需要合并
if (columnIndex === 0 || columnIndex === 1 || columnIndex === 4) {
let fieldName, currentValue
if (columnIndex === 0) {
fieldName = 'xmmc'
currentValue = row[fieldName]
} else if (columnIndex === 1) {
fieldName = 'qk'
currentValue = row[fieldName]
} else if (columnIndex === 4) {
fieldName = 'id'
currentValue = row[fieldName]
}
// 如果当前值为空，不合并
if (!currentValue) {
return [1, 1]
}
// 如果当前值与上一行相同，则隐藏当前行
if (rowIndex > 0 && this.yscgList[rowIndex - 1][fieldName] === currentValue) {
return [0, 0]
}
// 计算需要合并的行数
let rowspan = 1
for (let i = rowIndex + 1; i < this.yscgList.length; i++) {
if (this.yscgList[i][fieldName] === currentValue) {
rowspan++
} else {
break
}
}
return [rowspan, 1]
}
// 其他列不合并
return [1, 1]
}
}
}
</script>
src/views/ysqqXmxx/ysgc/index.vue
......@@ -26,7 +26,7 @@ export default {
height: { type: Number, default: 0 },
idOverride: { type: [String, Number], default: null }
},
data() {
data () {
return {
chart: null,
resizeObserver: null,
......@@ -46,7 +46,7 @@ export default {
points: []
}
},
mounted() {
mounted () {
// 仅使用延迟初始化，确保容器有尺寸后再 init
this.deferInit()
window.addEventListener('resize', this.resizeChart)
......@@ -69,16 +69,16 @@ export default {
})
}
},
created() {
created () {
// 尽早触发接口调用，进入页面即发起请求
this.loadDht()
},
activated() {
activated () {
// 当页面被 keep-alive 缓存后再次进入时，确保尺寸和图表刷新
this.deferInit()
this.resizeChart()
},
beforeDestroy() {
beforeDestroy () {
window.removeEventListener('resize', this.resizeChart)
if (this.chart) {
this.chart.dispose()
......@@ -91,7 +91,7 @@ export default {
},
methods: {
// 等待容器有有效尺寸再初始化，避免 echarts 容器宽高为 0 报错
deferInit() {
deferInit () {
const tryInit = () => {
const el = this.$refs.chartRef
if (!el) return
......@@ -135,10 +135,10 @@ export default {
}
this.$nextTick(tryInit)
},
resizeChart() {
resizeChart () {
if (this.chart) this.chart.resize()
},
initChart() {
initChart () {
const el = this.$refs.chartRef
if (!el) return
if (this.chart) {
......@@ -153,6 +153,7 @@ export default {
// 初始渲染
this.renderChart()
this.resizeChart()
this.bindChartEvents()
// 对于缩略图模式，确保渲染成功
if (this.compact) {
......@@ -160,7 +161,7 @@ export default {
}
},
// 数据变化后自动刷新（确保缩略图及时绘制）
_requestRender() {
_requestRender () {
if (!this.chart) return
this.$nextTick(() => {
this.renderChart()
......@@ -173,7 +174,7 @@ export default {
})
},
// 调用地层/断层图接口（示例），优先从路由参数获取 id
loadDht() {
loadDht () {
if (this.loadingDht || this.dhtResult) return
try {
const route = this.$route || {}
......@@ -201,7 +202,7 @@ export default {
}
},
// 将接口返回的数据应用到图表状态
applyDhtResult() {
applyDhtResult () {
const data = this.dhtResult || {}
// 边界
this.xMin = data.xmin != null ? Number(data.xmin) : this.xMin
......@@ -247,7 +248,7 @@ export default {
} catch (e) { }
},
// 生成图表配置
buildOption() {
buildOption () {
// 若未提供边界，则根据数据自动估算
const allXs = []
const allYs = []
......@@ -321,10 +322,41 @@ export default {
}
},
// 渲染或更新图表
renderChart() {
renderChart () {
if (!this.chart) return
const option = this.buildOption()
this.chart.setOption(option, true)
// 确保事件绑定有效
this.bindChartEvents()
},
// 绑定点击/双击事件，把被点击的绿色线条映射为 segy 下标并上报
bindChartEvents () {
if (!this.chart) return
// 解除旧绑定避免重复
this.chart.off('click')
this.chart.off('dblclick')
const getLineIndexBySeries = (seriesIndex) => {
// 如果有井点散点，最前面占 1 个 series
const hasPoints = Array.isArray(this.points) && this.points.length > 0
const base = hasPoints ? 1 : 0
// 每条线我们 push 了两个 series：line 和一个灰色散点
if (seriesIndex < base) return -1
const offset = seriesIndex - base
// 偶数 -> 折线；奇数 -> 叠加的灰色散点
return Math.floor(offset / 2)
}
const emitPick = (params) => {
if (!params || (params.seriesType !== 'line' && params.seriesType !== 'scatter')) return
const idx = getLineIndexBySeries(params.seriesIndex)
if (idx >= 0 && idx < this.segyLines.length) {
this.$emit('segyLinePick', { index: idx })
}
}
this.chart.on('click', emitPick)
this.chart.on('dblclick', emitPick)
}
}
}
......
src/views/ysqqXmxx/ysgc/index2—9.28备份.vue 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment