From c30e07c9797f7dc15788277397f064aeb18185da Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期五, 11 十月 2024 16:56:32 +0800
Subject: [PATCH] 指定列显示
---
customer_list/common/static/fonts/ywiconfont/iconfont.ttf | 0
customer_list/common/static/fonts/ywiconfont/iconfont.woff | 0
vite.config.ts | 2
src/components/table/colFilter/ColFilter.vue | 87 +++++++++++++++++
src/components/table/colFilter/types.ts | 18 +++
src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue | 154 ++++++++++++++++--------------
customer_list/common/static/fonts/ywiconfont/iconfont.css | 14 ++
customer_list/common/static/fonts/ywiconfont/iconfont.woff2 | 0
8 files changed, 201 insertions(+), 74 deletions(-)
diff --git a/customer_list/common/static/fonts/ywiconfont/iconfont.css b/customer_list/common/static/fonts/ywiconfont/iconfont.css
index 7574a2f..3aad7fd 100644
--- a/customer_list/common/static/fonts/ywiconfont/iconfont.css
+++ b/customer_list/common/static/fonts/ywiconfont/iconfont.css
@@ -1,8 +1,8 @@
@font-face {
font-family: "ywifont"; /* Project id 4655417 */
- src: url('iconfont.woff2?t=1727078460397') format('woff2'),
- url('iconfont.woff?t=1727078460397') format('woff'),
- url('iconfont.ttf?t=1727078460397') format('truetype');
+ src: url('iconfont.woff2?t=1728635307432') format('woff2'),
+ url('iconfont.woff?t=1728635307432') format('woff'),
+ url('iconfont.ttf?t=1728635307432') format('truetype');
}
.ywifont {
@@ -13,6 +13,14 @@
-moz-osx-font-smoothing: grayscale;
}
+.ywicon-grid:before {
+ content: "\eaa2";
+}
+
+.ywicon-tag22:before {
+ content: "\e66b";
+}
+
.ywicon-duoweidu:before {
content: "\e669";
}
diff --git a/customer_list/common/static/fonts/ywiconfont/iconfont.ttf b/customer_list/common/static/fonts/ywiconfont/iconfont.ttf
index de60672..e9f1d18 100644
--- a/customer_list/common/static/fonts/ywiconfont/iconfont.ttf
+++ b/customer_list/common/static/fonts/ywiconfont/iconfont.ttf
Binary files differ
diff --git a/customer_list/common/static/fonts/ywiconfont/iconfont.woff b/customer_list/common/static/fonts/ywiconfont/iconfont.woff
index ad5a87b..08eecc8 100644
--- a/customer_list/common/static/fonts/ywiconfont/iconfont.woff
+++ b/customer_list/common/static/fonts/ywiconfont/iconfont.woff
Binary files differ
diff --git a/customer_list/common/static/fonts/ywiconfont/iconfont.woff2 b/customer_list/common/static/fonts/ywiconfont/iconfont.woff2
index d790ce6..093e311 100644
--- a/customer_list/common/static/fonts/ywiconfont/iconfont.woff2
+++ b/customer_list/common/static/fonts/ywiconfont/iconfont.woff2
Binary files differ
diff --git a/src/components/table/colFilter/ColFilter.vue b/src/components/table/colFilter/ColFilter.vue
new file mode 100644
index 0000000..e113291
--- /dev/null
+++ b/src/components/table/colFilter/ColFilter.vue
@@ -0,0 +1,87 @@
+<template>
+ <el-dropdown trigger="click" placement="bottom-end" :hideOnClick="false">
+ <span
+ title="鐐瑰嚮閫夋嫨鏄剧ず鍒�"
+ class="rounded-full p-1.5 border-[1.5px] hover:text-blue-400 border-gray-200 border-solid cursor-pointer ywifont ywicon-grid !text-[13px] mb-3"
+ ></span>
+
+ <template #dropdown>
+ <div class="flex-column px-2 py-2">
+ <el-checkbox
+ class="hover:bg-[#edf3f8] w-full"
+ v-for="item in checkOptionList"
+ :key="item.key"
+ v-model="item.value"
+ :label="item.label"
+ size="small"
+ @change="colCheckChange(item)"
+ :indeterminate="item.indeterminate"
+ />
+ </div>
+ </template>
+ </el-dropdown>
+</template>
+
+<script lang="ts" setup>
+import { PropType, computed, ref } from 'vue';
+import { CheckOption, TableCol, allCheckKey } from './types';
+
+const props = defineProps({
+ columnList: {
+ type: Array as PropType<TableCol[]>,
+ default: () => [],
+ },
+});
+
+const colCheckChange = (option: CheckOption) => {
+ const { key, value } = option;
+ if (key === allCheckKey) {
+ if (option.indeterminate) {
+ option.indeterminate = false;
+ option.value = true;
+ }
+ checkOptionList.value.map((item) => {
+ item.value = option.value;
+ });
+ } else {
+ const options = checkOptionList.value.filter((item) => item.key !== allCheckKey);
+ const len = options.length;
+ const checkedLen = options.filter((item) => item.value).length;
+
+ const checkAllOption = checkOptionList.value.find((item) => item.key === allCheckKey);
+ if (!checkAllOption) return;
+ if (checkedLen === 0 || len === checkedLen) {
+ checkAllOption.indeterminate = false;
+ if (checkedLen === 0) {
+ checkAllOption.value = false;
+ } else {
+ checkAllOption.value = true;
+ }
+ } else {
+ checkAllOption.indeterminate = true;
+ }
+ }
+};
+const checkOptionList = ref<CheckOption[]>(
+ (
+ [
+ {
+ key: allCheckKey,
+ label: '鍏ㄩ��/涓嶉��',
+ value: true,
+ },
+ ] as CheckOption[]
+ ).concat(
+ props.columnList.map((item) => ({
+ key: item.prop,
+ label: item.label,
+ get value() {
+ return item.isShow == undefined ? true : !!item.isShow;
+ },
+ set value(val) {
+ item.isShow = val;
+ },
+ }))
+ )
+);
+</script>
diff --git a/src/components/table/colFilter/types.ts b/src/components/table/colFilter/types.ts
new file mode 100644
index 0000000..2155d51
--- /dev/null
+++ b/src/components/table/colFilter/types.ts
@@ -0,0 +1,18 @@
+export type CheckOption = {
+ key: string;
+ label: string;
+ value: boolean;
+ indeterminate?: boolean;
+};
+
+
+export type TableCol = {
+ prop: string;
+ label: string;
+ width?: number;
+ isShow?:boolean
+ fixed?:'left' | 'right' | boolean,
+ showOverflowTooltip?:boolean
+};
+
+export const allCheckKey = '-999';
\ No newline at end of file
diff --git a/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue b/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue
index d83725c..3544210 100644
--- a/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue
+++ b/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue
@@ -35,84 +35,86 @@
</el-form>
</template>
<template #main>
- <div class="h-full" ref="chatDragContainerRef">
+ <div class="h-full flex-column">
+ <div class="flex-0 flex">
+ <ColFilter class="ml-auto" :columnList="columnList" />
+ </div>
<el-table
v-loading="tableLoading"
ref="draggableTableRef"
- class="h100"
+ class="flex-auto"
border
:row-class-name="isDragStatus ? 'cursor-move' : 'cursor-pointer'"
:data="displayTableData"
highlight-current-row
>
- <el-table-column prop="title" label="鏍囬" width="300" fixed="left" show-overflow-tooltip> </el-table-column>
- <el-table-column label="鍙戝竷鐘舵��" prop="published" width="85" show-overflow-tooltip>
- <template #default="scope">
- <el-tag :type="scope.row.published === SupervisorPublished.Y ? 'primary' : 'info'">{{
- supervisorPublishedMap[scope.row.published]
- }}</el-tag>
- </template>
- </el-table-column>
- <el-table-column prop="prompt" label="鎻愮ず璇�" width="300" show-overflow-tooltip> </el-table-column>
- <el-table-column prop="question" label="闂" width="300" show-overflow-tooltip> </el-table-column>
+ <template v-for="item in columnList" :key="item.prop">
+ <el-table-column
+ v-if="item.isShow ?? true"
+ :prop="item.prop"
+ :label="item.label"
+ :fixed="item.fixed"
+ :width="item.width"
+ showOverflowTooltip
+ >
+ <template #default="scope" v-if="item.prop === 'published'">
+ <el-tag :type="scope.row.published === SupervisorPublished.Y ? 'primary' : 'info'">{{
+ supervisorPublishedMap[scope.row.published]
+ }}</el-tag>
+ </template>
- <el-table-column label="鍒涘缓浜�" prop="creator" width="100" show-overflow-tooltip> </el-table-column>
- <el-table-column label="鍒涘缓鏃堕棿" prop="create_time" width="105" show-overflow-tooltip> </el-table-column>
- <el-table-column label="鏇存柊鏃堕棿" prop="update_time" width="105" show-overflow-tooltip> </el-table-column>
+ <template #default="scope" v-else-if="item.prop === 'operate'">
+ <div class="space-x-3 items-center flex">
+ <el-tooltip effect="dark" content="AMIS浣庝唬鐮佺紪杈�" placement="top">
+ <i class="ywifont ywicon-didaima !text-[21px] text-blue-400 cursor-pointer" @click="gotoAmisPage(scope.row)"></i>
+ </el-tooltip>
+ <el-tooltip effect="dark" content="鏁版嵁瀵规帴" placement="top">
+ <i class="ywifont ywicon-sjdj !text-[17px] text-blue-400 cursor-pointer" @click="editSqlClick(scope.row)"></i>
+ </el-tooltip>
- <el-table-column label="澶囨敞" prop="note" show-overflow-tooltip> </el-table-column>
- <el-table-column label="鎿嶄綔" width="200" fixed="right" show-overflow-tooltip>
- <template #default="scope">
- <div class="space-x-3 items-center flex">
- <el-tooltip effect="dark" content="AMIS浣庝唬鐮佺紪杈�" placement="top">
- <i class="ywifont ywicon-didaima !text-[21px] text-blue-400 cursor-pointer" @click="gotoAmisPage(scope.row)"></i>
- </el-tooltip>
- <el-tooltip effect="dark" content="鏁版嵁瀵规帴" placement="top">
- <i class="ywifont ywicon-sjdj !text-[17px] text-blue-400 cursor-pointer" @click="editSqlClick(scope.row)"></i>
- </el-tooltip>
+ <el-tooltip effect="dark" content="瀵硅瘽娴嬭瘯" placement="top">
+ <i class="ywifont ywicon-ceshi !text-[20px] text-blue-400 cursor-pointer" @click="openChatTest(scope.row)"></i>
+ </el-tooltip>
- <el-tooltip effect="dark" content="瀵硅瘽娴嬭瘯" placement="top">
- <i class="ywifont ywicon-ceshi !text-[20px] text-blue-400 cursor-pointer" @click="openChatTest(scope.row)"></i>
- </el-tooltip>
-
- <el-tooltip
- effect="dark"
- :content="scope.row.published === SupervisorPublished.Y ? '鍙栨秷鍙戝竷' : '鍙戝竷'"
- placement="top"
- >
- <i
- class="ywifont !text-[20px] cursor-pointer"
- :class="[
- scope.row.published === SupervisorPublished.Y ? 'ywicon-quxiaofabu text-red-400' : 'ywicon-fabu text-blue-400',
- ]"
- @click="
- publishStatusChange(
- scope.row.published === SupervisorPublished.Y ? SupervisorPublished.N : SupervisorPublished.Y,
- scope.row.id,
- scope.$index
- )
- "
- ></i>
- </el-tooltip>
- <el-tooltip effect="dark" content="缂栬緫" placement="top">
- <i class="ywifont ywicon-bianji !text-[15px] text-blue-400 cursor-pointer" @click="openOptDlg(scope.row)"></i>
- </el-tooltip>
- <el-tooltip effect="dark" content="鍒犻櫎" placement="top">
- <i
- class="ywifont ywicon-shanchu !text-[17px] text-red-400 cursor-pointer"
- @click="
- () => {
- deleteCurrentRow(scope.row, '椤甸潰', supervisorAdminApi.deleteSupervisor, () => {
- const foundIndex = tableData.findIndex((item) => item === scope.row);
- foundIndex > -1 && tableData.splice(foundIndex, 1);
- });
- }
- "
- ></i>
- </el-tooltip>
- </div>
- </template>
- </el-table-column>
+ <el-tooltip
+ effect="dark"
+ :content="scope.row.published === SupervisorPublished.Y ? '鍙栨秷鍙戝竷' : '鍙戝竷'"
+ placement="top"
+ >
+ <i
+ class="ywifont !text-[20px] cursor-pointer"
+ :class="[
+ scope.row.published === SupervisorPublished.Y ? 'ywicon-quxiaofabu text-red-400' : 'ywicon-fabu text-blue-400',
+ ]"
+ @click="
+ publishStatusChange(
+ scope.row.published === SupervisorPublished.Y ? SupervisorPublished.N : SupervisorPublished.Y,
+ scope.row.id,
+ scope.$index
+ )
+ "
+ ></i>
+ </el-tooltip>
+ <el-tooltip effect="dark" content="缂栬緫" placement="top">
+ <i class="ywifont ywicon-bianji !text-[15px] text-blue-400 cursor-pointer" @click="openOptDlg(scope.row)"></i>
+ </el-tooltip>
+ <el-tooltip effect="dark" content="鍒犻櫎" placement="top">
+ <i
+ class="ywifont ywicon-shanchu !text-[17px] text-red-400 cursor-pointer"
+ @click="
+ () => {
+ deleteCurrentRow(scope.row, '椤甸潰', supervisorAdminApi.deleteSupervisor, () => {
+ const foundIndex = tableData.findIndex((item) => item === scope.row);
+ foundIndex > -1 && tableData.splice(foundIndex, 1);
+ });
+ }
+ "
+ ></i>
+ </el-tooltip>
+ </div>
+ </template>
+ </el-table-column>
+ </template>
</el-table>
<div
v-if="chatTestIsShow"
@@ -222,7 +224,20 @@
import AHMContainer from '/@/components/layout/AHMContainer.vue';
import LeftTreeByMgr from '/@/components/tree/leftTreeByMgr.vue';
import { useUpdateData } from '/@/hooks/useUpdateData';
+import ColFilter from '/@/components/table/colFilter/ColFilter.vue';
+import { TableCol } from '/@/components/table/colFilter/types';
+const columnList = ref<TableCol[]>([
+ { prop: 'title', label: '鏍囬', width: 300, fixed: 'left' },
+ { prop: 'published', label: '鍙戝竷鐘舵��', width: 85 },
+ { prop: 'prompt', label: '鎻愮ず璇�', width: 300 },
+ { prop: 'question', label: '闂', width: 300 },
+ { prop: 'creator', label: '鍒涘缓浜�', width: 100 },
+ { prop: 'create_time', label: '鍒涘缓鏃堕棿', width: 105 },
+ { prop: 'update_time', label: '鏇存柊鏃堕棿', width: 105 },
+ { prop: 'note', label: '澶囨敞' },
+ { prop: 'operate', label: '鎿嶄綔', width: 200, fixed: 'right' },
+]);
//#region ====================== 宸︿晶鏍戞暟鎹紝tree init ======================
const leftTreeRef = useCompRef(LeftTreeByMgr);
const treeLoading = ref(false);
@@ -231,12 +246,12 @@
const currentNode = ref(null);
const listTreeData = computed(() => {
- const result = convertListToTree(listData.value, {
+ const result = convertListToTree(listData.value, {
ID: 'group_id',
ParentID: 'p_group_id',
Children: 'children',
});
- return result
+ return result;
});
const updateRelatedType = (extendType) => {
@@ -516,7 +531,6 @@
const draggableChatRef = ref<HTMLElement | null>(null);
const chatDragHandlerRef = ref<HTMLDivElement>(null);
-const chatDragContainerRef = ref<HTMLDivElement>(null);
// `style` will be a helper computed for `left: ?px; top: ?px;`
const { x, y, style } = useDraggable(draggableChatRef, {
diff --git a/vite.config.ts b/vite.config.ts
index 91ced05..5b25f9d 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -39,7 +39,7 @@
host: '0.0.0.0',
port: env.VITE_PORT as unknown as number,
open: JSON.parse(env.VITE_OPEN),
- hmr: false,
+ hmr: true,
proxy: {
'/gitee': {
target: 'https://gitee.com',
--
Gitblit v1.9.3