创建项目

src/views/project/info/template.vue

@@ -1,13 +1,13 @@
 <template>
     <div class="hc-project-wbs-template relative h-full">
         <div class="wbs-template-segmented relative mb-14px text-center">
-            <el-segmented v-model="templateType" :options="templateTypeData" size="large" @change="templateTypeChange" />
+            <el-segmented v-model="templateType" :options="templateTypeData" size="large" @change="getWbsTreeList" />
         </div>
-        <div class="hc-flex-center relative mb-14px">
+        <div v-loading="isLoading" class="hc-flex-center relative mb-14px">
             <span>选择WBS：</span>
-            <el-select v-model="wbsId" placeholder="请选择WBS" class="w-500px" size="large" @change="wbsChange">
-                <el-option-group v-for="group in treeList" :key="group.label" :label="group.label">
-                    <el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value" />
+            <el-select v-model="wbsId" placeholder="请选择WBS" class="w-500px" size="large" :disabled="isDisabled" @change="wbsChange">
+                <el-option-group v-for="group in wbsTreeList" :key="group.label" :label="group.label">
+                    <el-option v-for="item in group.data" :key="item.value" :label="item.label" :value="item.value" />
                 </el-option-group>
             </el-select>
         </div>
@@ -45,12 +45,13 @@
 
 <script setup>
 import { onMounted, ref, watch } from 'vue'
-import measureApi from '~api/measure/template'
+import { useAppStore } from '~src/store'
+import { getArrValue, getObjValue, isNullES } from 'js-fast-way'
+import mainApi from '~api/project/project'
+import treeApi from '~api/wbs/tree'
 
