|
@@ -1,38 +1,78 @@
|
|
<template>
|
|
<template>
|
|
- <hc-dialog v-model="isShow" ui="hc-exctab-element-web-temp" title="关联公共WBS模板" widths="1200px" :padding="false" is-table @close="dialogClose">
|
|
|
|
|
|
+ <hc-dialog
|
|
|
|
+ v-model="isShow"
|
|
|
|
+ ui="hc-exctab-element-web-temp"
|
|
|
|
+ title="关联公共WBS模板"
|
|
|
|
+ widths="1200px"
|
|
|
|
+ :padding="false"
|
|
|
|
+ is-table
|
|
|
|
+ @close="dialogClose"
|
|
|
|
+ >
|
|
<div class="hc-exctab-element-web-temp-box hc-flex h-full">
|
|
<div class="hc-exctab-element-web-temp-box hc-flex h-full">
|
|
<div class="left h-full flex-1">
|
|
<div class="left h-full flex-1">
|
|
<hc-card scrollbar>
|
|
<hc-card scrollbar>
|
|
<template #header>
|
|
<template #header>
|
|
<div class="w-full">
|
|
<div class="w-full">
|
|
- <el-select v-model="formModelName" filterable block placeholder="请选择清表模板" @change="formNameChange">
|
|
|
|
- <el-option v-for="item in excelData" :key="item.id" :label="item.wbsName" :value="item.id" />
|
|
|
|
|
|
+ <el-select
|
|
|
|
+ v-model="formModelName"
|
|
|
|
+ filterable
|
|
|
|
+ block
|
|
|
|
+ placeholder="请选择清表模板"
|
|
|
|
+ @change="formNameChange"
|
|
|
|
+ >
|
|
|
|
+ <el-option
|
|
|
|
+ v-for="item in excelData"
|
|
|
|
+ :key="item.id"
|
|
|
|
+ :label="item.wbsName"
|
|
|
|
+ :value="item.id"
|
|
|
|
+ />
|
|
</el-select>
|
|
</el-select>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<template #search>
|
|
<template #search>
|
|
<div v-if="formModelName" class="w-full">
|
|
<div v-if="formModelName" class="w-full">
|
|
- <hc-search-input v-model="filterText" placeholder="输入关键字搜索" @search="treeFilterClick" />
|
|
|
|
|
|
+ <hc-search-input
|
|
|
|
+ v-model="filterText"
|
|
|
|
+ placeholder="输入关键字搜索"
|
|
|
|
+ @search="treeFilterClick"
|
|
|
|
+ />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<template v-if="formModelName">
|
|
<template v-if="formModelName">
|
|
<template v-if="isTreeMode === 1">
|
|
<template v-if="isTreeMode === 1">
|
|
<hc-lazy-tree
|
|
<hc-lazy-tree
|
|
- v-if="isShow" ref="treeRef1" :h-props="treeProps" tree-key="id" :show-checkbox="tabsKey === '2'" check-strictly
|
|
|
|
- :default-checked-keys="treeNodeIds" @load="treeLoadNode" @node-tap="treeNodeTap"
|
|
|
|
|
|
+ v-if="isShow"
|
|
|
|
+ ref="treeRef1"
|
|
|
|
+ :h-props="treeProps"
|
|
|
|
+ tree-key="id"
|
|
|
|
+ :show-checkbox="tabsKey === '2'"
|
|
|
|
+ check-strictly
|
|
|
|
+ :default-checked-keys="treeNodeIds"
|
|
|
|
+ @load="treeLoadNode"
|
|
|
|
+ @node-tap="treeNodeTap"
|
|
>
|
|
>
|
|
<template #name="{ data }">
|
|
<template #name="{ data }">
|
|
- <span class="text-16px font-400">{{ data.title }}</span>
|
|
|
|
|
|
+ <span class="text-16px font-400">{{
|
|
|
|
+ data.title
|
|
|
|
+ }}</span>
|
|
</template>
|
|
</template>
|
|
</hc-lazy-tree>
|
|
</hc-lazy-tree>
|
|
</template>
|
|
</template>
|
|
<template v-if="isTreeMode === 2">
|
|
<template v-if="isTreeMode === 2">
|
|
<hc-data-tree
|
|
<hc-data-tree
|
|
- ref="treeRef2" :h-props="treeProps" tree-key="id" :show-checkbox="tabsKey === '2'" :datas="treeData"
|
|
|
|
- check-strictly :default-checked-keys="treeNodeIds" @node-tap="treeNodeTap"
|
|
|
|
|
|
+ ref="treeRef2"
|
|
|
|
+ :h-props="treeProps"
|
|
|
|
+ tree-key="id"
|
|
|
|
+ :show-checkbox="tabsKey === '2'"
|
|
|
|
+ :datas="treeData"
|
|
|
|
+ check-strictly
|
|
|
|
+ :default-checked-keys="treeNodeIds"
|
|
|
|
+ @node-tap="treeNodeTap"
|
|
>
|
|
>
|
|
<template #name="{ data }">
|
|
<template #name="{ data }">
|
|
- <span class="text-16px font-400">{{ data.title }}</span>
|
|
|
|
|
|
+ <span class="text-16px font-400">{{
|
|
|
|
+ data.title
|
|
|
|
+ }}</span>
|
|
</template>
|
|
</template>
|
|
</hc-data-tree>
|
|
</hc-data-tree>
|
|
</template>
|
|
</template>
|
|
@@ -40,28 +80,77 @@
|
|
</hc-card>
|
|
</hc-card>
|
|
</div>
|
|
</div>
|
|
<div class="right h-full flex-1">
|
|
<div class="right h-full flex-1">
|
|
- <hc-tab-card :tabs="tabsData" :tab-key="tabsKey" @change="tabsChange">
|
|
|
|
|
|
+ <hc-tab-card
|
|
|
|
+ :tabs="tabsData"
|
|
|
|
+ :tab-key="tabsKey"
|
|
|
|
+ @change="tabsChange"
|
|
|
|
+ >
|
|
<template v-if="tabsKey === '1'">
|
|
<template v-if="tabsKey === '1'">
|
|
- <hc-table :column="nodeTableColumn" :datas="nodeTableData" :is-index="false">
|
|
|
|
|
|
+ <hc-table
|
|
|
|
+ :column="nodeTableColumn"
|
|
|
|
+ :datas="nodeTableData"
|
|
|
|
+ :is-index="false"
|
|
|
|
+ >
|
|
<template #action="{ row }">
|
|
<template #action="{ row }">
|
|
- <el-link v-if="row.checknd" type="warning" @click="rowUnlinkClick(row)">取消关联</el-link>
|
|
|
|
- <el-link v-else type="primary" @click="rowLinkClick(row)">选择关联</el-link>
|
|
|
|
|
|
+ <el-link
|
|
|
|
+ v-if="row.checknd"
|
|
|
|
+ type="warning"
|
|
|
|
+ @click="rowUnlinkClick(row)"
|
|
|
|
+ >取消关联</el-link
|
|
|
|
+ >
|
|
|
|
+ <el-link
|
|
|
|
+ v-else
|
|
|
|
+ type="primary"
|
|
|
|
+ @click="rowLinkClick(row)"
|
|
|
|
+ >选择关联</el-link
|
|
|
|
+ >
|
|
</template>
|
|
</template>
|
|
</hc-table>
|
|
</hc-table>
|
|
</template>
|
|
</template>
|
|
<div v-if="tabsKey === '2'">
|
|
<div v-if="tabsKey === '2'">
|
|
- <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="top" label-width="auto" size="large">
|
|
|
|
|
|
+ <el-form
|
|
|
|
+ ref="formRef"
|
|
|
|
+ :model="formModel"
|
|
|
|
+ :rules="formRules"
|
|
|
|
+ label-position="top"
|
|
|
|
+ label-width="auto"
|
|
|
|
+ size="large"
|
|
|
|
+ >
|
|
<el-form-item label="元素表名:" prop="nodeName">
|
|
<el-form-item label="元素表名:" prop="nodeName">
|
|
- <el-input v-model="formModel.nodeName" type="textarea" placeholder="请输入元素表名" />
|
|
|
|
|
|
+ <el-input
|
|
|
|
+ v-model="formModel.nodeName"
|
|
|
|
+ type="textarea"
|
|
|
|
+ placeholder="请输入元素表名"
|
|
|
|
+ />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item label="清表类型:" prop="tableType">
|
|
<el-form-item label="清表类型:" prop="tableType">
|
|
- <el-select v-model="formModel.tableType" filterable block placeholder="请选择清表类型">
|
|
|
|
- <el-option v-for="item in excelTypeData" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
|
|
|
+ <el-select
|
|
|
|
+ v-model="formModel.tableType"
|
|
|
|
+ filterable
|
|
|
|
+ block
|
|
|
|
+ placeholder="请选择清表类型"
|
|
|
|
+ >
|
|
|
|
+ <el-option
|
|
|
|
+ v-for="item in excelTypeData"
|
|
|
|
+ :key="item.value"
|
|
|
|
+ :label="item.label"
|
|
|
|
+ :value="item.value"
|
|
|
|
+ />
|
|
</el-select>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item label="所属方:" prop="tableOwner">
|
|
<el-form-item label="所属方:" prop="tableOwner">
|
|
- <el-select v-model="formModel.tableOwner" filterable block placeholder="请选择所属方">
|
|
|
|
- <el-option v-for="item in ownerTypeList" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
|
|
|
+ <el-select
|
|
|
|
+ v-model="formModel.tableOwner"
|
|
|
|
+ filterable
|
|
|
|
+ block
|
|
|
|
+ placeholder="请选择所属方"
|
|
|
|
+ >
|
|
|
|
+ <el-option
|
|
|
|
+ v-for="item in ownerTypeList"
|
|
|
|
+ :key="item.value"
|
|
|
|
+ :label="item.label"
|
|
|
|
+ :value="item.value"
|
|
|
|
+ />
|
|
</el-select>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-form>
|
|
@@ -71,16 +160,22 @@
|
|
</div>
|
|
</div>
|
|
<template #footer>
|
|
<template #footer>
|
|
<el-button hc-btn @click="dialogClose">取消</el-button>
|
|
<el-button hc-btn @click="dialogClose">取消</el-button>
|
|
- <el-button hc-btn type="primary" :loading="submitLoading" @click="dialogSubmit">提交</el-button>
|
|
|
|
|
|
+ <el-button
|
|
|
|
+ hc-btn
|
|
|
|
+ type="primary"
|
|
|
|
+ :loading="submitLoading"
|
|
|
|
+ @click="dialogSubmit"
|
|
|
|
+ >提交</el-button
|
|
|
|
+ >
|
|
</template>
|
|
</template>
|
|
</hc-dialog>
|
|
</hc-dialog>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
-import { ref, watch } from 'vue'
|
|
|
|
-import { getDictionaryData } from '~uti/tools'
|
|
|
|
-import { formValidate, getArrValue, getObjValue, isNullES } from 'js-fast-way'
|
|
|
|
-import mainApi from '~api/exctab/exceltab'
|
|
|
|
|
|
+import { ref, watch } from "vue";
|
|
|
|
+import { getDictionaryData } from "~uti/tools";
|
|
|
|
+import { formValidate, getArrValue, getObjValue, isNullES } from "js-fast-way";
|
|
|
|
+import mainApi from "~api/exctab/exceltab";
|
|
|
|
|
|
const props = defineProps({
|
|
const props = defineProps({
|
|
info: {
|
|
info: {
|
|
@@ -89,153 +184,160 @@ const props = defineProps({
|
|
},
|
|
},
|
|
data: {
|
|
data: {
|
|
type: Array,
|
|
type: Array,
|
|
- default: () => ([]),
|
|
|
|
|
|
+ default: () => [],
|
|
},
|
|
},
|
|
-})
|
|
|
|
|
|
+});
|
|
|
|
|
|
//事件
|
|
//事件
|
|
-const emit = defineEmits(['finish', 'close'])
|
|
|
|
|
|
+const emit = defineEmits(["finish", "close"]);
|
|
|
|
|
|
//双向绑定
|
|
//双向绑定
|
|
-const isShow = defineModel('modelValue', {
|
|
|
|
|
|
+const isShow = defineModel("modelValue", {
|
|
default: false,
|
|
default: false,
|
|
-})
|
|
|
|
|
|
+});
|
|
|
|
|
|
//监听数据
|
|
//监听数据
|
|
-const dataInfo = ref(props.info)
|
|
|
|
-watch(() => props.info, (data) => {
|
|
|
|
- dataInfo.value = getObjValue(data)
|
|
|
|
-}, { immediate: true, deep: true })
|
|
|
|
|
|
+const dataInfo = ref(props.info);
|
|
|
|
+watch(
|
|
|
|
+ () => props.info,
|
|
|
|
+ (data) => {
|
|
|
|
+ dataInfo.value = getObjValue(data);
|
|
|
|
+ },
|
|
|
|
+ { immediate: true, deep: true }
|
|
|
|
+);
|
|
|
|
|
|
//监听数据
|
|
//监听数据
|
|
-const datas = ref(props.data)
|
|
|
|
-watch(() => props.data, (data) => {
|
|
|
|
- datas.value = getArrValue(data)
|
|
|
|
-}, { immediate: true, deep: true })
|
|
|
|
|
|
+const datas = ref(props.data);
|
|
|
|
+watch(
|
|
|
|
+ () => props.data,
|
|
|
|
+ (data) => {
|
|
|
|
+ datas.value = getArrValue(data);
|
|
|
|
+ },
|
|
|
|
+ { immediate: true, deep: true }
|
|
|
|
+);
|
|
|
|
|
|
//监听显示
|
|
//监听显示
|
|
watch(isShow, (val) => {
|
|
watch(isShow, (val) => {
|
|
- if (val) getInfoData()
|
|
|
|
-})
|
|
|
|
|
|
+ if (val) getInfoData();
|
|
|
|
+});
|
|
|
|
|
|
//获取数据详情
|
|
//获取数据详情
|
|
-const tableData = ref([])
|
|
|
|
-const formModelName = ref('')
|
|
|
|
|
|
+const tableData = ref([]);
|
|
|
|
+const formModelName = ref("");
|
|
const getInfoData = () => {
|
|
const getInfoData = () => {
|
|
- getWbsTypeList()
|
|
|
|
|
|
+ getWbsTypeList();
|
|
//处理元素字段信息
|
|
//处理元素字段信息
|
|
- const data = getArrValue(datas.value)
|
|
|
|
|
|
+ const data = getArrValue(datas.value);
|
|
for (let i = 0; i < data.length; i++) {
|
|
for (let i = 0; i < data.length; i++) {
|
|
- data[i].eName = data[i].textInfo
|
|
|
|
- data[i].eType = data[i].textElementType
|
|
|
|
- data[i].eAllowDeviation = data[i].textDeviation
|
|
|
|
|
|
+ data[i].eName = data[i].textInfo;
|
|
|
|
+ data[i].eType = data[i].textElementType;
|
|
|
|
+ data[i].eAllowDeviation = data[i].textDeviation;
|
|
}
|
|
}
|
|
- tableData.value = data
|
|
|
|
-}
|
|
|
|
|
|
+ tableData.value = data;
|
|
|
|
+};
|
|
|
|
|
|
//获取清表模板信息
|
|
//获取清表模板信息
|
|
-const excelData = ref([])
|
|
|
|
|
|
+const excelData = ref([]);
|
|
const getWbsTypeList = async () => {
|
|
const getWbsTypeList = async () => {
|
|
- const { data } = await mainApi.getWbsTypeList({ wbstype: 1 })
|
|
|
|
- excelData.value = getArrValue(data)
|
|
|
|
-}
|
|
|
|
|
|
+ const { data } = await mainApi.getWbsTypeList({ wbstype: 1 });
|
|
|
|
+ excelData.value = getArrValue(data);
|
|
|
|
+};
|
|
|
|
|
|
//清表模板被改变
|
|
//清表模板被改变
|
|
const formNameChange = () => {
|
|
const formNameChange = () => {
|
|
- isTreeMode.value = 5
|
|
|
|
- filterText.value = ''
|
|
|
|
- nodeTableData.value = []
|
|
|
|
- formModel.value = {}
|
|
|
|
- tabsKey.value = '1'
|
|
|
|
- nodeInfo.value = {}
|
|
|
|
- treeNodeIds.value = []
|
|
|
|
- treeData.value = []
|
|
|
|
|
|
+ isTreeMode.value = 5;
|
|
|
|
+ filterText.value = "";
|
|
|
|
+ nodeTableData.value = [];
|
|
|
|
+ formModel.value = {};
|
|
|
|
+ tabsKey.value = "1";
|
|
|
|
+ nodeInfo.value = {};
|
|
|
|
+ treeNodeIds.value = [];
|
|
|
|
+ treeData.value = [];
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
- isTreeMode.value = 1
|
|
|
|
- }, 200)
|
|
|
|
-}
|
|
|
|
|
|
+ isTreeMode.value = 1;
|
|
|
|
+ }, 200);
|
|
|
|
+};
|
|
|
|
|
|
//树配置
|
|
//树配置
|
|
-const treeRef1 = ref(null)
|
|
|
|
-const treeRef2 = ref(null)
|
|
|
|
|
|
+const treeRef1 = ref(null);
|
|
|
|
+const treeRef2 = ref(null);
|
|
const treeProps = {
|
|
const treeProps = {
|
|
- label: 'title',
|
|
|
|
- children: 'children',
|
|
|
|
|
|
+ label: "title",
|
|
|
|
+ children: "children",
|
|
isLeaf: (item) => {
|
|
isLeaf: (item) => {
|
|
- const isExistForm = Number(item.isExistForm)
|
|
|
|
|
|
+ const isExistForm = Number(item.isExistForm);
|
|
if (item.hasChildren && isExistForm !== 1) {
|
|
if (item.hasChildren && isExistForm !== 1) {
|
|
- return false
|
|
|
|
|
|
+ return false;
|
|
} else if (item.hasChildren && isExistForm === 1) {
|
|
} else if (item.hasChildren && isExistForm === 1) {
|
|
- return true
|
|
|
|
|
|
+ return true;
|
|
} else {
|
|
} else {
|
|
- return true
|
|
|
|
|
|
+ return true;
|
|
}
|
|
}
|
|
},
|
|
},
|
|
-}
|
|
|
|
|
|
+};
|
|
|
|
|
|
//筛选搜索
|
|
//筛选搜索
|
|
-const filterText = ref('')
|
|
|
|
-const isTreeMode = ref(1) //1懒加载,2全加载
|
|
|
|
|
|
+const filterText = ref("");
|
|
|
|
+const isTreeMode = ref(1); //1懒加载,2全加载
|
|
const treeFilterClick = async () => {
|
|
const treeFilterClick = async () => {
|
|
if (isNullES(filterText.value)) {
|
|
if (isNullES(filterText.value)) {
|
|
- isTreeMode.value = 1
|
|
|
|
|
|
+ isTreeMode.value = 1;
|
|
} else {
|
|
} else {
|
|
- isTreeMode.value = 2
|
|
|
|
- await getTreeAllData()
|
|
|
|
- treeRef2.value?.treeRef?.filter(filterText.value)
|
|
|
|
|
|
+ isTreeMode.value = 2;
|
|
|
|
+ await getTreeAllData();
|
|
|
|
+ treeRef2.value?.treeRef?.filter(filterText.value);
|
|
}
|
|
}
|
|
-}
|
|
|
|
|
|
+};
|
|
|
|
|
|
//懒加载树
|
|
//懒加载树
|
|
const treeLoadNode = async ({ item, level }, resolve) => {
|
|
const treeLoadNode = async ({ item, level }, resolve) => {
|
|
- const parentId = level === 0 ? 0 : item.id
|
|
|
|
|
|
+ const parentId = level === 0 ? 0 : item.id;
|
|
const { data } = await mainApi.getLazyTree({
|
|
const { data } = await mainApi.getLazyTree({
|
|
parentId: parentId,
|
|
parentId: parentId,
|
|
wbsId: formModelName.value,
|
|
wbsId: formModelName.value,
|
|
- wbsType: '1',
|
|
|
|
- })
|
|
|
|
- const res = getArrValue(data)
|
|
|
|
- res.forEach(item => {
|
|
|
|
- item.isExistForm = !!item.isExistForm
|
|
|
|
- })
|
|
|
|
- resolve(res)
|
|
|
|
-}
|
|
|
|
|
|
+ wbsType: "1",
|
|
|
|
+ });
|
|
|
|
+ const res = getArrValue(data);
|
|
|
|
+ res.forEach((item) => {
|
|
|
|
+ item.isExistForm = !!item.isExistForm;
|
|
|
|
+ });
|
|
|
|
+ resolve(res);
|
|
|
|
+};
|
|
|
|
|
|
//全加载树
|
|
//全加载树
|
|
-const treeData = ref([])
|
|
|
|
|
|
+const treeData = ref([]);
|
|
const getTreeAllData = async () => {
|
|
const getTreeAllData = async () => {
|
|
const { data } = await mainApi.getAllTree({
|
|
const { data } = await mainApi.getAllTree({
|
|
- tenantId: '000000',
|
|
|
|
|
|
+ tenantId: "000000",
|
|
type: 1,
|
|
type: 1,
|
|
wbsId: formModelName.value,
|
|
wbsId: formModelName.value,
|
|
- })
|
|
|
|
- treeData.value = getArrValue(data)
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
|
|
+ });
|
|
|
|
+ treeData.value = getArrValue(data);
|
|
|
|
+};
|
|
|
|
|
|
//树节点被点击
|
|
//树节点被点击
|
|
-const nodeInfo = ref({})
|
|
|
|
-const treeNodeIds = ref([])
|
|
|
|
|
|
+const nodeInfo = ref({});
|
|
|
|
+const treeNodeIds = ref([]);
|
|
const treeNodeTap = ({ data, keys }) => {
|
|
const treeNodeTap = ({ data, keys }) => {
|
|
- nodeInfo.value = data
|
|
|
|
- treeNodeIds.value = keys
|
|
|
|
- getNodeTable(data.id)
|
|
|
|
-}
|
|
|
|
|
|
+ nodeInfo.value = data;
|
|
|
|
+ treeNodeIds.value = keys;
|
|
|
|
+ getNodeTable(data.id);
|
|
|
|
+};
|
|
|
|
|
|
//获取清表信息
|
|
//获取清表信息
|
|
const nodeTableColumn = [
|
|
const nodeTableColumn = [
|
|
- { key: 'tableName', name: '已有元素表名称' },
|
|
|
|
- { key: 'action', name: '操作', width: 90, align: 'center' },
|
|
|
|
-]
|
|
|
|
-const nodeTableData = ref([])
|
|
|
|
|
|
+ { key: "tableName", name: "已有元素表名称" },
|
|
|
|
+ { key: "action", name: "操作", width: 90, align: "center" },
|
|
|
|
+];
|
|
|
|
+const nodeTableData = ref([]);
|
|
const getNodeTable = async (id) => {
|
|
const getNodeTable = async (id) => {
|
|
- const { data } = await mainApi.getNodeTable({ id })
|
|
|
|
- const res = getArrValue(data)
|
|
|
|
|
|
+ const { data } = await mainApi.getNodeTable({ id });
|
|
|
|
+ const res = getArrValue(data);
|
|
for (let i = 0; i < res.length; i++) {
|
|
for (let i = 0; i < res.length; i++) {
|
|
- res[i].checknd = Number(res[i].isLinkTable) === 2
|
|
|
|
|
|
+ res[i].checknd = Number(res[i].isLinkTable) === 2;
|
|
}
|
|
}
|
|
- nodeTableData.value = res
|
|
|
|
-}
|
|
|
|
|
|
+ nodeTableData.value = res;
|
|
|
|
+};
|
|
|
|
|
|
//选择关联
|
|
//选择关联
|
|
const rowLinkClick = async (row) => {
|
|
const rowLinkClick = async (row) => {
|
|
@@ -243,33 +345,33 @@ const rowLinkClick = async (row) => {
|
|
id: row.id,
|
|
id: row.id,
|
|
excelTabId: dataInfo.value.id,
|
|
excelTabId: dataInfo.value.id,
|
|
elementList: tableData.value,
|
|
elementList: tableData.value,
|
|
- })
|
|
|
|
- if (!isRes) return
|
|
|
|
- row.checknd = true
|
|
|
|
- row.isLinkTable = 2
|
|
|
|
-}
|
|
|
|
|
|
+ });
|
|
|
|
+ if (!isRes) return;
|
|
|
|
+ row.checknd = true;
|
|
|
|
+ row.isLinkTable = 2;
|
|
|
|
+};
|
|
|
|
|
|
//取消关联
|
|
//取消关联
|
|
const rowUnlinkClick = async (row) => {
|
|
const rowUnlinkClick = async (row) => {
|
|
const { isRes } = await mainApi.cancelRelation({
|
|
const { isRes } = await mainApi.cancelRelation({
|
|
id: row.id,
|
|
id: row.id,
|
|
excelTabId: dataInfo.value.id,
|
|
excelTabId: dataInfo.value.id,
|
|
- })
|
|
|
|
- if (!isRes) return
|
|
|
|
- row.checknd = false
|
|
|
|
- row.isLinkTable = 1
|
|
|
|
-}
|
|
|
|
|
|
+ });
|
|
|
|
+ if (!isRes) return;
|
|
|
|
+ row.checknd = false;
|
|
|
|
+ row.isLinkTable = 1;
|
|
|
|
+};
|
|
|
|
|
|
//选项卡
|
|
//选项卡
|
|
-const tabsKey = ref('1')
|
|
|
|
|
|
+const tabsKey = ref("1");
|
|
const tabsData = ref([
|
|
const tabsData = ref([
|
|
- { key: '1', name: '关联元素表' },
|
|
|
|
- { key: '2', name: '新增元素表' },
|
|
|
|
-])
|
|
|
|
|
|
+ { key: "1", name: "关联元素表" },
|
|
|
|
+ { key: "2", name: "新增元素表" },
|
|
|
|
+]);
|
|
const tabsChange = async ({ key }) => {
|
|
const tabsChange = async ({ key }) => {
|
|
- tabsKey.value = key
|
|
|
|
- const form = getObjValue(dataInfo.value)
|
|
|
|
- const tree = getObjValue(nodeInfo.value)
|
|
|
|
|
|
+ tabsKey.value = key;
|
|
|
|
+ const form = getObjValue(dataInfo.value);
|
|
|
|
+ const tree = getObjValue(nodeInfo.value);
|
|
//默认表单数据
|
|
//默认表单数据
|
|
formModel.value = {
|
|
formModel.value = {
|
|
wbsId: formModelName.value,
|
|
wbsId: formModelName.value,
|
|
@@ -277,99 +379,99 @@ const tabsChange = async ({ key }) => {
|
|
nodeName: form.name,
|
|
nodeName: form.name,
|
|
excelTabId: form.id,
|
|
excelTabId: form.id,
|
|
elementList: tableData.value,
|
|
elementList: tableData.value,
|
|
- }
|
|
|
|
|
|
+ };
|
|
//判断当前选项卡
|
|
//判断当前选项卡
|
|
- if (key === '1') {
|
|
|
|
- formModel.value.submitStatus = 1
|
|
|
|
- getNodeTable(nodeInfo.value.id).then()
|
|
|
|
- } else if (key === '2') {
|
|
|
|
|
|
+ if (key === "1") {
|
|
|
|
+ formModel.value.submitStatus = 1;
|
|
|
|
+ getNodeTable(nodeInfo.value.id).then();
|
|
|
|
+ } else if (key === "2") {
|
|
//默认表单数据
|
|
//默认表单数据
|
|
- formModel.value.submitStatus = 2
|
|
|
|
|
|
+ formModel.value.submitStatus = 2;
|
|
//获取下拉数据
|
|
//获取下拉数据
|
|
- excelTypeData.value = await getDictionaryData('table_type')
|
|
|
|
- ownerTypeList.value = await getDictionaryData('owner_type')
|
|
|
|
|
|
+ excelTypeData.value = await getDictionaryData("table_type");
|
|
|
|
+ ownerTypeList.value = await getDictionaryData("owner_type");
|
|
//设置默认类型
|
|
//设置默认类型
|
|
if (form.tabType > 0 && form.tabType < 100) {
|
|
if (form.tabType > 0 && form.tabType < 100) {
|
|
- formModel.value.tableType = form.tabType
|
|
|
|
|
|
+ formModel.value.tableType = form.tabType;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
-}
|
|
|
|
|
|
+};
|
|
|
|
|
|
-const excelTypeData = ref([])
|
|
|
|
-const ownerTypeList = ref([])
|
|
|
|
|
|
+const excelTypeData = ref([]);
|
|
|
|
+const ownerTypeList = ref([]);
|
|
|
|
|
|
//基础表单
|
|
//基础表单
|
|
-const formRef = ref(null)
|
|
|
|
-const formModel = ref({})
|
|
|
|
|
|
+const formRef = ref(null);
|
|
|
|
+const formModel = ref({});
|
|
const formRules = {
|
|
const formRules = {
|
|
nodeName: {
|
|
nodeName: {
|
|
required: true,
|
|
required: true,
|
|
- trigger: 'blur',
|
|
|
|
- message: '请输入元素表名',
|
|
|
|
|
|
+ trigger: "blur",
|
|
|
|
+ message: "请输入元素表名",
|
|
},
|
|
},
|
|
tableType: {
|
|
tableType: {
|
|
required: true,
|
|
required: true,
|
|
- trigger: 'blur',
|
|
|
|
- message: '请选择清表类型',
|
|
|
|
|
|
+ trigger: "blur",
|
|
|
|
+ message: "请选择清表类型",
|
|
},
|
|
},
|
|
tableOwner: {
|
|
tableOwner: {
|
|
required: true,
|
|
required: true,
|
|
- trigger: 'blur',
|
|
|
|
- message: '请选择所属方',
|
|
|
|
|
|
+ trigger: "blur",
|
|
|
|
+ message: "请选择所属方",
|
|
},
|
|
},
|
|
-}
|
|
|
|
|
|
+};
|
|
|
|
|
|
//提交
|
|
//提交
|
|
-const submitLoading = ref(false)
|
|
|
|
|
|
+const submitLoading = ref(false);
|
|
const dialogSubmit = async () => {
|
|
const dialogSubmit = async () => {
|
|
- const isForm = await formValidate(formRef.value)
|
|
|
|
- if (!isForm) return false
|
|
|
|
- if (tabsKey.value === '1') {
|
|
|
|
- submitLoading.value = true
|
|
|
|
- const { isRes } = await mainApi.submitExcelElement(formModel.value)
|
|
|
|
- submitLoading.value = false
|
|
|
|
- if (!isRes) return
|
|
|
|
- window.$message.success('操作成功')
|
|
|
|
- emit('finish')
|
|
|
|
|
|
+ const isForm = await formValidate(formRef.value);
|
|
|
|
+ if (!isForm) return false;
|
|
|
|
+ if (tabsKey.value === "1") {
|
|
|
|
+ submitLoading.value = true;
|
|
|
|
+ const { isRes } = await mainApi.submitExcelElement(formModel.value);
|
|
|
|
+ submitLoading.value = false;
|
|
|
|
+ if (!isRes) return;
|
|
|
|
+ window.$message.success("操作成功");
|
|
|
|
+ emit("finish");
|
|
} else {
|
|
} else {
|
|
- submitLoading.value = true
|
|
|
|
- let nodeIds1, nodeIds2
|
|
|
|
|
|
+ submitLoading.value = true;
|
|
|
|
+ let nodeIds1, nodeIds2;
|
|
if (treeRef1.value) {
|
|
if (treeRef1.value) {
|
|
- nodeIds1 = treeRef1.value?.treeRef?.getCheckedKeys()
|
|
|
|
|
|
+ nodeIds1 = treeRef1.value?.treeRef?.getCheckedKeys() || [];
|
|
}
|
|
}
|
|
if (treeRef1.value) {
|
|
if (treeRef1.value) {
|
|
- nodeIds2 = treeRef2.value?.treeRef?.getCheckedKeys()
|
|
|
|
|
|
+ nodeIds2 = treeRef2.value?.treeRef?.getCheckedKeys() || [];
|
|
}
|
|
}
|
|
- const selectNodeIds = uniqueArr(nodeIds1, nodeIds2)
|
|
|
|
|
|
+ const selectNodeIds = uniqueArr(nodeIds1, nodeIds2);
|
|
if (selectNodeIds.length <= 0) {
|
|
if (selectNodeIds.length <= 0) {
|
|
- window?.$message.warning('至少勾选一个节点')
|
|
|
|
- submitLoading.value = false
|
|
|
|
- return
|
|
|
|
|
|
+ window?.$message.warning("至少勾选一个节点");
|
|
|
|
+ submitLoading.value = false;
|
|
|
|
+ return;
|
|
}
|
|
}
|
|
- formModel.value.nodeIds = selectNodeIds
|
|
|
|
- const { isRes } = await mainApi.submitExcelElement(formModel.value)
|
|
|
|
- submitLoading.value = false
|
|
|
|
- if (!isRes) return
|
|
|
|
- window.$message.success('操作成功')
|
|
|
|
- dialogClose()
|
|
|
|
- emit('finish')
|
|
|
|
|
|
+ formModel.value.nodeIds = selectNodeIds;
|
|
|
|
+ const { isRes } = await mainApi.submitExcelElement(formModel.value);
|
|
|
|
+ submitLoading.value = false;
|
|
|
|
+ if (!isRes) return;
|
|
|
|
+ window.$message.success("操作成功");
|
|
|
|
+ dialogClose();
|
|
|
|
+ emit("finish");
|
|
}
|
|
}
|
|
-}
|
|
|
|
|
|
+};
|
|
|
|
|
|
//数组去重
|
|
//数组去重
|
|
const uniqueArr = (arr1, arr2) => {
|
|
const uniqueArr = (arr1, arr2) => {
|
|
//合并两个数组
|
|
//合并两个数组
|
|
- arr1.push(...arr2)//或者arr1 = [...arr1,...arr2]
|
|
|
|
|
|
+ arr1.push(...arr2); //或者arr1 = [...arr1,...arr2]
|
|
//去重
|
|
//去重
|
|
- return Array.from(new Set(arr1))//let arr3 = [...new Set(arr1)]
|
|
|
|
-}
|
|
|
|
|
|
+ return Array.from(new Set(arr1)); //let arr3 = [...new Set(arr1)]
|
|
|
|
+};
|
|
|
|
|
|
//关闭弹窗
|
|
//关闭弹窗
|
|
const dialogClose = () => {
|
|
const dialogClose = () => {
|
|
- isShow.value = false
|
|
|
|
- submitLoading.value = false
|
|
|
|
- emit('close')
|
|
|
|
-}
|
|
|
|
|
|
+ isShow.value = false;
|
|
|
|
+ submitLoading.value = false;
|
|
|
|
+ emit("close");
|
|
|
|
+};
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
@@ -387,18 +489,30 @@ const dialogClose = () => {
|
|
</style>
|
|
</style>
|
|
|
|
|
|
<style lang="scss">
|
|
<style lang="scss">
|
|
-.el-overlay-dialog .el-dialog.hc-new-dialog.hc-exctab-element-web-temp .el-dialog__body .hc-new-dialog-body {
|
|
|
|
|
|
+.el-overlay-dialog
|
|
|
|
+ .el-dialog.hc-new-dialog.hc-exctab-element-web-temp
|
|
|
|
+ .el-dialog__body
|
|
|
|
+ .hc-new-dialog-body {
|
|
padding: 0;
|
|
padding: 0;
|
|
}
|
|
}
|
|
-.el-overlay-dialog .hc-exctab-element-web-temp-box .el-card.hc-card-box.hc-new-card-box {
|
|
|
|
|
|
+.el-overlay-dialog
|
|
|
|
+ .hc-exctab-element-web-temp-box
|
|
|
|
+ .el-card.hc-card-box.hc-new-card-box {
|
|
--el-card-bg-color: transparent;
|
|
--el-card-bg-color: transparent;
|
|
--el-card-padding: 0;
|
|
--el-card-padding: 0;
|
|
box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
-.hc-exctab-element-web-temp-box .hc-div-new-card-box.hc-tab-card-box .el-card .hc-card-header-box{
|
|
|
|
|
|
+.hc-exctab-element-web-temp-box
|
|
|
|
+ .hc-div-new-card-box.hc-tab-card-box
|
|
|
|
+ .el-card
|
|
|
|
+ .hc-card-header-box {
|
|
margin-top: 0;
|
|
margin-top: 0;
|
|
}
|
|
}
|
|
-.hc-exctab-element-web-temp-box .hc-div-new-card-box.hc-tab-card-box .el-card .tab-card-header-tabs .item {
|
|
|
|
|
|
+.hc-exctab-element-web-temp-box
|
|
|
|
+ .hc-div-new-card-box.hc-tab-card-box
|
|
|
|
+ .el-card
|
|
|
|
+ .tab-card-header-tabs
|
|
|
|
+ .item {
|
|
height: 30px;
|
|
height: 30px;
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|