Skip to content

csbr-daop / fe-data-trusted-space

Go to a project
Toggle navigation
Toggle navigation pinning
e7d9e10e by lihua
Options

数据目录分类页面开发

1 parent 55a23cac
Inline Side-by-side
Showing 2 changed files with 936 additions and 0 deletions
src/router/modules/dataAsset.ts
...@@ -334,5 +334,26 @@ const routes: RouteRecordRaw[] = [ ...@@ -334,5 +334,26 @@ const routes: RouteRecordRaw[] = [
334 } 334 }
335 ], 335 ],
336 }, 336 },
337 {
338 path: '/data-product/data-catalog-sort',
339 component: Layout,
340 meta: {
341 title: '数据目录分类',
342 icon: 'sidebar-videos',
343 },
344 children: [
345 {
346 path: '',
347 name: 'productDataCatalogSort',
348 component: () => import('@/views/data_asset/productDataCatalogSort.vue'),
349 meta: {
350 title: '',
351 sidebar: false,
352 breadcrumb: false,
353 cache: true
354 },
355 },
356 ]
357 }
337 ] 358 ]
338 export default routes 359 export default routes
......
src/views/data_asset/productDataCatalogSort.vue 0 → 100644
1 <!-- 列表模板带tab切换 -->
2 <template>
3 <div class="container_wrap full flex">
4 <!-- 侧边table表格 start -->
5 <div class="aside_wrap">
6 <el-input class="tree_search_input" v-model="asidePage.searchKey" @change="asideSearch()"
7 :placeholder="asidePage.queryPlaceholder" :prefix-icon="SearchIcon" clearable />
8 <el-button class="tree_add" :icon="Plus" @click="loadAsideDialog">{{ asidePage.addButtonText }}</el-button>
9 <el-table ref="asideTable" style="height: calc(100% - 90px);" :data="asideTableData" highlight-current-row
10 :show-header="false" @row-click="searchDict">
11
12 <el-table-column prop="dictTypeName">
13 <template #default="scope">
14 <el-tooltip v-if="scope.row.remarks" class="item" effect="light" :content="scope.row.remarks"
15 placement="left">
16 <div style="padding-left: 8px;">{{ scope.row.dicName }}</div>
17 </el-tooltip>
18 <div v-else style="padding-left: 8px;">{{ scope.row.dicName }}</div>
19
20 </template>
21 </el-table-column>
22 <el-table-column label="操作" width="46" align="right">
23 <template #default="scope">
24 <div class="btn">
25 <el-icon class="el-icon-edit" @click.stop="toAsideEdit(scope.row)">
26 <Edit />
27 </el-icon>
28 <el-icon class="el-icon-delete" @click.stop="toAsideDelete(scope.row)">
29 <Delete />
30 </el-icon>
31 </div>
32 </template>
33 </el-table-column>
34 </el-table>
35 <el-pagination class="tree-page" small style="justify-content:space-between" :current-page="asidePage.curr"
36 layout="prev, pager, next" :background="false" :page-size="asidePage.limit" :pager-count="5"
37 :total="asidePage.total" @current-change="handleCurrentChange" />
38
39 </div>
40 <!-- 侧边table表格 end -->
41
42 <!-- 列表区域 start -->
43 <div class="main_wrap">
44 <div class="table_tool_wrap">
45 <TableTools :searchItems="searchItemList" :searchId="'user-manage-search'" @search="toSearch" />
46 <div class="tools_btns">
47 <el-button type="primary" @click="loadDialog" v-preReClick>添加规则</el-button>
48 <el-button @click="batchDelete">批量删除</el-button>
49 </div>
50 </div>
51 <div class="table_panel_wrap">
52 <Table :tableInfo="tableInfo" @tableSelectionChange="tableSelectionChange" @tablePageChange="tablePageChange" />
53 </div>
54 </div>
55 <!-- 列表区域 end -->
56 <!-- 侧边抽屉组件 start -->
57 <Drawer ref="asideDrawerRef" :drawerInfo="asideDrawerInfo" @drawerBtnClick="asideDrawerBtnClick">
58 </Drawer>
59 <!-- 侧边抽屉组件 end -->
60 <!-- 右边抽屉组件 start -->
61 <Drawer ref="valueDrawerRef" :drawerInfo="drawerInfo" @drawerBtnClick="drawerBtnClick"
62 @drawer-select-change="handleDrawSelectChange">
63 </Drawer>
64 <!-- 右边抽屉组件 end -->
65 </div>
66 </template>
67
68 <script lang="ts" setup name="productDataCatalogSort">
69 import { ref, onMounted } from "vue";
70 import Drawer from "@/components/Drawer/index.vue";
71 import { ElMessage } from "element-plus"
72 import { Plus, Edit, Delete, Search as SearchIcon } from "@element-plus/icons-vue";
73 import TableTools from '@/components/Tools/table_tools.vue';
74 import { commonPageConfig } from "@/components/PageNav";
75 import { useValidator } from '@/hooks/useValidator';
76
77 const { required } = useValidator();
78 const { proxy } = getCurrentInstance() as any;
79
80 const leftTableLoading = ref(false)
81
82 const submitForm = async () => {
83 let res1 = await formItem1.value.submitForm()
84 console.log("submitForm111", res1);
85
86 if (res1) {
87 let resultForm1 = await formItem1.value.getData()
88 resultForm1.remarks = resultForm1.remarks || '';
89 let message = resultForm1.guid ? '修改成功' : '新增成功'
90 // dictApi.addDictionary(resultForm1).then(res => {
91 // if (res.data.code === proxy.$passCode) {
92 // proxy.$ElMessage({
93 // type: 'success',
94 // message: message
95 // })
96 // drawerInfo.value.visible = false;
97 // toSearch(params.value)
98 // }
99 // });
100 }
101 }
102 const asideSubmitForm = async () => {
103 let resultForm1 = asideDrawerRef.value?.getDrawerConRef('drawerFormRef')?.formInline
104 let message = resultForm1.guid ? '修改成功' : '新增成功'
105 // dictApi.addDictClass(resultForm1).then(res => {
106 // if (res.data.code === proxy.$passCode) {
107 // proxy.$ElMessage({
108 // type: 'success',
109 // message: message
110 // })
111 // asideDrawerInfo.value.visible = false;
112 // asidePage.value.curr = 1;
113 //asidePage.value.searchKey = '';
114 // asideSearch()
115 // }
116 // })
117 }
118
119 const params = ref({})
120 // 分页配置
121 const asidePage = ref({
122 limit: 14,
123 curr: 1,
124 total: 0,
125 totalPages: 1,
126 searchKey: '',
127 addButtonText: "添加分类",
128 queryPlaceholder: "输入关键字搜索",
129 sizes: [
130 { label: "10", value: 10 },
131 { label: "50", value: 50 },
132 ],
133 });
134 const asideTableData = ref<any>([]);
135 const allClassData = ref<any>([]);
136 const dictType = ref('');
137 const classGuid = ref('');
138
139 const classEditFormItems = ref([
140 {
141 label: '分类名称',
142 type: 'input',
143 maxlength: 50,
144 placeholder: '请输入',
145 field: 'dictTypeName',
146 default: '',
147 clearable: true,
148 required: true
149 },
150 {
151 label: '分类编码',
152 type: 'input',
153 maxlength: 50,
154 placeholder: '请输入',
155 field: 'code',
156 regexp: /[\W_]/g,
157 default: '',
158 clearable: true,
159 required: false,
160 },
161 {
162 label: '界面排序',
163 type: 'input',
164 maxlength: 50,
165 placeholder: '请输入',
166 field: 'orderNum',
167 regexp: /[^\d]/g,
168 default: '',
169 clearable: true,
170 required: false,
171 },
172 {
173 label: '启用状态',
174 type: 'switch',
175 field: 'bizState',
176 default: 'Y',
177 placeholder: '请选择',
178 activeValue: 'Y',
179 inactiveValue: 'S',
180 switchWidth: 32,
181 },
182 {
183 label: '描述',
184 placeholder: '该输入',
185 field: 'remarks',
186 type: 'textarea',
187 default: '',
188 maxlength: 250,
189 block: true,
190 clearable: true,
191 required: false,
192 }
193 ]);
194
195 const classEditFormRules = ref({
196 dictTypeName: [required('请输入分类名称')],
197 });
198
199 // 添加字典分类打开抽屉
200 const loadAsideDialog = () => {
201 // 抽屉逻辑
202 asideDrawerInfo.value.header.title = '新增分类'
203 asideDrawerInfo.value.visible = true;
204 classEditFormItems.value.forEach(item => {
205 item.default = '';
206 if (item.field == 'bizState') {
207 item.default = 'Y';
208 }
209 })
210 };
211 // 分页
212 const handleCurrentChange = (val: number) => {
213 asidePage.value.curr = unref(val);
214 asideSearch()
215 }
216 // 左边表格的搜索
217 const asideSearch = () => {
218 let params: any = {
219 pageIndex: asidePage.value.curr,
220 pageSize: asidePage.value.limit,
221 searchKey: asidePage.value.searchKey,
222 };
223 getAsideTableData(params)
224 };
225
226 // 获取左边表格
227 const getAsideTableData = (params: any) => {
228 // leftTableLoading.value = true;
229 // dictApi.getDictClass(params).then((res: any) => {
230 // leftTableLoading.value = false;
231 // if (res.code == proxy.$passCode) {
232 // let data = res.data || {};
233 // asideTableData.value = res.data.records ?? [];
234 // asidePage.value.limit = data.pageSize;
235 // asidePage.value.curr = data.pageIndex;
236 // // asidePage.value.totalPage = data.totalPages;
237 // asidePage.value.total = data.totalRows;
238
239 // if (asideTableData.value.length > 0) {
240 // let row = asideTableData.value[0]
241 // proxy.$refs['asideTable'].setCurrentRow(row);
242 // // 点击分类
243 // dictType.value = row.dicName
244 // classGuid.value = row.guid
245 // page.value.curr = 1;
246 // toSearch({})
247 // }
248 // } else {
249 // ElMessage({
250 // type: "info",
251 // message: res.data.msg,
252 // });
253 // }
254 // })
255 }
256
257 //左边列表点击
258 const searchDict = (row?) => {
259 params.value = {}
260 dictType.value = row.dicName
261 classGuid.value = row.guid
262 toSearch({})
263
264 }
265
266 const toAsideEdit = (data) => {
267 let row = data
268 asideDrawerInfo.value.header.title = '编辑分类'
269 asideDrawerInfo.value.visible = true;
270 classEditFormItems.value.forEach(item => {
271 item.default = row[item.field];
272 })
273 }
274 const toAsideDelete = (data) => { // 删除
275 let row = data
276 proxy.$openMessageBox("数据删除后不可恢复，确定是否删除？", () => {
277 // dictApi.removeDict([row.guid]).then(async (res) => {
278 // if (res.data.code === proxy.$passCode) {
279 // proxy.$ElMessage({
280 // type: 'success',
281 // message: '删除成功'
282 // })
283 // asidePage.value.curr = 1;
284 // asideSearch()
285 // }
286
287 // })
288 }, () => {
289 proxy.$ElMessage.info("已取消删除");
290 })
291
292 }
293
294 /** 新增分类的form */
295 const classEditFormInfo = ref({
296 type: "form",
297 title: "",
298 col: "span",
299 formInfo: {
300 id: "add-class-form",
301 readonly: false,
302 items: classEditFormItems.value,
303 rules: classEditFormRules.value,
304 },
305 });
306
307 const asideDrawerRef = ref();
308
309 // 侧边表单抽屉schema
310 const asideDrawerInfo: any = ref({
311 visible: false,
312 direction: 'rtl',
313 size: 520,
314 header: {
315 title: '添加分类',
316 },
317 type: '',
318 container: {
319 contents: [classEditFormInfo.value],
320 },
321 footer: {
322 btns: [
323 { type: 'default', label: '取消', value: 'cancel' },
324 { type: 'primary', label: '确定', value: 'save', loading: false },
325 ]
326 }
327 })
328 // 抽屉的按钮区域
329 const asideDrawerBtnClick = (btn) => {
330 if (btn.value == "cancel") {
331 asideDrawerInfo.value.visible = false;
332 } else {
333 if (btn.value == "save") {
334 asideSubmitForm()
335 } else {
336 asideDrawerInfo.value.container.id = "add-dictClass-form";
337 asideDrawerInfo.value.visible = false;
338 }
339 }
340 };
341
342 const searchItemList = ref([
343 {
344 type: 'input',
345 label: '',
346 field: 'dicName',
347 default: '',
348 maxlength: 50,
349 placeholder: '名称',
350 clearable: true,
351 visible: true
352 }, {
353 type: 'input',
354 label: '',
355 field: 'dicValue',
356 default: '',
357 maxlength: 50,
358 placeholder: '值',
359 clearable: true,
360 visible: true
361 },
362 ]);
363 // 常量区域
364 const formItem1 = ref()
365
366 const tableData = ref([]);//右边表格
367 const selectRowData = ref([]);//表格的选中行数据
368 const classList = ref([]);//抽屉里上级字典列表
369
370 const valueDrawerRef = ref();
371
372 const dictFormItems: any = ref([
373 {
374 label: '分类',
375 type: 'select',
376 placeholder: '请选择',
377 field: 'classGuid',
378 options: allClassData.value,
379 props: {
380 label: "dicName",
381 value: "guid",
382 },
383 filterable: true,
384 clearable: true,
385 default: '',
386 required: true,
387 block: false,
388 },
389
390 // {
391 // field: "classGuid",
392 // label: "字典分类",
393 // component: "Select",
394 // colProps: {
395 // span: getSpan()
396 // },
397 // formItemProps: {
398 // rules: [required()]
399 // },
400
401 // componentProps: {
402 // placeholder: "请选择字典分类",
403 // options: allClassData,
404 // props: {
405 // key: "guid",
406 // value: "guid",
407 // label: "dicName"
408 // },
409 // on: {
410 // change: (val) => {
411 // classChange(val)
412 // }
413 // }
414 // }
415 // },
416
417 {
418 label: '上级分类',
419 type: 'tree-select',
420 placeholder: '请选择',
421 field: 'parentGuid',
422 options: classList.value,
423 showAllLevels: false,
424 checkStrictly: false,//只能选择叶子节点。
425 lazy: false,
426 props: {
427 label: "dicName",
428 value: "guid",
429 children: 'childList',
430 checkStrictly: true,
431 emitPath: false
432 },
433 filterable: true,
434 clearable: true,
435 default: '',
436 required: true
437 },
438
439 {
440 field: "dicName",
441 label: "名称",
442 type: 'input',
443 maxlength: 50,
444 placeholder: '请输入',
445 default: '',
446 clearable: true,
447 required: true,
448 block: false
449 },
450 {
451 field: "dicValue",
452 label: "值",
453 type: 'input',
454 maxlength: 50,
455 placeholder: '请输入',
456 default: '',
457 clearable: true,
458 required: true,
459 block: false
460 },
461 {
462 label: '界面排序',
463 type: 'input',
464 maxlength: 50,
465 placeholder: "请输入，不填写自动生成",
466 field: 'orderNum',
467 regexp: /[^\d]/g,
468 default: '',
469 clearable: true,
470 required: false,
471 block: false
472 },
473 {
474 label: '启用状态',
475 type: 'switch',
476 field: 'bizState',
477 default: 'Y',
478 placeholder: '请选择',
479 activeValue: 'Y',
480 inactiveValue: 'S',
481 switchWidth: 32,
482 },
483 {
484 label: '描述',
485 placeholder: '该输入',
486 field: 'remarks',
487 type: 'textarea',
488 default: '',
489 maxlength: 250,
490 block: true,
491 clearable: true,
492 required: false,
493 }
494 ]);
495
496 const dictFormRules = ref({
497 classGuid: [required('请选择分类')],
498 dicName: [required('请输入名称')],
499 dicValue: [required('请输入值')],
500 });
501
502 /** 新增分类的form */
503 const dictFormItemInfo = ref({
504 type: "form",
505 title: "",
506 col: "span",
507 formInfo: {
508 id: "add-dict-form",
509 readonly: false,
510 items: dictFormItems.value,
511 rules: dictFormRules.value,
512 },
513 });
514
515 // 抽屉schema
516 const drawerInfo: any = ref({
517 visible: false,
518 size: 600,
519 header: {
520 title: "新增/编辑规则",
521 },
522 type: "",
523 container: {
524 contents: [dictFormItemInfo.value],
525 },
526 footer: {
527 visible: true,
528 btns: [
529 { type: "default", label: "取消", value: "cancel" },
530 { type: "primary", label: "确认 ", value: "save", loading: false },
531 ],
532 },
533 });
534
535 // 添加字典打开抽屉
536 const loadDialog = () => {
537 drawerInfo.value.header.title = '新增规则'
538 // dictApi.getDictTable({
539 // classGuid: row.classGuid
540 // }).then((res: any) => {
541 // if (res.code == proxy.$passCode) {
542 // classList.value = res?.data || [];
543 // dictFormItems.value[1].options = classList.value
544 // } else {
545 // proxy.$ElMessage.error(res.msg);
546 // }
547 // })
548 drawerInfo.value.visible = true;
549 let value = {
550 guid: '',
551 // className: row.parentGuid, // 字典分类
552 classGuid: classGuid.value, // 字典分类
553 parentGuid: '', // 上级字典
554 dicName: '', // 字典名称
555 dicValue: '', // 字典值
556 remarks: '', // 字典描述
557 orderNum: null, // 界面排序
558 bizState: 'Y' // 启用状态
559 };
560 dictFormItems.value.forEach(item => {
561 item.default = value[item.field];
562
563 })
564 dictFormItemInfo.value.formInfo.items = dictFormItems.value;
565 drawerInfo.value.container.contents[0] = dictFormItemInfo.value;
566
567 };
568 // 表格选中事件
569 const tableSelectionChange = (val) => {
570 selectRowData.value = val.map((item) => item.guid);
571 }
572 // 批量删除
573 function batchDelete(param) {
574 if (param == "delete") {
575 if (selectRowData.value.length == 0) {
576 ElMessage({
577 type: "info",
578 message: "请选择需要删除的数据",
579 });
580 return;
581 }
582 proxy.$openMessageBox("数据删除后不可恢复，确定是否删除？", () => {
583 // dictApi.removeDict(selectRowData.value).then(async (res) => {
584 // if (res.data.code === proxy.$passCode) {
585 // proxy.$ElMessage({
586 // type: 'success',
587 // message: '删除成功'
588 // })
589 // page.value.curr = 1;
590 // toSearch(params.value)
591 // }
592 // })
593 });
594 }
595 };
596
597 const tablePageChange = (info) => {
598 page.value.curr = Number(info.curr);
599 page.value.limit = Number(info.limit);
600 tableInfo.value.page.limit = page.value.limit;
601 tableInfo.value.page.curr = page.value.curr;
602 getTableData();
603 };
604
605 const page = ref({
606 ...commonPageConfig,
607 dicName: '',
608 dicValue: ''
609 });
610
611 const toSearch = (val: any, clear: boolean = false) => {
612 page.value.curr = 1;
613 if (clear) {
614 searchItemList.value.map(item => item.default = '')
615 page.value.dicName = '';
616 page.value.dicValue = '';
617 getTableData();
618 return;
619 }
620 page.value.dicName = val.dicName;
621 page.value.dicValue = val.dicValue;
622 getTableData();
623 };
624
625 const getTableData = () => {
626 // tableInfo.value.loading = true;
627 // getPlanList({
628 // pageIndex: page.value.curr, pageSize: page.value.limit,
629 // dicName: page.value.dicName,
630 // dicValue: page.value.dicValue,
631 // classGuid: classGuid.value
632 // }).then((res: any) => {
633 // tableInfo.value.loading = false;
634 // if (res === undefined) {
635 // return;
636 // }
637 // if (res.code == proxy.$passCode) {
638 // const data = res.data || {}
639 // tableInfo.value.data = data.records || []
640 // tableInfo.value.page.limit = data.pageSize
641 // tableInfo.value.page.curr = data.pageIndex
642 // tableInfo.value.page.rows = data.totalRows
643 // } else {
644 // ElMessage.error(res.msg);
645 // }
646 // })
647 };
648
649 const tableInfo = ref({
650 id: 'rule-table',
651 loading: false,
652 fields: [
653 {
654 label: "名称",
655 field: "dicName",
656 fixed: 'left',
657 width: 140,
658 },
659 {
660 label: "值",
661 field: "dicValue",
662 width: 140,
663 },
664 {
665 label: "界面排序",
666 field: "orderNum",
667 width: "85",
668 align: "center",
669 },
670 {
671 label: "字典描述",
672 field: "remarks",
673 width: 160,
674 },
675 {
676 label: "创建人",
677 field: "createUserName",
678 width: "140",
679 },
680 {
681 label: "创建时间",
682 field: "createTime",
683 width: 170
684 },
685 {
686 label: "更新人",
687 field: "updateUserName",
688 width: "140",
689 },
690 {
691 label: "更新时间",
692 field: "updateTime",
693 width: 170
694 },
695 ],
696 data: [],
697 showPage: true,
698 page: {
699 type: "normal",
700 rows: 0,
701 ...page.value,
702 },
703 actionInfo: {
704 label: "操作",
705 type: "btn",
706 width: 100,
707 btns: (scope) => {
708 return [
709 {
710 label: "编辑", value: "edit", click: (scope) => {
711 toEdit(scope.row)
712 }
713 },
714 {
715 label: "删除", value: "delete", click: (scope) => {
716 toDelete(scope.row)
717 }
718 },
719 ]
720 }
721 }
722 });
723
724 const toEdit = async (data) => {
725 let { row } = data
726 if (!row.classGuid) return
727 // dictApi.getDictTable({
728 // classGuid: row.classGuid
729 // }).then((res: any) => {
730 // if (res.code == proxy.$passCode) {
731 // classList.value = res?.data || [];
732 // dictFormItems.value[1].options = classList.value
733 // } else {
734 // proxy.$ElMessage.error(res.msg);
735 // }
736 // })
737
738 drawerInfo.value.header.title = '编辑'
739 drawerInfo.value.visible = true;
740 dictFormItems.value.forEach(item => {
741 item.default = row[item.field];
742 })
743 }
744 const toDelete = (data) => { // 删除
745 let { row } = data
746 proxy.$openMessageBox("数据删除后不可恢复，确定是否删除？", () => {
747 // dictApi.removeDict([row.guid]).then(async (res) => {
748 // if (res.data.code === proxy.$passCode) {
749 // proxy.$ElMessage({
750 // type: 'success',
751 // message: '删除成功'
752 // })
753 // }
754 // page.value.curr = 1;
755 // toSearch(params.value)
756 // })
757 }, () => {
758 proxy.$ElMessage.info("已取消删除");
759 })
760
761 }
762
763 // 抽屉中字典分类change事件
764 const handleDrawSelectChange = (val, row, info) => {
765 if (row.field != 'classGuid') {
766 return;
767 }
768 const params = {
769 classGuid: val,
770 };
771 // 获取上级字典下拉选项
772 // dictApi.getDictTable(params).then((res: any) => {
773 // if (res.data.code == proxy.$passCode) {
774 // const data = res.data.data;
775 // classList.value = data ?? [];
776 // dictFormItems.value[1].options = classList.value;
777 // } else {
778 // ElMessage({
779 // type: "info",
780 // message: res.msg,
781 // });
782 // }
783 // })
784
785 }
786
787 // 抽屉的按钮区域
788 const drawerBtnClick = (btn, info) => {
789 if (btn.value == "cancel") {
790 drawerInfo.value.visible = false;
791 } else {
792 if (btn.value == "save") {
793 submitForm()
794 } else {
795 drawerInfo.value.container.id = "add-dictionary-form";
796 drawerInfo.value.visible = false;
797 }
798 }
799 };
800
801 onMounted(() => {
802
803 });
804
805
806 onBeforeMount(() => {
807 asideSearch()
808 //TODO.需要查一个没有分页的作为下拉选择框。
809 });
810 </script>
811
812 <style lang="scss" scoped>
813 .container_wrap {
814 .aside_wrap {
815 width: 220px;
816 padding: 8px 0;
817
818 :deep(.el-table--default .cell) {
819 padding: 2px;
820 }
821
822 .el-table td.el-table__cell div {
823 text-overflow: ellipsis;
824 white-space: nowrap;
825 overflow: hidden;
826 }
827
828 .btn {
829 // display: none;
830 display: flex;
831 justify-content: space-around;
832 }
833
834 .btn .el-icon {
835 cursor: pointer;
836 }
837
838 .el-icon-delete {
839 color: red;
840 cursor: pointer;
841 }
842
843 .el-icon-edit {
844 cursor: pointer;
845 }
846
847 .el-table__body tr:hover .btn {
848 // display: block;
849 display: flex;
850 justify-content: space-around;
851
852 }
853
854 .el-input {
855 margin: 0 8px 8px;
856 width: calc(100% - 16px);
857 }
858
859 .el-button {
860 margin: 0 8px 1px;
861 width: calc(100% - 16px);
862 }
863
864 .el-tabs-col {
865 :deep(.el-tabs__nav) {
866 justify-content: space-between;
867 width: 100%;
868 }
869
870 :deep(.el-tabs__item) {
871 width: 50%;
872 padding: 0;
873 }
874 }
875 }
876
877 .main_wrap {
878
879 .panel_title {
880 line-height: 40px;
881 font-size: 16px;
882 font-weight: 600;
883 color: #212121;
884 }
885
886 .table_tool_wrap {
887 width: 100%;
888
889 .tools_btns {
890 padding: 0;
891 margin-bottom: 12px;
892 }
893 }
894
895 .table_panel_wrap {
896 width: 100%;
897 }
898 }
899
900 }
901
902 .container_wrap.flex .main_wrap {
903 width: calc(100% - 220px)
904 }
905
906 :deep(.tree-page.el-pagination) {
907 button {
908 border: none;
909 }
910
911 .el-pager li {
912 border: none;
913 }
914 }
915 </style>
...\ No newline at end of file ...\ No newline at end of file
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!