明树Git Lab

Commit 5c8aa9ce authored by zhanghan's avatar zhanghan

1

parent 730179f8
// src/directives/delayRender.js
/**
* 延迟渲染自定义指令(修复版)
* @param {Number} binding.value - 延迟时间(ms),默认2000ms
* 核心:延迟期间清空DOM,到期后恢复原始HTML,兼容Vue虚拟DOM
*/
export default {
mounted(el, binding) {
// 1. 校验延迟时间,默认2秒
const delay = Number.isFinite(Number(binding.value))
? Number(binding.value)
: 2000;
// 2. 保存原始HTML内容(字符串形式,兼容Vue虚拟DOM,不会丢失)
el._originalHTML = el.innerHTML;
// 3. 清空DOM,实现“不渲染”(可选:添加加载占位符)
el.innerHTML = ""; // 纯清空,无占位符
// 可选:添加加载占位符(提升体验)
// el.innerHTML = '<div style="padding: 20px; color: #999;">正在加载...</div>';
// 4. 延迟后恢复原始内容,触发渲染
el._delayRenderTimer = setTimeout(() => {
// 关键:恢复保存的原始HTML
if (el._originalHTML) {
el.innerHTML = el._originalHTML;
// 清理临时变量,减少内存占用
delete el._originalHTML;
}
}, delay);
},
// 组件卸载时强制清理,防止内存泄漏+残留问题
unmounted(el) {
// 清理定时器
if (el._delayRenderTimer) {
clearTimeout(el._delayRenderTimer);
delete el._delayRenderTimer;
}
// 清理保存的原始HTML
if (el._originalHTML) {
delete el._originalHTML;
}
},
// 可选:指令更新时重新处理(比如延迟时间动态变化)
updated(el, binding) {
// 先清理旧定时器
if (el._delayRenderTimer) {
clearTimeout(el._delayRenderTimer);
}
// 重新执行挂载逻辑
const delay = Number.isFinite(Number(binding.value))
? Number(binding.value)
: 2000;
el._originalHTML = el.innerHTML;
el.innerHTML = "";
el._delayRenderTimer = setTimeout(() => {
el.innerHTML = el._originalHTML;
delete el._originalHTML;
}, delay);
},
};
import delayRender from "./delayRender";
export default {
"delay-render": delayRender, // 指令名与指令实现映射
};
import { createApp } from "vue"; import { createApp } from "vue";
// 自定义指令
import directives from "./directives";
import "./style.css"; import "./style.css";
import App from "./App.vue"; import App from "./App.vue";
import ElementPlus from "element-plus"; import ElementPlus from "element-plus";
...@@ -20,6 +22,9 @@ app.config.globalProperties.$get = $get; ...@@ -20,6 +22,9 @@ app.config.globalProperties.$get = $get;
app.config.globalProperties.$post = $post; app.config.globalProperties.$post = $post;
app.config.globalProperties.windowConfig = windowConfig; app.config.globalProperties.windowConfig = windowConfig;
app.config.globalProperties.moment = moment; app.config.globalProperties.moment = moment;
Object.entries(directives).forEach(([directiveName, directive]) => {
app.directive(directiveName, directive);
});
for (const [key, component] of Object.entries(ElIcons)) { for (const [key, component] of Object.entries(ElIcons)) {
app.component(key, component); app.component(key, component);
} }
......
...@@ -16,6 +16,19 @@ ...@@ -16,6 +16,19 @@
<el-form :model="formData" :label-width="200" :disabled="isPreview"> <el-form :model="formData" :label-width="200" :disabled="isPreview">
<el-collapse v-model="activeCollapse"> <el-collapse v-model="activeCollapse">
<!-- 基本信息:字段完全对齐数据库 --> <!-- 基本信息:字段完全对齐数据库 -->
<el-collapse-item title="选择类型" name="选择类型">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="请选择登记类型">
<CommonSelector
:radio="true"
v-model="formData.djlx"
dictName="xmtc_djlx"
/>
</el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<el-collapse-item title="基本信息" name="基本信息"> <el-collapse-item title="基本信息" name="基本信息">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="12"> <el-col :span="12">
...@@ -284,268 +297,6 @@ ...@@ -284,268 +297,6 @@
</el-row> </el-row>
</el-collapse-item> </el-collapse-item>
<!-- 战略类A:按数据库字段补充所有表单项 -->
<el-collapse-item title="战略类A" name="战略类A">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="是否国家中长期规划重大项目(A1)">
<CommonSelector
:radio="true"
v-model="formData.sfgjzcqghzdxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="是否国家有关部门下达的重点项目(A2)">
<CommonSelector
:radio="true"
v-model="formData.sfgjygbmxddzdxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="大规模设备更新(A3)">
<CommonSelector
:radio="true"
v-model="formData.dgmsbgx"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="战略性新兴产业百大工程(A4)">
<CommonSelector
:radio="true"
v-model="formData.zlxxxcybdgc"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="列入央企产业焕新和未来产业启航行动的项目(A5)"
>
<CommonSelector
:radio="true"
v-model="formData.lryqcyhxhwlcyqhxddxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="强链补链重点项目(A6)">
<CommonSelector
:radio="true"
v-model="formData.qlblzdxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="对应重大或重点项目名录名称">
<el-input
v-model="formData.dyzdhzdxmmlmc"
placeholder="请输入对应重大或重点项目名录名称"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="战略性新兴产业分类(如有,必填)">
<el-input
v-model="formData.zlxxxcyfl"
placeholder="请输入战略性新兴产业分类"
/>
</el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<!-- 发展类B:按数据库字段补充所有表单项 -->
<el-collapse-item title="发展类(B类)" name="发展类(B类)">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item
label="列入企业发展战略性新兴产业工作方案的项目(B1)"
>
<CommonSelector
:radio="true"
v-model="formData.lrqyfzzlxxxcygzfadxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="粮食、能源、矿产资源保障项目(B2)">
<CommonSelector
:radio="true"
v-model="formData.lsnykczybzxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="传统产业高端化、智能化、绿色化转型升级项目(B3)"
>
<CommonSelector
:radio="true"
v-model="formData.ctcygdh"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="支撑企业发展的重点项目(B4)">
<CommonSelector
:radio="true"
v-model="formData.zcqyfzdddxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="制造业技术改造项目">
<CommonSelector
:radio="true"
v-model="formData.zzyjsgzxm"
dictName="sf"
/>
</el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<!-- 关注类C:按数据库字段补充所有表单项 -->
<el-collapse-item title="关注类(C类)" name="关注类(C类)">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="对外并购类投资项目(C1)">
<CommonSelector
:radio="true"
v-model="formData.dwbgltzxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="特别监管类项目(C2)">
<CommonSelector
:radio="true"
v-model="formData.tbjglxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="境外特别关注类项目(C3)">
<CommonSelector
:radio="true"
v-model="formData.jwtbgzlxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="对外参股类投资项目(C4)">
<CommonSelector
:radio="true"
v-model="formData.dwcglxtzxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="房地产投资项目(C5)">
<CommonSelector
:radio="true"
v-model="formData.fdctzxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="PPP投资项目(C6)">
<CommonSelector
:radio="true"
v-model="formData.ppptzxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="两高项目(C7)">
<CommonSelector
:radio="true"
v-model="formData.lgxm"
dictName="sf"
/>
</el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<!-- 管控类D:按数据库字段补充所有表单项 -->
<el-collapse-item title="管控类(D类)" name="管控类(D类)">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="非主业投资项目(D1)">
<CommonSelector
:radio="true"
v-model="formData.fzytzxm"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="持牌金融机构(D2)">
<CommonSelector
:radio="true"
v-model="formData.zpjrjg"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="类金融机构(D3)">
<CommonSelector
:radio="true"
v-model="formData.ljrjg"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="其他金融机构(D4)">
<CommonSelector
:radio="true"
v-model="formData.qtjrjg"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="基金及基金管理公司(D5)">
<CommonSelector
:radio="true"
v-model="formData.jjjjjglgs"
dictName="sf"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="创业投资基金(D6)">
<CommonSelector
:radio="true"
v-model="formData.cytzjj"
dictName="sf"
/>
</el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<!-- 最终分类情况:补充长文本输入框 --> <!-- 最终分类情况:补充长文本输入框 -->
<el-collapse-item title="最终分类情况" name="最终分类情况"> <el-collapse-item title="最终分类情况" name="最终分类情况">
<el-row :gutter="20"> <el-row :gutter="20">
...@@ -562,70 +313,6 @@ ...@@ -562,70 +313,6 @@
</el-row> </el-row>
</el-collapse-item> </el-collapse-item>
<!-- 可研/决策信息(单位:万元):独立表格,专属方法/数据源 -->
<el-collapse-item
title="可研/决策信息(单位:万元)"
name="可研/决策信息(单位:万元)"
>
<el-table
:data="financialIndicators"
style="width: 100%"
border
:cell-style="tableCellStyle"
row-key="serialNumber"
>
<!-- 序号列 -->
<el-table-column
prop="serialNumber"
label="序号"
width="80"
align="center"
/>
<!-- 指标项列(层级缩进) -->
<el-table-column
prop="indicatorName"
label="指标项"
min-width="280"
>
<template #default="{ row }">
<span :style="{ textIndent: `${row.level * 20}px` }">
{{ row.indicatorName }}
</span>
</template>
</el-table-column>
<!-- 合计列(自动统计) -->
<el-table-column label="合计" width="120" align="center">
<template #default="{ row }">
<span
>{{
row.total ? row.total.toFixed(2) : "0.00"
}}万元</span
>
</template>
</el-table-column>
<!-- 动态时间表头:当前时间+后续15期(年/年月) -->
<el-table-column
v-for="time in dynamicTimeList"
:key="time"
:label="time"
width="140"
align="center"
>
<template #default="{ row }">
<el-input
v-model="row[time]"
:min="0"
:precision="2"
controls-position="right"
@change="handleFinancialChange(row)"
:disabled="isPreview"
style="width: 100%"
/>
</template>
</el-table-column>
</el-table>
</el-collapse-item>
<!-- 年度投资计划:基础信息 --> <!-- 年度投资计划:基础信息 -->
<el-collapse-item title="年度投资计划" name="年度投资计划"> <el-collapse-item title="年度投资计划" name="年度投资计划">
<el-row :gutter="20"> <el-row :gutter="20">
...@@ -784,18 +471,6 @@ ...@@ -784,18 +471,6 @@
</el-row> </el-row>
</el-collapse-item> </el-collapse-item>
<!-- 项目年度计划表格(单位:万元):独立子组件表格,专属方法/数据源 -->
<el-collapse-item
title="项目年度计划表格(单位:万元)"
name="项目年度计划表格(单位:万元)"
>
<div class="annualPlans">
{{ formData.xmndjh }}
{{ formData.xmndjh }}
{{ formData.annualDynamicTimeList }}
</div>
</el-collapse-item>
<!-- 项目年度计划(资金支付口径):金额类字段统一用数字输入框,精度2,单位万元 --> <!-- 项目年度计划(资金支付口径):金额类字段统一用数字输入框,精度2,单位万元 -->
<el-collapse-item <el-collapse-item
title="项目年度计划(资金支付口径)" title="项目年度计划(资金支付口径)"
...@@ -937,7 +612,6 @@ import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue"; ...@@ -937,7 +612,6 @@ import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
import { useRouter, useRoute } from "vue-router"; import { useRouter, useRoute } from "vue-router";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import DynamicTable from "@/components/FormDynamicTable/index.vue"; import DynamicTable from "@/components/FormDynamicTable/index.vue";
// ========== 年度计划子组件专属时间列表【核心:适配任意年份,父子唯一统一】 ========== // ========== 年度计划子组件专属时间列表【核心:适配任意年份,父子唯一统一】 ==========
const annualDynamicTimeList = ref([]); const annualDynamicTimeList = ref([]);
...@@ -1016,7 +690,7 @@ const activeCollapse = ref([ ...@@ -1016,7 +690,7 @@ const activeCollapse = ref([
"2026年参股单位出资情况修正(单位:万元)", "2026年参股单位出资情况修正(单位:万元)",
"可研/决策信息(单位:万元)", "可研/决策信息(单位:万元)",
"项目年度计划表格(单位:万元)", "项目年度计划表格(单位:万元)",
"战略类A", "选择类型",
"发展类(B类)", "发展类(B类)",
"关注类(C类)", "关注类(C类)",
"管控类(D类)", "管控类(D类)",
...@@ -1265,7 +939,7 @@ const formData = reactive({ ...@@ -1265,7 +939,7 @@ const formData = reactive({
yynxn: 0, // 运营年限(年) yynxn: 0, // 运营年限(年)
jchcx: "", // 建成后成效 jchcx: "", // 建成后成效
// 战略类A // 选择类型
sfgjzcqghzdxm: null, sfgjzcqghzdxm: null,
sfgjygbmxddzdxm: null, sfgjygbmxddzdxm: null,
dgmsbgx: null, dgmsbgx: null,
......
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