From 745815f637e5385b2cbc23a6ae02401bb8b6c675 Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期六, 08 三月 2025 14:22:36 +0800
Subject: [PATCH] 详情页面优化
---
src/views/tigerprojects/bas/checkrule/ruleDetail.vue | 599 +++++++++++++++++++++++++++++------------------------------
1 files changed, 295 insertions(+), 304 deletions(-)
diff --git a/src/views/tigerprojects/bas/checkrule/ruleDetail.vue b/src/views/tigerprojects/bas/checkrule/ruleDetail.vue
index 8177259..0e9e774 100644
--- a/src/views/tigerprojects/bas/checkrule/ruleDetail.vue
+++ b/src/views/tigerprojects/bas/checkrule/ruleDetail.vue
@@ -5,39 +5,29 @@
</a-card>
<a-card title="瑙勫垯鏄庣粏" :bordered="false" class="!mt-5">
<div>
- <BasicTable
- :columns="dtlColumns"
- ref="tableRef"
- :dataSource="data"
- :canResize="canResize"
- :loading="loading"
- :striped="striped"
- :bordered="border"
- :actionColumn="actionColumn"
- :pagination="pagination"
- showTableSetting
- >
+ <BasicTable :columns="dtlColumns" ref="tableRef" :dataSource="data" :canResize="canResize" :loading="loading"
+ :striped="striped" :bordered="border" :actionColumn="actionColumn" :pagination="pagination" showTableSetting>
<template #toolbar>
<a-button type="primary" @click="handleCreate"> 鏂板瑙勫垯 </a-button>
</template>
<template #action="{ record }">
- <TableAction
- :actions="[
- {
- icon: 'clarity:note-edit-line',
- onClick: handleEdit.bind(null, record),
+ <TableAction :actions="[
+ {
+ icon: 'clarity:note-edit-line',
+ onClick: handleEdit.bind(null, record),
+ name: ''
+ },
+ {
+ icon: 'ant-design:delete-outlined',
+ color: 'error',
+ popConfirm: {
+ title: '鏄惁纭鍒犻櫎?',
+ placement: 'left',
+ confirm: handleDelete.bind(null, record),
},
- {
- icon: 'ant-design:delete-outlined',
- color: 'error',
- popConfirm: {
- title: '鏄惁纭鍒犻櫎?',
- placement: 'left',
- confirm: handleDelete.bind(null, record),
- },
- },
- ]"
- />
+ name: ''
+ },
+ ]" />
</template>
</BasicTable>
</div>
@@ -54,301 +44,302 @@
</PageWrapper>
</template>
<script lang="ts">
- import { BasicForm, useForm } from '/@/components/Form';
- import { defineComponent, onMounted, ref, unref } from 'vue';
- import { useRoute, useRouter } from 'vue-router';
- import { PageWrapper } from '/@/components/Page';
- import { Card } from 'ant-design-vue';
- import { useGo } from '/@/hooks/web/usePage';
- import { useDrawer } from '/@/components/Drawer';
- import { BasicTable, TableAction, TableActionType } from '/@/components/Table';
- import { columns, dtlColumns, newFormSchema, testSchemas } from './checkrule.data';
- import CheckruleDrawer from './CheckruleDrawer.vue';
- import { useTabs } from '/@/hooks/web/useTabs';
- import {
- DeleteRuleDtl,
- getRuleById,
- getRuleDtl,
- SaveRule,
- SaveRuleDtl,
- } from '/@/api/tigerapi/bas/checkrule';
- import {
- CheckRuleDtlParams,
- CheckRuleListItem,
- iBAS_CODE_DTL,
- } from '/@/api/tigerapi/model/mesModel';
- import { useUserStore } from '/@/store/modules/user';
- import { buildUUID } from '/@/utils/uuid';
- import { formatToDateTime } from '/@/utils/dateUtil';
- import { useMultipleTabStore } from '/@/store/modules/multipleTab';
- import { isEmpty, isNullOrEmpty } from '/@/utils/is';
+import { BasicForm, useForm } from '/@/components/Form';
+import { defineComponent, onMounted, ref, unref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { PageWrapper } from '/@/components/Page';
+import { Card } from 'ant-design-vue';
+import { useGo } from '/@/hooks/web/usePage';
+import { useDrawer } from '/@/components/Drawer';
+import { BasicTable, TableAction, TableActionType } from '/@/components/Table';
+import { columns, dtlColumns, newFormSchema, testSchemas } from './checkrule.data';
+import CheckruleDrawer from './CheckruleDrawer.vue';
+import { useTabs } from '/@/hooks/web/useTabs';
+import {
+ DeleteRuleDtl,
+ getRuleById,
+ getRuleDtl,
+ SaveRule,
+ SaveRuleDtl,
+} from '/@/api/tigerapi/bas/checkrule';
+import {
+ CheckRuleDtlParams,
+ CheckRuleListItem,
+ iBAS_CODE_DTL,
+} from '/@/api/tigerapi/model/mesModel';
+import { useUserStore } from '/@/store/modules/user';
+import { buildUUID } from '/@/utils/uuid';
+import { formatToDateTime } from '/@/utils/dateUtil';
+import { useMultipleTabStore } from '/@/store/modules/multipleTab';
+import { isEmpty, isNullOrEmpty } from '/@/utils/is';
- export default defineComponent({
- name: 'RuleDetail',
- components: {
- BasicForm,
- BasicTable,
- PageWrapper,
- CheckruleDrawer,
- [Card.name]: Card,
- TableAction,
- },
- setup(props) {
- const route = useRoute();
- const go = useGo();
- const tableRef = ref<Nullable<TableActionType>>(null);
- const RuleObj = ref(JSON.parse(decodeURI(route.params?.id as string)));
- const { setTitle } = useTabs();
- const isUpdate = ref(true);
- const canResize = ref(false);
- const loading = ref(false);
- const striped = ref(true);
- const border = ref(true);
- const pagination = ref<any>(false);
- const actionColumn = ref({
- width: 80,
- title: '鎿嶄綔',
- dataIndex: 'action',
- slots: { customRender: 'action' },
- });
- const tabStore = useMultipleTabStore();
- const router = useRouter();
+export default defineComponent({
+ name: 'RuleDetail',
+ components: {
+ BasicForm,
+ BasicTable,
+ PageWrapper,
+ CheckruleDrawer,
+ [Card.name]: Card,
+ TableAction,
+ },
+ setup(props) {
+ const route = useRoute();
+ const go = useGo();
+ const tableRef = ref<Nullable<TableActionType>>(null);
+ const RuleObj = ref(JSON.parse(decodeURI(route.params?.id as string)));
+ const { setTitle } = useTabs();
+ const isUpdate = ref(true);
+ const canResize = ref(false);
+ const loading = ref(false);
+ const striped = ref(true);
+ const border = ref(true);
+ const pagination = ref<any>(false);
+ const actionColumn = ref({
+ width: 80,
+ title: '鎿嶄綔',
+ dataIndex: 'action',
+ slots: { customRender: 'action' },
+ });
+ const tabStore = useMultipleTabStore();
+ const router = useRouter();
- const { currentRoute } = router;
- function getCurrentTab() {
- const route = unref(currentRoute);
- return tabStore.getTabList.find((item) => item.fullPath === route.fullPath)!;
+ const { currentRoute } = router;
+ function getCurrentTab() {
+ const route = unref(currentRoute);
+ return tabStore.getTabList.find((item) => item.fullPath === route.fullPath)!;
+ }
+ const currentTab = getCurrentTab();
+ var _title =
+ RuleObj.value.RULE_CODE == '0' ? '鏂板瑙勫垯' : '缂栬緫瑙勫垯锛�' + RuleObj.value.RULE_CODE;
+ setTitle(_title);
+ const [registerDrawer, { openDrawer }] = useDrawer();
+ const [register, { resetFields, setFieldsValue, getFieldsValue, validate }] = useForm({
+ labelWidth: 120,
+ baseColProps: {
+ span: 24,
+ },
+ schemas: newFormSchema,
+ showActionButtonGroup: false,
+ });
+ const [
+ registerTest,
+ {
+ setFieldsValue: setFieldsValueTest,
+ getFieldsValue: getFieldsValueTest,
+ validate: validateTestForm,
+ },
+ ] = useForm({
+ labelWidth: 120,
+ baseColProps: {
+ span: 24,
+ },
+ schemas: testSchemas,
+ showActionButtonGroup: false,
+ });
+ const params: CheckRuleDtlParams = {
+ RULE_ID: RuleObj.value.RULE_CODE == '0' ? buildUUID() : (RuleObj.value.ID as string),
+ };
+ const data = ref([] as iBAS_CODE_DTL[]);
+ onMounted(async () => {
+ resetFields();
+ pagination.value = { pageSize: 6 };
+ data.value = (await getRuleDtl(params)).Items;
+ const ruleData = (await getRuleById(params)).Items as CheckRuleListItem[];
+ if (!isNullOrEmpty(ruleData)) {
+ setFieldsValue(ruleData[0]);
+ setFieldsValueTest({
+ CHECK_REGEX: ruleData[0]?.CHECK_REGEX,
+ });
+ } else {
+ // setFieldsValue({
+ // ID: buildUUID(),
+ // CHECK_TYPE:0,
+ // CODE_LENGTH:0,
+ // });
+ // setFieldsValueTest({});
}
- const currentTab = getCurrentTab();
- var _title =
- RuleObj.value.RULE_CODE == '0' ? '鏂板瑙勫垯' : '缂栬緫瑙勫垯锛�' + RuleObj.value.RULE_CODE;
- setTitle(_title);
- const [registerDrawer, { openDrawer }] = useDrawer();
- const [register, { resetFields, setFieldsValue, getFieldsValue, validate }] = useForm({
- labelWidth: 120,
- baseColProps: {
- span: 24,
- },
- schemas: newFormSchema,
- showActionButtonGroup: false,
- });
- const [
- registerTest,
- {
- setFieldsValue: setFieldsValueTest,
- getFieldsValue: getFieldsValueTest,
- validate: validateTestForm,
- },
- ] = useForm({
- labelWidth: 120,
- baseColProps: {
- span: 24,
- },
- schemas: testSchemas,
- showActionButtonGroup: false,
- });
- const params: CheckRuleDtlParams = {
- RULE_ID: RuleObj.value.RULE_CODE == '0' ? buildUUID() : (RuleObj.value.ID as string),
- };
- const data = ref([] as iBAS_CODE_DTL[]);
- onMounted(async () => {
- resetFields();
- pagination.value = { pageSize: 6 };
- data.value = (await getRuleDtl(params)).Items;
- const ruleData = (await getRuleById(params)).Items as CheckRuleListItem[];
- if (!isNullOrEmpty(ruleData)) {
- setFieldsValue(ruleData[0]);
- setFieldsValueTest({
- CHECK_REGEX: ruleData[0]?.CHECK_REGEX,
- });
- }
- else{
+ });
- // setFieldsValue({
- // ID: buildUUID(),
- // CHECK_TYPE:0,
- // CODE_LENGTH:0,
- // });
- // setFieldsValueTest({});
- }
- });
-
- function getTableAction() {
- const tableAction = unref(tableRef);
- if (!tableAction) {
- throw new Error('tableAction is null');
- }
- return tableAction;
+ function getTableAction() {
+ const tableAction = unref(tableRef);
+ if (!tableAction) {
+ throw new Error('tableAction is null');
}
+ return tableAction;
+ }
- async function submitAll() {
- try {
- const [values, testValues] = await Promise.all([validate(), validateTestForm()]);
- values.ID =params.RULE_ID;
- const action = await SaveRule({ ...values, ...testValues });
- if (action.IsSuccessed) {
- await DeleteRuleDtl(params.RULE_ID);
- const dtlAction = await SaveRuleDtl(data.value);
- if (dtlAction.IsSuccessed) {
- cancel();
- }
+ async function submitAll() {
+ try {
+ const [values, testValues] = await Promise.all([validate(), validateTestForm()]);
+ values.ID = params.RULE_ID;
+ const action = await SaveRule({ ...values, ...testValues });
+ if (action.IsSuccessed) {
+ await DeleteRuleDtl(params.RULE_ID);
+ const dtlAction = await SaveRuleDtl(data.value);
+ if (dtlAction.IsSuccessed) {
+ cancel();
}
- } catch (error) {}
- }
- async function cancel() {
- try {
- tabStore.closeTab(currentTab, router);
- } catch (error) {}
- }
- async function handleCreate() {
- await validate();
- openDrawer(true, {
- RULE_ID: params.RULE_ID,
- isUpdate: false,
- });
- }
+ }
+ } catch (error) { }
+ }
+ async function cancel() {
+ try {
+ tabStore.closeTab(currentTab, router);
+ } catch (error) { }
+ }
+ async function handleCreate() {
+ await validate();
+ openDrawer(true, {
+ RULE_ID: params.RULE_ID,
+ isUpdate: false,
+ });
+ }
- function handleEdit(record: Recordable) {
- openDrawer(true, {
- record,
- isUpdate: true,
- });
- }
+ function handleEdit(record: Recordable) {
+ openDrawer(true, {
+ record,
+ isUpdate: true,
+ });
+ }
- function handleDelete(record: Recordable) {
+ function handleDelete(record: Recordable) {
+ var _data = data.value.map((item) => {
+ return item;
+ });
+ let index = _data.indexOf(record);
+ _data.splice(index, 1);
+ data.value = _data;
+ getTableAction().setProps({
+ dataSource: [],
+ });
+ getTableAction().setProps({
+ dataSource: data,
+ });
+ getTableAction().reload();
+ setData();
+ }
+
+ //鏂板瑙勫垯鏄庣粏
+ function handleSuccess(d, u) {
+ var Id = buildUUID();
+ isUpdate.value = u.isUpdate;
+ if (u.isUpdate) {
+ //鏇存柊
var _data = data.value.map((item) => {
+ if (item.ID == d.ID)
+ return {
+ ...item,
+ CHECK_LENGTH: d.CHECK_LENGTH,
+ DATA_CASE: d.DATA_CASE,
+ DATA_TYPE: d.DATA_TYPE,
+ DATA_REGEX: d.DATA_REGEX,
+ SERIAL_MAX: d.SERIAL_MAX,
+ SERIAL_MIN: d.SERIAL_MIN,
+ DATA_VALUE: d.DATA_VALUE,
+ REPEAT_TIMES: d.REPEAT_TIMES,
+ DESCRIPTION: d.DESCRIPTION,
+ CHECK_TABLE: d.CHECK_TABLE,
+ CHECK_FIELD: d.CHECK_FIELD,
+ FIXED_NOTLIKE: d.FIXED_NOTLIKE,
+ SERIAL_INTERVAL: d.SERIAL_INTERVAL,
+ SERIAL_IGNORE: d.SERIAL_IGNORE,
+ };
return item;
});
- let index = _data.indexOf(record);
- _data.splice(index, 1);
data.value = _data;
- getTableAction().setProps({
- dataSource: [],
- });
- getTableAction().setProps({
- dataSource: data,
- });
- getTableAction().reload();
- setData();
- }
-
- //鏂板瑙勫垯鏄庣粏
- function handleSuccess(d, u) {
- var Id = buildUUID();
- isUpdate.value = u.isUpdate;
- if (u.isUpdate) {
- //鏇存柊
- var _data = data.value.map((item) => {
- if (item.ID == d.ID)
- return {
- ...item,
- CHECK_LENGTH: d.CHECK_LENGTH,
- DATA_CASE: d.DATA_CASE,
- DATA_TYPE: d.DATA_TYPE,
- DATA_REGEX: d.DATA_REGEX,
- SERIAL_MAX: d.SERIAL_MAX,
- SERIAL_MIN: d.SERIAL_MIN,
- DATA_VALUE: d.DATA_VALUE,
- REPEAT_TIMES: d.REPEAT_TIMES,
- DESCRIPTION: d.DESCRIPTION,
- CHECK_TABLE: d.CHECK_TABLE,
- CHECK_FIELD: d.CHECK_FIELD,
- };
+ } else {
+ //鏂板
+ d.ID = Id;
+ d.CREATE_USER = useUserStore().getUserInfo.userId as string;
+ d.UPDATE_TIME = formatToDateTime(new Date());
+ d.UPDATE_USER = useUserStore().getUserInfo.userId as string;
+ var _data2: any[] = [];
+ if (!isEmpty(data.value)) {
+ _data2 = data.value.map((item) => {
return item;
});
- data.value = _data;
+ d.RULE_SEQ =
+ data.value.reduce((maxLength, item) => {
+ return Math.max(maxLength, item.RULE_SEQ);
+ }, 0) + 1;
} else {
- //鏂板
- d.ID = Id;
- d.CREATE_USER = useUserStore().getUserInfo.userId as string;
- d.UPDATE_TIME = formatToDateTime(new Date());
- d.UPDATE_USER = useUserStore().getUserInfo.userId as string;
- var _data2: any[] = [];
- if (!isEmpty(data.value)) {
- _data2 = data.value.map((item) => {
- return item;
- });
- d.RULE_SEQ =
- data.value.reduce((maxLength, item) => {
- return Math.max(maxLength, item.RULE_SEQ);
- }, 0) + 1;
- } else {
- d.RULE_SEQ = 1;
- }
- // _data2.splice(0, 0, d);
- _data2.push(d);
- data.value = _data2;
+ d.RULE_SEQ = 1;
}
-
- //閲嶆柊淇敼鏁版嵁婧�
-
- getTableAction().setProps({
- dataSource: [],
- });
- getTableAction().setProps({
- dataSource: data,
- });
- getTableAction().reload();
- setData();
+ // _data2.splice(0, 0, d);
+ _data2.push(d);
+ data.value = _data2;
}
- function setData() {
- var CHECK_TYPE = 0;
- var CHECK_REGEX = '^';
- const total = data.value.reduce((length, item) => {
- if (item.DATA_TYPE == 5) {
- CHECK_TYPE = 1;
- }
- CHECK_REGEX += item.DATA_REGEX;
- return (length += Number(item.CHECK_LENGTH) * Number(item.REPEAT_TIMES));
- }, 0);
- setFieldsValue({
- ...getFieldsValue(),
- ...{
- CODE_LENGTH: total,
- CHECK_TYPE: CHECK_TYPE,
- },
- });
- setFieldsValueTest({
- CHECK_REGEX: CHECK_REGEX + '$',
- });
- }
- function goBack() {
- // 鏈緥鐨勬晥鏋滄椂鐐瑰嚮杩斿洖濮嬬粓璺宠浆鍒拌处鍙峰垪琛ㄩ〉锛屽疄闄呭簲鐢ㄦ椂鍙繑鍥炰笂涓�椤�
- go('/CheckRule');
- }
- return {
- columns,
- dtlColumns,
- register,
- registerTest,
- resetFields,
- setFieldsValue,
- getFieldsValue,
- validate,
- data,
- canResize,
- loading,
- striped,
- border,
- pagination,
- actionColumn,
- registerDrawer,
- submitAll,
- cancel,
- tableRef,
- goBack,
- setData,
- handleCreate,
- handleEdit,
- handleDelete,
- handleSuccess,
- };
- },
- });
+ //閲嶆柊淇敼鏁版嵁婧�
+
+ getTableAction().setProps({
+ dataSource: [],
+ });
+ getTableAction().setProps({
+ dataSource: data,
+ });
+ getTableAction().reload();
+ setData();
+ }
+ function setData() {
+ var CHECK_TYPE = 0;
+ var CHECK_REGEX = '^';
+ const total = data.value.reduce((length, item) => {
+ if (item.DATA_TYPE == 6) {
+ CHECK_TYPE = 1;
+ }
+ CHECK_REGEX += item.DATA_REGEX;
+ return (length += Number(item.CHECK_LENGTH) * Number(item.REPEAT_TIMES));
+ }, 0);
+
+ setFieldsValue({
+ ...getFieldsValue(),
+ ...{
+ CODE_LENGTH: total,
+ CHECK_TYPE: CHECK_TYPE,
+ },
+ });
+ setFieldsValueTest({
+ CHECK_REGEX: CHECK_REGEX + '$',
+ });
+ }
+ function goBack() {
+ // 鏈緥鐨勬晥鏋滄椂鐐瑰嚮杩斿洖濮嬬粓璺宠浆鍒拌处鍙峰垪琛ㄩ〉锛屽疄闄呭簲鐢ㄦ椂鍙繑鍥炰笂涓�椤�
+ go('/CheckRule');
+ }
+ return {
+ columns,
+ dtlColumns,
+ register,
+ registerTest,
+ resetFields,
+ setFieldsValue,
+ getFieldsValue,
+ validate,
+ data,
+ canResize,
+ loading,
+ striped,
+ border,
+ pagination,
+ actionColumn,
+ registerDrawer,
+ submitAll,
+ cancel,
+ tableRef,
+ goBack,
+ setData,
+ handleCreate,
+ handleEdit,
+ handleDelete,
+ handleSuccess,
+ };
+ },
+});
</script>
<style lang="less" scoped>
- .high-form {
- padding-bottom: 48px;
- }
+.high-form {
+ padding-bottom: 48px;
+}
</style>
--
Gitblit v1.9.3