From 969725647117eb7ca148b2e8cfa9ec8b5eb432fa Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期二, 22 十月 2024 11:04:10 +0800
Subject: [PATCH] 工艺缓存优化
---
src/views/tigerprojects/system/menu/index.vue | 359 ++++++++++++++++++++++++++++++++++++-----------------------
1 files changed, 216 insertions(+), 143 deletions(-)
diff --git a/src/views/tigerprojects/system/menu/index.vue b/src/views/tigerprojects/system/menu/index.vue
index 82b309b..9eea644 100644
--- a/src/views/tigerprojects/system/menu/index.vue
+++ b/src/views/tigerprojects/system/menu/index.vue
@@ -1,154 +1,227 @@
<template>
- <div class="p-2">
- <BasicTable
- @register="registerTable"
- @fetch-success="onFetchSuccess"
- @expanded-rows-change="onExpandedRChg"
- >
- <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),
- },
- {
- icon: 'ant-design:delete-outlined',
- color: 'error',
- popConfirm: {
- title: '鏄惁纭鍒犻櫎?',
- placement: 'left',
- confirm: handleDelete.bind(null, record),
- },
- },
- ]"
- />
- </template>
- </BasicTable>
- <MenuDrawer @register="registerDrawer" @success="handleSuccess" />
- </div>
+ <PageWrapper title="鑿滃崟绠＄悊" content="杩欓噷鏄彍鍗曠殑澧炲姞鍒犻櫎鍜屼慨鏀�" contentBackground>
+ <template #footer>
+ <a-tabs default-active-key="detail" v-model:activeKey="currentKey">
+ <a-tab-pane key="detailfirst" tab="BS鑿滃崟" />
+ <a-tab-pane key="detailsecond" tab="PDA鑿滃崟" />
+ </a-tabs>
+ </template>
+ <div>
+ <div v-if="currentKey == 'detailfirst'">
+ <div class="p-2">
+ <BasicTable
+ @register="registerTable"
+ @fetch-success="onFetchSuccess"
+ @expanded-rows-change="onExpandedRChg"
+ >
+ <template #toolbar>
+ <a-button type="primary" @click="handleCreate('BS 鑿滃崟')"> 鏂板鑿滃崟 </a-button>
+ </template>
+ <template #action="{ record }">
+ <TableAction
+ :actions="[
+ {
+ icon: 'clarity:note-edit-line',
+ onClick: handleEdit.bind(null, record, 'BS 鑿滃崟'),
+ name: '',
+ },
+ {
+ icon: 'ant-design:delete-outlined',
+ color: 'error',
+ popConfirm: {
+ title: '鏄惁纭鍒犻櫎?',
+ placement: 'left',
+ confirm: handleDelete.bind(null, record),
+ },
+ name: '',
+ },
+ ]"
+ />
+ </template>
+ </BasicTable>
+ </div>
+ </div>
+ <div v-if="currentKey == 'detailsecond'">
+ <div class="p-2">
+ <BasicTable
+ @register="registerTableSecond"
+ @fetch-success="onFetchSuccess"
+ @expanded-rows-change="onExpandedRChg"
+ >
+ <template #toolbar>
+ <a-button type="primary" @click="handleCreate('PDA')"> 鏂板鑿滃崟 </a-button>
+ </template>
+ <template #action="{ record }">
+ <TableAction
+ :actions="[
+ {
+ icon: 'clarity:note-edit-line',
+ onClick: handleEdit.bind(null, record, 'PDA'),
+ name: '',
+ },
+ {
+ icon: 'ant-design:delete-outlined',
+ color: 'error',
+ popConfirm: {
+ title: '鏄惁纭鍒犻櫎?',
+ placement: 'left',
+ confirm: handleDelete.bind(null, record),
+ },
+ name: '',
+ },
+ ]"
+ />
+ </template>
+ </BasicTable>
+ </div>
+ </div>
+ <MenuDrawer @register="registerDrawer" @success="handleSuccess" />
+ </div>
+ </PageWrapper>
</template>
-<script lang="ts">
- import { defineComponent, nextTick, ref, unref } from 'vue';
-
+<script lang="ts" setup>
+ import { nextTick, ref, unref } from 'vue';
+ import { PageWrapper } from '/@/components/Page';
import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { getMenuList, DeleteMenu } from '/@/api/tigerapi/system';
import { useDrawer } from '/@/components/Drawer';
import MenuDrawer from './MenuDrawer.vue';
-
+ import { Tabs } from 'ant-design-vue';
import { columns, searchFormSchema } from './menu.data';
- export default defineComponent({
- name: 'MenuManagement',
- components: { BasicTable, MenuDrawer, TableAction },
- setup() {
- const expandedRowKeys = ref<string[]>([]);
- const [registerDrawer, { openDrawer }] = useDrawer();
- const [registerTable, { reload, expandAll, expandRows }] = useTable({
- // const [registerTable, { reload, expandRows }] = useTable({
- title: '鑿滃崟鍒楄〃',
- api: getMenuList,
- columns,
- // formConfig: {
- // labelWidth: 120,
- // schemas: searchFormSchema,
- // },
- isTreeTable: true,
- // pagination: false,
- // striped: false,
- // // useSearchForm: true,
- showTableSetting: true,
- // bordered: true,
- // showIndexColumn: false,
- // canResize: false,
- actionColumn: {
- width: 80,
- title: '鎿嶄綔',
- dataIndex: 'action',
- slots: { customRender: 'action' },
- fixed: undefined,
- },
- rowKey: 'id',
- });
-
- function handleCreate() {
- openDrawer(true, {
- isUpdate: false,
- });
- }
-
- function handleEdit(record: Recordable) {
- openDrawer(true, {
- record,
- isUpdate: true,
- });
- }
-
- function handleDelete(record: Recordable) {
- console.log(record);
- //鍒犻櫎鑿滃崟
- const apiAction = DeleteMenu(record);
- apiAction.then((onfulfilled) => {
- if (onfulfilled.IsSuccessed) {
- reload();
- }
- });
- }
-
- function handleSuccess({ values }) {
- reload();
- nextTick(() => {
- setTimeout(() => {
- var tdList = document.querySelectorAll(
- '.ant-table-cell.ant-table-cell-ellipsis.ant-table-cell-with-append',
- );
- for (var i = 0; i < tdList.length; i++) {
- if (tdList[i].attributes['title'].nodeValue == values.menuName) {
- tdList[i].scrollIntoView();
- }
- }
- }, 1000);
- // console.log(
- // document.querySelectorAll(
- // '.ant-table-cell.ant-table-cell-ellipsis.ant-table-cell-with-append',
- // )[8].attributes['title'].nodeValue, //[8].attributes['data-row-key'].nodeValue
- // values.menuName,
- // );
- });
- }
-
- function onFetchSuccess(record: Recordable) {
- // 婕旂ず榛樿灞曞紑鎵�鏈夎〃椤�
- nextTick(() => {
- if (expandedRowKeys.value.length == 0) {
- expandAll();
- } else {
- expandRows(expandedRowKeys.value);
- }
- });
- console.log(record);
- //nextTick(collapseAll);
- // expandRows([record.items[1].id]);
- }
-
- function onExpandedRChg(record: Recordable) {
- expandedRowKeys.value = record;
- console.log(11, record);
- }
-
- return {
- registerTable,
- registerDrawer,
- handleCreate,
- handleEdit,
- handleDelete,
- handleSuccess,
- onFetchSuccess,
- onExpandedRChg,
- };
+ const ATabs = ref(Tabs);
+ const ATabPane = ref(Tabs.TabPane);
+ var currentKey = ref('detailfirst');
+ const expandedRowKeys = ref<string[]>([]);
+ const [registerDrawer, { openDrawer }] = useDrawer();
+ const [registerTable, { reload, expandAll, expandRows }] = useTable({
+ // const [registerTable, { reload, expandRows }] = useTable({
+ title: '鑿滃崟鍒楄〃',
+ api: getMenuList,
+ searchInfo: { menuName: 'BS 鑿滃崟' },
+ columns,
+ formConfig: {
+ labelWidth: 120,
+ schemas: searchFormSchema,
},
+ isTreeTable: true,
+ // pagination: false,
+ // striped: false,
+ useSearchForm: true,
+ showTableSetting: true,
+ // bordered: true,
+ // showIndexColumn: false,
+ // canResize: false,
+ actionColumn: {
+ width: 80,
+ title: '鎿嶄綔',
+ dataIndex: 'action',
+ slots: { customRender: 'action' },
+ fixed: undefined,
+ },
+ rowKey: 'id',
});
+
+ const [
+ registerTableSecond,
+ { reload: reloadSecond, expandAll: expandAllSecond, expandRows: expandRowsSecond },
+ ] = useTable({
+ // const [registerTable, { reload, expandRows }] = useTable({
+ title: '鑿滃崟鍒楄〃',
+ api: getMenuList,
+ searchInfo: { menuName: 'PDA' },
+ columns,
+ formConfig: {
+ labelWidth: 120,
+ schemas: searchFormSchema,
+ },
+ isTreeTable: true,
+ // pagination: false,
+ // striped: false,
+ useSearchForm: true,
+ showTableSetting: true,
+ // bordered: true,
+ // showIndexColumn: false,
+ // canResize: false,
+ actionColumn: {
+ width: 80,
+ title: '鎿嶄綔',
+ dataIndex: 'action',
+ slots: { customRender: 'action' },
+ fixed: undefined,
+ },
+ rowKey: 'id',
+ });
+
+ function handleCreate(menuName: string) {
+ openDrawer(true, {
+ isUpdate: false,
+ menuName: menuName,
+ });
+ }
+
+ function handleEdit(record: Recordable, menuName: string) {
+ openDrawer(true, {
+ record,
+ isUpdate: true,
+ menuName: menuName,
+ });
+ }
+
+ function handleDelete(record: Recordable) {
+ console.log(record);
+ //鍒犻櫎鑿滃崟
+ const apiAction = DeleteMenu(record);
+ apiAction.then((onfulfilled) => {
+ if (onfulfilled.IsSuccessed) {
+ reloadSecond();
+ reload();
+ }
+ });
+ }
+
+ function handleSuccess(d) {
+ if (d.menuName == 'PDA') {
+ reloadSecond();
+ } else {
+ reload();
+ }
+ nextTick(() => {
+ setTimeout(() => {
+ var tdList = document.querySelectorAll(
+ '.ant-table-cell.ant-table-cell-ellipsis.ant-table-cell-with-append',
+ );
+ for (var i = 0; i < tdList.length; i++) {
+ if (tdList[i].attributes['title'].nodeValue == d.values.menuName) {
+ tdList[i].scrollIntoView();
+ }
+ }
+ }, 1000);
+ // console.log(
+ // document.querySelectorAll(
+ // '.ant-table-cell.ant-table-cell-ellipsis.ant-table-cell-with-append',
+ // )[8].attributes['title'].nodeValue, //[8].attributes['data-row-key'].nodeValue
+ // values.menuName,
+ // );
+ });
+ }
+
+ function onFetchSuccess(record: Recordable) {
+ // 婕旂ず榛樿灞曞紑鎵�鏈夎〃椤�
+ nextTick(() => {
+ if (expandedRowKeys.value.length == 0) {
+ // expandAll();
+ } else {
+ expandRows(expandedRowKeys.value);
+ }
+ });
+ console.log(record);
+ //nextTick(collapseAll);
+ // expandRows([record.items[1].id]);
+ }
+
+ function onExpandedRChg(record: Recordable) {
+ expandedRowKeys.value = record;
+ console.log(11, record);
+ }
</script>
--
Gitblit v1.9.3