|
@@ -0,0 +1,230 @@
|
|
|
+<template>
|
|
|
+ <hc-drawer
|
|
|
+ v-model="isShow"
|
|
|
+ to-id="hc-main-box"
|
|
|
+ is-close
|
|
|
+ @close="drawerClose"
|
|
|
+ >
|
|
|
+ <hc-body split :options="{ sizes: [15, 15, 70] }">
|
|
|
+ <template #left>
|
|
|
+ <hc-card scrollbar>
|
|
|
+ <el-menu
|
|
|
+ :default-active="activeIndex"
|
|
|
+ class="el-menu-vertical-demo"
|
|
|
+ @select="selectMajorDataType"
|
|
|
+ >
|
|
|
+ <el-menu-item
|
|
|
+ v-for="(item, index) in majorDataTypeList"
|
|
|
+ :index="inedx"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <i class="el-icon-s-opportunity"></i>
|
|
|
+ <span>{{ item.label }}</span>
|
|
|
+ </el-menu-item>
|
|
|
+ </el-menu>
|
|
|
+ </hc-card>
|
|
|
+ </template>
|
|
|
+ <hc-card scrollbar>
|
|
|
+ <ElTree
|
|
|
+ :load="treeLoadNode"
|
|
|
+ :props="treeProps"
|
|
|
+ accordion
|
|
|
+ highlight-current
|
|
|
+ lazy
|
|
|
+ @node-click="treeNodeTap"
|
|
|
+ />
|
|
|
+ </hc-card>
|
|
|
+ <template #right>
|
|
|
+ <hc-card scrollbar>
|
|
|
+ <template #header>
|
|
|
+ <div class="w-400px">
|
|
|
+ <hc-search-input
|
|
|
+ v-model="searchForm.titleName"
|
|
|
+ @search="searchClick"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <hc-table
|
|
|
+ :column="tableColumn"
|
|
|
+ :datas="tableData"
|
|
|
+ :loading="tableLoading"
|
|
|
+ :index-style="{ width: 60 }"
|
|
|
+ >
|
|
|
+ <template #action="{ row }">
|
|
|
+ <el-button
|
|
|
+ v-if="row.isBussTime !== 2"
|
|
|
+ type="primary"
|
|
|
+ size="small"
|
|
|
+ plain
|
|
|
+ @click="setFiledate(row)"
|
|
|
+ >设置为文件日期
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ v-else
|
|
|
+ type="danger"
|
|
|
+ size="small"
|
|
|
+ plain
|
|
|
+ @click="quitFiledate(row)"
|
|
|
+ >取消
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </hc-table>
|
|
|
+ <template #action>
|
|
|
+ <hc-pages :pages="searchForm" @change="pageChange" />
|
|
|
+ </template>
|
|
|
+ </hc-card>
|
|
|
+ </template>
|
|
|
+ </hc-body>
|
|
|
+ </hc-drawer>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref, watch } from "vue";
|
|
|
+import { getArrValue, arrToId, isNullES } from "js-fast-way";
|
|
|
+import mainApi from "~api/desk/wbs";
|
|
|
+import { getDictionaryData } from "~src/utils/tools";
|
|
|
+
|
|
|
+//事件
|
|
|
+const emit = defineEmits(["close"]);
|
|
|
+
|
|
|
+//双向绑定
|
|
|
+const isShow = defineModel("modelValue", {
|
|
|
+ default: false,
|
|
|
+});
|
|
|
+
|
|
|
+//监听显示
|
|
|
+watch(isShow, (val) => {
|
|
|
+ if (val) getDataApi();
|
|
|
+});
|
|
|
+//最左侧菜单
|
|
|
+const activeIndex = ref("");
|
|
|
+const selectMajorDataType = (index) => {};
|
|
|
+const majorDataTypeList = ref([]);
|
|
|
+const getMajorDataTypeList = async () => {
|
|
|
+ majorDataTypeList.value = await getDictionaryData("major_data_type", true);
|
|
|
+};
|
|
|
+//处理相关数据
|
|
|
+const getDataApi = async () => {
|
|
|
+ await getMajorDataTypeList();
|
|
|
+ getTreeData();
|
|
|
+};
|
|
|
+
|
|
|
+//树配置
|
|
|
+const treeProps = {
|
|
|
+ label: "title",
|
|
|
+ children: "children",
|
|
|
+ isLeaf: "isLeaf",
|
|
|
+};
|
|
|
+
|
|
|
+//获取树接口
|
|
|
+const treeData = ref([]);
|
|
|
+const getTreeData = async () => {
|
|
|
+ const { data } = await mainApi.tabTypeLazyTreeAll({
|
|
|
+ parentId: "12345678910",
|
|
|
+ current: 1,
|
|
|
+ size: 1000,
|
|
|
+ });
|
|
|
+ treeData.value = getArrValue(data?.records);
|
|
|
+};
|
|
|
+//获取数据
|
|
|
+const tabTypeLazyTree = async (parentId = "12345678910") => {
|
|
|
+ //发起请求
|
|
|
+ const { data } = await mainApi.tabTypeLazyTreeAll({
|
|
|
+ parentId,
|
|
|
+ current: 1,
|
|
|
+ size: 1000,
|
|
|
+ });
|
|
|
+ const records = getArrValue(data?.records);
|
|
|
+ records.forEach((item) => {
|
|
|
+ item.isLeaf = !item.hasChildren;
|
|
|
+ });
|
|
|
+ return { data: records, total: data?.total };
|
|
|
+};
|
|
|
+const treeLoadNode = async (node, resolve) => {
|
|
|
+ if (node.level === 0) {
|
|
|
+ const resData = await tabTypeLazyTree();
|
|
|
+ resolve(resData?.data);
|
|
|
+ } else {
|
|
|
+ const resData = await tabTypeLazyTree(
|
|
|
+ node?.data?.primaryKeyId,
|
|
|
+ "",
|
|
|
+ false,
|
|
|
+ {
|
|
|
+ current: 1,
|
|
|
+ size: 2000,
|
|
|
+ }
|
|
|
+ );
|
|
|
+ resolve(resData?.data);
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+//树节点被点击
|
|
|
+const nodeInfo = ref({});
|
|
|
+const treeNodeTap = (data, node) => {
|
|
|
+ nodeInfo.value = data;
|
|
|
+ searchForm.value.parentId = data.id;
|
|
|
+
|
|
|
+ if (node?.level === 1) {
|
|
|
+ searchClick();
|
|
|
+ } else if (node?.level === 2) {
|
|
|
+ searchForm.value.total = 1;
|
|
|
+ tableData.value = [data];
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+//搜索表单
|
|
|
+const searchForm = ref({ current: 1, size: 30, total: 0 });
|
|
|
+
|
|
|
+//搜索
|
|
|
+const searchClick = () => {
|
|
|
+ const { parentId } = searchForm.value;
|
|
|
+ if (isNullES(parentId)) {
|
|
|
+ window?.$message?.warning("请先在左侧点击一个节点");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ searchForm.value.current = 1;
|
|
|
+ getTableData();
|
|
|
+};
|
|
|
+
|
|
|
+//分页
|
|
|
+const pageChange = ({ current, size }) => {
|
|
|
+ const { parentId } = searchForm.value;
|
|
|
+ if (isNullES(parentId)) {
|
|
|
+ window?.$message?.warning("请先在左侧点击一个节点");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ searchForm.value.current = current;
|
|
|
+ searchForm.value.size = size;
|
|
|
+ getTableData();
|
|
|
+};
|
|
|
+
|
|
|
+//表格数据
|
|
|
+const tableData = ref([]);
|
|
|
+const tableColumn = ref([
|
|
|
+ { key: "title", name: "字段信息" },
|
|
|
+ { key: "action", name: "操作", width: 220, align: "center" },
|
|
|
+]);
|
|
|
+
|
|
|
+//获取表格数据
|
|
|
+const tableLoading = ref(false);
|
|
|
+const getTableData = async () => {
|
|
|
+ tableData.value = [];
|
|
|
+ tableLoading.value = true;
|
|
|
+ const { data } = await mainApi.tabTypeLazyTreeAll({
|
|
|
+ ...searchForm.value,
|
|
|
+ total: null,
|
|
|
+ });
|
|
|
+ tableLoading.value = false;
|
|
|
+ tableData.value = getArrValue(data?.records);
|
|
|
+ searchForm.value.total = data?.total || 0;
|
|
|
+};
|
|
|
+//设置为文件日期
|
|
|
+const setFiledate = (row) => {};
|
|
|
+const quitFiledate = (row) => {};
|
|
|
+//关闭抽屉
|
|
|
+const drawerClose = () => {
|
|
|
+ isShow.value = false;
|
|
|
+ emit("close");
|
|
|
+};
|
|
|
+</script>
|