更新

src/views/program/project/form.vue

@@ -1,5 +1,10 @@
 <template>
-    <HcCard action-ui="text-center" :title="detailData?.projectName">
+    <HcCard action-ui="text-center">
+        <template #header>
+            <div class="title text-lg">
+                {{ detailData.projectName }}
+            </div>
+        </template>
         <template #extra>
             <HcNewSwitch :datas="tabTab" :keys="tabKey" :round="false" @change="tabChange" />
         </template>
@@ -364,10 +369,7 @@ onActivated(() => {
     gettaskTypeList()
     if (dataType.value !== 'add') {
         getPlanByProjectId()
-
     }
-
-
 })
 
 const detailData = ref({})
@@ -378,9 +380,10 @@ const supervisorUnitData = ref([])
 const getPlanByProjectId = async ()=>{
     const { error, code, data } = await projectApi.getPlanByProjectId({ id: dataId.value })
     if (!error && code === 200) {
-        console.log(getObjValue(data), '详情')
-        const { constructUnit, buildUnit, supervisorUnit } = getObjValue(data)
-        detailData.value = getObjValue(data)
+        const res = getObjValue(data)
+        console.log(res, '详情')
+        const { constructUnit, buildUnit, supervisorUnit } = res
+        detailData.value = res
         constructionData.value = getArrValue(constructUnit)
         buildData.value = getArrValue(buildUnit)
         supervisorUnitData.value = getArrValue(supervisorUnit)
@@ -398,10 +401,8 @@ const getUserDict = async ()=>{
     const { error, code, data } = await getuserList({ tenantId:useAppState.tenantId })
     if (!error && code === 200) {
         userList.value = getArrValue(data)
-
     } else {
         userList.value = []
-
     }
 }
 //获取所有任务类型
@@ -411,10 +412,8 @@ const gettaskTypeList = async ()=>{
     const { error, code, data } = await getTaskType()
     if (!error && code === 200) {
         taskTypeList.value = getArrValue(data['records'])
-
     } else {
         taskTypeList.value = []
-
     }
 }
 //类型tab数据和相关处理
@@ -427,39 +426,46 @@ const tabTab = ref([
 const originTableData = ref([ {}])
 
 const tabChange = ({ key }) => {
+    console.log(key, 'key')
     tabKey.value = key
     if (key === 'supervision') {
-        tableData.value = supervisorUnitData.value && supervisorUnitData.value[radioType.value]?.length > 0 ? supervisorUnitData.value : originTableData.value
-        detailData.value.supervisorUnit = tableData.value
+        const res = getArrValue(supervisorUnitData.value && supervisorUnitData.value[radioType.value]?.length > 0 ? supervisorUnitData.value : originTableData.value)
+        tableData.value = res
+        detailData.value.supervisorUnit = res
     } else if (key === 'construction') {
-        tableData.value = constructionData.value[radioType.value]?.length > 0 ? constructionData.value : originTableData.value
-        detailData.value.constructUnit = tableData.value
-
-
+        const res = getArrValue(constructionData.value[radioType.value]?.length > 0 ? constructionData.value : originTableData.value)
+        tableData.value = res
+        detailData.value.constructUnit = res
     } else if (key === 'bulid') {
-        tableData.value = buildData.value[radioType.value]?.length > 0 ? buildData.value : originTableData.value
-        detailData.value.buildUnit = tableData.value
-
+        const res = getArrValue(buildData.value[radioType.value]?.length > 0 ? buildData.value : originTableData.value)
+        tableData.value = res
+        detailData.value.buildUnit = res
     }
+    console.log('tableData', tableData.value)
 }
 
 const radioType = ref('')
+
 //深度监听
 watch(() => [
     radioType.value,
     tabKey.value,
-], ([radioType]) => {
-    if (tabKey.value === 'construction') {
-        console.log(constructionData.value[radioType], 'constructionData.value')
-        tableData.value = getArrValue(constructionData.value[radioType])
-    } else if (tabKey.value === 'build') {
-        console.log(buildData.value[radioType], 'buildData.value')
-        tableData.value = getArrValue(buildData.value[radioType])
-    } else if (tabKey.value === 'supervision') {
-        console.log(supervisorUnitData.value[radioType], 'supervisorUnitData.value')
-        tableData.value = getArrValue(supervisorUnitData.value[radioType])
+], ([radio_type, tab_key]) => {
+    if (tab_key === 'construction') {
+        const res = getArrValue(constructionData.value[radio_type])
+        tableData.value = res
+        console.log('constructionData', res)
+    } else if (tab_key === 'build') {
+        const res = getArrValue(buildData.value[radio_type])
+        tableData.value = res
+        console.log('buildData', res)
+    } else if (tab_key === 'supervision') {
+        const res = getArrValue(supervisorUnitData.value[radio_type])
+        tableData.value = res
+        console.log('supervisorUnitData', res)
     }
 }, { deep: true })
+
 //表格
 const tableColumn = [
     { key: 'projectProcessValue', name: '项目环节', width: '160', align: 'center' },
@@ -483,9 +489,7 @@ const tableColumn = [
     { key: 'returnedValue', name: '关联回款里程碑', minWidth: '200', isTooltip: true },
     { key: 'action', name: '操作', width: '280', align: 'center', fixed: 'right' },
 ]
-const tableData = ref([
-
-])
+const tableData = ref([])
 
 //表格行样式
 const tableRowStyle = ({ row }) => {

src/views/program/project/index.vue

@@ -3,47 +3,46 @@
         <template #header>
             <div class="w-36">
                 <el-select v-model="searchForm.projectType" block clearable placeholder="项目类型" size="large">
-                    <el-option v-for="item in planType" :label="item.name" :value="item.key"/>
+                    <el-option v-for="item in planType" :label="item.name" :value="item.key" />
                 </el-select>
             </div>
             <div class="w-36 ml-2">
                 <el-select v-model="searchForm.projectServerType" block clearable placeholder="服务类型" size="large">
-                    <el-option v-for="item in department" :label="item.name" :value="item.key"/>
+                    <el-option v-for="item in department" :label="item.name" :value="item.key" />
                 </el-select>
             </div>
             <div class="w-56 ml-2">
-                <el-input v-model="searchForm.name" clearable placeholder="请输入项目名称查询" @keyup="keyUpEvent" size="large"/>
+                <el-input v-model="searchForm.name" clearable placeholder="请输入项目名称查询" size="large" @keyup="keyUpEvent" />
             </div>
             <div class="ml-4">
                 <el-button size="large" type="primary" @click="searchClick">
-                    <HcIcon name="search-2"/>
+                    <HcIcon name="search-2" />
                     <span>搜索</span>
                 </el-button>
             </div>
             <div class="ml-2">
                 <el-button size="large" @click="resetClick">
-                    <HcIcon name="close-circle"/>
+                    <HcIcon name="close-circle" />
                     <span>重置</span>
                 </el-button>
             </div>
         </template>
-        <HcTable :isIndex="false" :column="tableColumn" :datas="tableData" :loading="tableLoading">
-            <template #name="{row}">
-                <span class="text-blue text-hover" @click="rowNameClick(row)">{{row.name}}</span>
+        <HcTable :is-index="false" :column="tableColumn" :datas="tableData" :loading="tableLoading">
+            <template #name="{ row }">
+                <span class="text-blue text-hover" @click="rowNameClick(row)">{{ row.name }}</span>
             </template>
         </HcTable>
         <template #action>
-            <HcPages :pages="searchForm" @change="pageChange"/>
+            <HcPages :pages="searchForm" @change="pageChange" />
         </template>
     </HcCard>
 </template>
 
 <script setup>
-
-import {useRouter} from 'vue-router'
-import {ref,onMounted,onActivated} from "vue";
-import projectApi from '~api/program/project.js';
-import {getArrValue} from "js-fast-way"
+import { useRouter } from 'vue-router'
+import { onActivated, onMounted, ref } from 'vue'
+import projectApi from '~api/program/project.js'
+import { getArrValue } from 'js-fast-way'
 
 const router = useRouter()
 onActivated(()=>{
@@ -52,45 +51,45 @@ onActivated(()=>{
 })
 //计划类型
 const planType = ref([
-    {name: '临时计划', key: '1'},
-    {name: '月度计划', key: '2'},
-    {name: '年度计划', key: '3'},
+    { name: '临时计划', key: '1' },
+    { name: '月度计划', key: '2' },
+    { name: '年度计划', key: '3' },
 ])
 
 //选择部门
 const department = ref([
-    {name: '研发部门', key: '1'},
-    {name: '业务部门', key: '2'},
-    {name: '人事部门', key: '3'},
+    { name: '研发部门', key: '1' },
+    { name: '业务部门', key: '2' },
+    { name: '人事部门', key: '3' },
 ])
 
 //搜索表单
 const searchForm = ref({
-   
-    current: 1, size: 20, total: 0
+
+    current: 1, size: 20, total: 0,
 })
 
 //搜索框回车
 const keyUpEvent = (event) => {
-    if (event.key === "Enter") {
-        searchForm.value.current = 1;
+    if (event.key === 'Enter') {
+        searchForm.value.current = 1
         getTableData()
     }
 }
 
 //搜索
 const searchClick = () => {
-    searchForm.value.current = 1;
+    searchForm.value.current = 1
     getTableData()
 }
 
 //重置搜索表单
 const resetClick = () => {
-    searchForm.value = {current: 1, size: 20, total: 0}
+    searchForm.value = { current: 1, size: 20, total: 0 }
 }
 
 //分页被点击
-const pageChange = ({current, size}) => {
+const pageChange = ({ current, size }) => {
     searchForm.value.current = current
     searchForm.value.size = size
     getTableData()
@@ -99,21 +98,21 @@ const pageChange = ({current, size}) => {
 //获取数据
 const tableLoading = ref(false)
 const tableColumn = [
-    {key: 'number', name: '项目编号', width: '100'},
-    {key: 'name', name: '项目名称'},
-    {key: 'projectTypeValue', name: '项目类型'},
-    {key: 'projectServerTypeValue', name: '项目服务类型'},
-    {key: 'currentProcessName', name: '项目进程'},
+    { key: 'number', name: '项目编号', width: '100' },
+    { key: 'name', name: '项目名称' },
+    { key: 'projectTypeValue', name: '项目类型' },
+    { key: 'projectServerTypeValue', name: '项目服务类型' },
+    { key: 'currentProcessName', name: '项目进程' },
 ]
 const tableData = ref([
-    {id: 1, key: 'JH-01', key1: '2023年5月度计划', key2: '高速公路', key3: '软件合同', key4: '产品-研发'},
-    {id: 2, key: 'JH-01', key1: '2023年5月度计划', key2: '高速公路', key3: '软件合同', key4: '产品-研发'},
-    {id: 3, key: 'JH-01', key1: '2023年5月度计划', key2: '高速公路', key3: '软件合同', key4: '产品-研发'},
+    { id: 1, key: 'JH-01', key1: '2023年5月度计划', key2: '高速公路', key3: '软件合同', key4: '产品-研发' },
+    { id: 2, key: 'JH-01', key1: '2023年5月度计划', key2: '高速公路', key3: '软件合同', key4: '产品-研发' },
+    { id: 3, key: 'JH-01', key1: '2023年5月度计划', key2: '高速公路', key3: '软件合同', key4: '产品-研发' },
 ])
 
-const getTableData = async() => {
+const getTableData = async () => {
     tableLoading.value = true
-    const {error, code, data} = await projectApi.getPage(searchForm.value)
+    const { error, code, data } = await projectApi.getPage(searchForm.value)
     tableLoading.value = false
     if (!error && code === 200) {
         tableData.value = getArrValue(data)
@@ -130,8 +129,8 @@ const rowNameClick = (row) => {
         name: 'program-project-form',
         query: {
             id: row.id,
-            type:'edit'
-        }
+            type:'edit',
+        },
     })
 }
 </script>