-//渲染完成
-onMounted(() => {
-
-})
+//缓存
+const store = useAppStore()
 
 //双向绑定
 const modelData = defineModel('modelValue', {
@@ -63,31 +64,147 @@ watch(() => modelData.value, (data) => {
     formModel.value = data
 }, { immediate: true, deep: true })
 
-//监听表单数据
-watch(() => formModel.value, (data) => {
-    modelData.value = data
-}, { deep: true })
+//监听
+const userInfo = ref(store.getUserInfo)
+watch(() => store.getUserInfo, (info) => {
+    userInfo.value = info
+}, { immediate: true, deep: true })
 
+//渲染完成
+onMounted(() => {
+    getWbsTreeList()
+})
+
+//顶部类型
 const templateType = ref(1)
-const templateTypeData = [
-    { value:1, label: '质检' }, { value:2, label: '试验' },
-    { value:3, label: '计量' }, { value:5, label: '征拆' },
-]
-const templateTypeChange = () => {
+const templateTypeData = [{ value: 1, label: '质检' }, { value: 2, label: '试验' }, { value: 3, label: '计量' }, { value: 5, label: '征拆' }]
 
+//获取WBS树列表
+const wbsId = ref('')
+const wbsTreeList = ref([])
+const isLoading = ref(false)
+const getWbsTreeList = async () => {
+    const type = templateType.value
+    isLoading.value = true
+    const { data } = await mainApi.findWbsTreeList(type)
+    // 格式化数据
+    const res = getObjValue(data)
+    let arr = [{ label: '公有库', data: [] }, { label: '私有库', data: [] }]
+    const wbsInfos = getArrValue(res.wbsInfos), wbsPrivates = getArrValue(res.wbsTreePrivates)
+    // 公有库
+    wbsInfos.forEach((item) => {
+        item.value = item.id
+        item.label = item.wbsName
+    })
+    arr[0].data = wbsInfos
+    // 私有库
+    wbsPrivates.forEach((item) => {
+        item.label = item.projectName
+        item.value = item.wbsId + ',' + item.projectId
+    })
+    arr[1].data = wbsPrivates
+    wbsTreeList.value = arr
+    //处理选中
+    const form = getObjValue(formModel.value)
+    wbsId.value = type === 1 ? form.referenceWbsTemplateId : form.referenceWbsTemplateIdTrial
+    if (type === 3) wbsId.value = form.referenceWbsTemplateIdMeter
+    if (type === 5) wbsId.value = form.referenceWbsTemplateIdLar
+    if (type === -1) wbsId.value = ''
+    isLoading.value = false
+    await wbsChange(wbsId.value)
 }
 
-const wbsId = ref('')
-const treeList = ref([])
-const wbsChange = () => {
+//切换wbs树
+const isDisabled = ref(false)
+const wbsChange = async (val) => {
+    isDisabled.value = false
+    const type = templateType.value
+    if (type === 1) {
+        formModel.value.referenceWbsTemplateId = val
+    } else if (type === 3) {
+        formModel.value.referenceWbsTemplateIdMeter = val
+    } else if (type === 5) {
+        formModel.value.referenceWbsTemplateIdLar = val
+    } else {
+        formModel.value.referenceWbsTemplateIdTrial = val
+    }
+    leftLoading.value = true
+    if (!isNullES(val) && val.toString().indexOf(',') >= 0) {
+        //私有库
+        if (type === 1) {
+            formModel.value.referenceWbsTemplateType = 'private'
+        } else if (type === 2) {
+            formModel.value.referenceWbsTemplateTypeMeter = 'private'
+        } else if (type === 5) {
+            formModel.value.referenceWbsTemplateTypeLar = 'private'
+        } else {
+            formModel.value.referenceWbsTemplateTypeTrial = 'private'
+        }
+        let ids = val.toString().split(',')
+        const { data } = await mainApi.findProjectTree({
+            projectId: ids[1],
+            wbsId: ids[0],
+        })
+        leftTreeData.value = getArrValue(data)
+        leftLoading.value = false
+    } else {
+        //公有库
+        if (!isNullES(val) && val.length > 0) {
+            if (type === 1) {
+                formModel.value.referenceWbsTemplateType = 'public'
+            } else if (type === 2) {
+                formModel.value.referenceWbsTemplateTypeMeter = 'public'
+            } else if (type === 5) {
+                formModel.value.referenceWbsTemplateTypeLar = 'public'
+            } else {
+                formModel.value.referenceWbsTemplateTypeTrial = 'public'
+            }
+        }
+        const { tenant_id } = getObjValue(userInfo.value)
+        const { data } = await treeApi.getAlltree({
+            tenantId: tenant_id,
+            type: '1',
+            wbsId: val,
+        })
+        leftTreeData.value = getArrValue(data)
+        leftLoading.value = false
+    }
+    await getRightTreeApi()
+}
+
+//左边树
+const leftLoading = ref(false)
+const leftTreeData = ref([])
 
+//获取右边数据
+const rightLoading = ref(false)
+const getRightTreeApi = async () => {
+    rightLoading.value = true
+    isDisabled.value = true
+    const type = templateType.value, form = getObjValue(formModel.value)
+    let refId = type === 1 ? form.referenceWbsTemplateId : form.referenceWbsTemplateIdTrial
+    if (type === 3) refId = form.referenceWbsTemplateIdMeter
+    if (type === 5) refId = form.referenceWbsTemplateIdLar
+    console.log('refId', refId)
+    if (isNullES(refId)) {
+        isDisabled.value = false
+        rightLoading.value = false
+        return
+    }
+    let newWbsId = ''
+    if (form.referenceWbsTemplateType === 'private' && refId.toString().length > 0 && type === 1) {
+        let ids = refId.toString().split(',')
+        console.log('ids', ids)
+    }
 }
 
+
 const allChecked = ref(false)
 </script>
 
 <style lang="scss">
 .hc-project-wbs-template {
+    padding: 0 12px;
     .wbs-template-segmented .el-segmented {
         --el-border-radius-base: 50px;
         .el-segmented__item {
@@ -108,6 +225,7 @@ const allChecked = ref(false)
                 padding: 0 12px;
                 margin-bottom: 0;
                 background: #f9f9f9;
+                border-radius: 4px 4px 0 0;
                 border-bottom: 1px solid #eee;
             }
             .hc-card-item-body {