Skip to content

Z
zrch-risk-39
提交 7120df35 authored 作者: liuluyu's avatar liuluyu
浏览文件
操作

tb5样式优化

上级 9cb3fade
显示空白字符变更
内嵌 并排
正在显示 包含 90 行增加 和 94 行删除
zrch-risk-client-39/src/views/baosong/report/components/Tb5.vue
浏览文件 @ 7120df35
......@@ -200,7 +200,7 @@
</vxe-table>
<!-- 历史填报检查组件 -->
<HistoryFillCheck ref="historyFillCheckRef" v-model="historyDrawerVisible" @closeDrawer="closeHistoryDrawer" />
<HistoryFillCheck ref="historyFillCheckRef" v-model="historyDrawerVisible" @close-drawer="closeHistoryDrawer" />
<!-- 验证公式帮助提示 -->
<div
......@@ -214,17 +214,17 @@
</template>
<script lang="ts" setup>
import MultiColumnTable from '../tableComponents/MultiColumnTable.vue'
import AttachTable from '../tableComponents/AttachTable.vue'
import HistoryFillCheck from './check/historyFillCheck.vue'
import MultiColumnTable from '../tableComponents/MultiColumnTable.vue';
import AttachTable from '../tableComponents/AttachTable.vue';
import HistoryFillCheck from './check/historyFillCheck.vue';
import { tableFormData } from '../../data/tb5.data';
import { ref, reactive,nextTick,onMounted,toRaw } from 'vue'
import { VxeUI,VxeToolbarInstance,VxeToolbarPropTypes } from 'vxe-table'
import { batchSaveOrUpdate, queryRecord,batchSaveOrUpdateBeforeDelete } from '../../record/BaosongTaskRecord.api'
import { queryAllTplItemForUser, findUserRightForTplItem } from '../../alloc/BaosongTaskAlloc.api'
import { allTplItems } from '../../tpl/BaosongTplItem.api'
import { getTblvalidFormula } from '../../tpl/BaosongDataValid.api'
import { ref, reactive, nextTick, onMounted, toRaw } from 'vue';
import { VxeUI, VxeToolbarInstance, VxeToolbarPropTypes } from 'vxe-table';
import { batchSaveOrUpdate, queryRecord, batchSaveOrUpdateBeforeDelete } from '../../record/BaosongTaskRecord.api';
import { queryAllTplItemForUser, findUserRightForTplItem } from '../../alloc/BaosongTaskAlloc.api';
import { allTplItems } from '../../tpl/BaosongTplItem.api';
import { getTblvalidFormula } from '../../tpl/BaosongDataValid.api';
import { useRoute } from 'vue-router';
const route = useRoute();
......@@ -232,22 +232,22 @@
const tplItemMap = ref({});
const historyFillCheckRef = ref<any>(null);
const queryParam = ref({
taskId:-1,
taskName:'',
tplId:-1,
tplName:'',
tplCode:''
})
taskId: -1,
taskName: '',
tplId: -1,
tplName: '',
tplCode: '',
});
// 权限相关状态
const userAllocItems = ref<string[]>([])
const validFormula = ref<any[]>([])
const validationResultsList = ref<any[]>([])
const drawerVisible = ref(false)
const historyDrawerVisible = ref(false)
const validationTooltipVisible = ref(false)
const validationTooltipPosition = ref({ left: 0, top: 0 })
const validationTooltipContent = ref('')
const userAllocItems = ref<string[]>([]);
const validFormula = ref<any[]>([]);
const validationResultsList = ref<any[]>([]);
const drawerVisible = ref(false);
const historyDrawerVisible = ref(false);
const validationTooltipVisible = ref(false);
const validationTooltipPosition = ref({ left: 0, top: 0 });
const validationTooltipContent = ref('');
interface FormData {
id: number | null;
......@@ -260,7 +260,7 @@
rind: number;
}
onMounted(async ()=>{
onMounted(async () => {
if (route.query.taskId) {
queryParam.value.taskId = Number(route.query.taskId);
}
......@@ -281,14 +281,14 @@
try {
userAllocItems.value = await findUserRightForTplItem({
tplid: queryParam.value.tplId,
taskid: queryParam.value.taskId
})
taskid: queryParam.value.taskId,
});
validFormula.value = await getTblvalidFormula({
tplid: queryParam.value.tplId,
})
});
} catch (error) {
console.error('获取权限或验证公式失败:', error)
console.error('获取权限或验证公式失败:', error);
}
await setTplItemMap();
......@@ -519,77 +519,73 @@
}
}
}
// 校验数据
const checkData = () => {
drawerVisible.value = true
}
drawerVisible.value = true;
};
// 校验结果抽屉显示时触发
const handleValidationDrawerShow = () => {
performValidation()
}
performValidation();
};
// 执行校验
const performValidation = () => {
validationResultsList.value = []
const process: string[] = []
process.push('开始校验')
process.push(`找到 ${validFormula.value.length} 个验证公式`)
validationResultsList.value = [];
const process: string[] = [];
process.push('开始校验');
process.push(`找到 ${validFormula.value.length} 个验证公式`);
validFormula.value.forEach((formulaItem: any) => {
process.push(`开始校验公式: ${formulaItem.des}`)
const result = evaluateFormula(formulaItem.formula, formulaItem.des, process)
process.push(`开始校验公式: ${formulaItem.des}`);
const result = evaluateFormula(formulaItem.formula, formulaItem.des, process);
if (result) {
validationResultsList.value.push(result)
}
})
process.push('校验完成')
validationResultsList.value.push(result);
}
});
process.push('校验完成');
};
// 解析和执行验证公式
const evaluateFormula = (formula: string, description: string, process: string[]): any => {
try {
const fieldMatch = formula.match(/\[(\w+)\]/)
const fieldMatch = formula.match(/\[(\w+)\]/);
if (!fieldMatch) {
process.push(`跳过: 无法解析公式字段 ${formula}`)
return null
process.push(`跳过: 无法解析公式字段 ${formula}`);
return null;
}
const fieldName = fieldMatch[1]
const row = tableFormData.find((r: any) => r.content?.some((c: any) => c.field === fieldName))
const fieldName = fieldMatch[1];
const row = tableFormData.find((r: any) => r.content?.some((c: any) => c.field === fieldName));
if (!row) {
process.push(`跳过: 未找到字段 ${fieldName}`)
return null
process.push(`跳过: 未找到字段 ${fieldName}`);
return null;
}
const fieldItem = row.content.find((c: any) => c.field === fieldName)
const fieldItem = row.content.find((c: any) => c.field === fieldName);
if (!fieldItem) {
process.push(`跳过: 未找到字段 ${fieldName}`)
return null
process.push(`跳过: 未找到字段 ${fieldName}`);
return null;
}
const strKey = `${row.code}_${fieldName}`
const fieldValue = formData[strKey]
const strKey = `${row.code}_${fieldName}`;
const fieldValue = formData[strKey];
// 检查是否有空字段规则
const emptyFieldRule = validFormula.value.find((f: any) =>
f.formula.includes(fieldName) && f.des.includes('空字段')
)
const emptyFieldRule = validFormula.value.find((f: any) => f.formula.includes(fieldName) && f.des.includes('空字段'));
if (emptyFieldRule && (!fieldValue || fieldValue === '')) {
process.push(`跳过: 字段 ${fieldName} 为空，跳过空字段规则`)
return null
process.push(`跳过: 字段 ${fieldName} 为空，跳过空字段规则`);
return null;
}
const expression = formula.replace(/\[(\w+)\]/g, (_, field) => {
const value = formData[`${row.code}_${field}`]
return value !== undefined ? `Number(${value})` : '0'
})
const value = formData[`${row.code}_${field}`];
return value !== undefined ? `Number(${value})` : '0';
});
process.push(`执行公式: ${expression}`)
const isValid = eval(expression)
process.push(`执行公式: ${expression}`);
const isValid = eval(expression);
return {
field: fieldName,
......@@ -597,59 +593,59 @@
formula: formula,
isValid: isValid,
fieldValue: fieldValue,
rowCode: row.code
}
rowCode: row.code,
};
} catch (error) {
process.push(`公式执行错误: ${error instanceof Error ? error.message : String(error)}`)
return null
}
process.push(`公式执行错误: ${error instanceof Error ? error.message : String(error)}`);
return null;
}
};
// 处理校验结果点击，定位到表格
const handleValidationResultClick = (result: any) => {
const row = tableFormData.find((r: any) => r.code === result.rowCode)
const row = tableFormData.find((r: any) => r.code === result.rowCode);
if (row) {
const fieldItem = row.content.find((c: any) => c.field === result.field)
const fieldItem = row.content.find((c: any) => c.field === result.field);
if (fieldItem) {
const strKey = `${row.code}_${result.field}`
const inputElement = document.querySelector(`[data-field="${strKey}"]`) as HTMLElement
const strKey = `${row.code}_${result.field}`;
const inputElement = document.querySelector(`[data-field="${strKey}"]`) as HTMLElement;
if (inputElement) {
inputElement.scrollIntoView({ behavior: 'smooth', block: 'center' })
inputElement.focus()
inputElement.style.border = '2px solid #ff4d4f'
inputElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
inputElement.focus();
inputElement.style.border = '2px solid #ff4d4f';
setTimeout(() => {
inputElement.style.border = ''
}, 2000)
}
inputElement.style.border = '';
}, 2000);
}
}
}
};
// 显示验证公式帮助
const showValidationHelp = (formulaItem: any, event: MouseEvent) => {
const rect = (event.target as HTMLElement).getBoundingClientRect()
const rect = (event.target as HTMLElement).getBoundingClientRect();
validationTooltipPosition.value = {
left: rect.left + rect.width / 2,
top: rect.top - 10
}
validationTooltipContent.value = `验证公式: ${formulaItem.formula}\n说明: ${formulaItem.des}`
validationTooltipVisible.value = true
}
top: rect.top - 10,
};
validationTooltipContent.value = `验证公式: ${formulaItem.formula}\n说明: ${formulaItem.des}`;
validationTooltipVisible.value = true;
};
// 关闭验证公式帮助
const closeTooltip = () => {
validationTooltipVisible.value = false
}
validationTooltipVisible.value = false;
};
// 打开历史填报抽屉
const handleOpenHistoryDrawer = () => {
historyDrawerVisible.value = true
}
historyDrawerVisible.value = true;
};
// 关闭历史填报抽屉
const closeHistoryDrawer = () => {
historyDrawerVisible.value = false
}
historyDrawerVisible.value = false;
};
</script>
<style lang="less" scoped>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论