|
@@ -1,53 +1,53 @@
|
|
<template>
|
|
<template>
|
|
<div class="hc-layout-box">
|
|
<div class="hc-layout-box">
|
|
- <div :style="'width:' + leftWidth + 'px;'" class="hc-layout-left-box">
|
|
|
|
|
|
+ <div :style="`width:${leftWidth}px;`" class="hc-layout-left-box">
|
|
<div class="hc-project-box">
|
|
<div class="hc-project-box">
|
|
<div class="hc-project-icon-box">
|
|
<div class="hc-project-icon-box">
|
|
- <HcIcon name="stack"/>
|
|
|
|
|
|
+ <HcIcon name="stack" />
|
|
</div>
|
|
</div>
|
|
<div class="ml-2 project-name-box">
|
|
<div class="ml-2 project-name-box">
|
|
- <span class="text-xl text-cut project-alias">{{ projectInfo['projectAlias'] }}</span>
|
|
|
|
- <div class="text-xs text-cut project-name">{{ projectInfo['name'] }}</div>
|
|
|
|
|
|
+ <span class="text-xl text-cut project-alias">{{ projectInfo.projectAlias }}</span>
|
|
|
|
+ <div class="text-xs text-cut project-name">{{ projectInfo.name }}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="hc-tree-box">
|
|
<div class="hc-tree-box">
|
|
<el-scrollbar>
|
|
<el-scrollbar>
|
|
- <HcLazyTree :autoExpandKeys="treeAutoExpandKeys" isType @load="treeLoadNode" @nodeTap="wbsElTreeClick"/>
|
|
|
|
- <!--WbsTree :autoExpandKeys="treeAutoExpandKeys" :classifyType="classifyType" :contractId="contractId"
|
|
|
|
- :projectId="projectId" @nodeTap="wbsElTreeClick"/-->
|
|
|
|
|
|
+ <HcLazyTree :auto-expand-keys="treeAutoExpandKeys" is-type @load="treeLoadNode" @nodeTap="wbsElTreeClick" />
|
|
|
|
+ <!-- WbsTree :autoExpandKeys="treeAutoExpandKeys" :classifyType="classifyType" :contractId="contractId"
|
|
|
|
+ :projectId="projectId" @nodeTap="wbsElTreeClick"/ -->
|
|
</el-scrollbar>
|
|
</el-scrollbar>
|
|
</div>
|
|
</div>
|
|
- <!--左右拖动-->
|
|
|
|
- <div class="horizontal-drag-line" @mousedown="onmousedown"/>
|
|
|
|
|
|
+ <!-- 左右拖动 -->
|
|
|
|
+ <div class="horizontal-drag-line" @mousedown="onmousedown" />
|
|
</div>
|
|
</div>
|
|
<div v-loading="isLoading" class="hc-chart-content-box">
|
|
<div v-loading="isLoading" class="hc-chart-content-box">
|
|
- <BarChart ref="barChartRef" :datas="barChartDatas"/>
|
|
|
|
|
|
+ <BarChart ref="barChartRef" :datas="barChartDatas" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
-import {ref, watch} from 'vue'
|
|
|
|
-import {useAppStore} from "~src/store";
|
|
|
|
-import {getStoreValue, setStoreValue} from '~src/utils/storage'
|
|
|
|
-import BarChart from "./components/echarts/BarChart.vue"
|
|
|
|
-import {getArrValue, getObjValue} from "js-fast-way"
|
|
|
|
-import DataApi from "~api/schedule/data"
|
|
|
|
-import queryApi from '~api/data-fill/query';
|
|
|
|
|
|
+import { ref, watch } from 'vue'
|
|
|
|
+import { useAppStore } from '~src/store'
|
|
|
|
+import { getStoreValue, setStoreValue } from '~src/utils/storage'
|
|
|
|
+import BarChart from './components/echarts/BarChart.vue'
|
|
|
|
+import { getArrValue, getObjValue } from 'js-fast-way'
|
|
|
|
+import DataApi from '~api/schedule/data'
|
|
|
|
+import queryApi from '~api/data-fill/query'
|
|
|
|
|
|
|
|
|
|
//变量
|
|
//变量
|
|
const useAppState = useAppStore()
|
|
const useAppState = useAppStore()
|
|
-const projectId = ref(useAppState.getProjectId);
|
|
|
|
-const contractId = ref(useAppState.getContractId);
|
|
|
|
-const projectInfo = ref(useAppState.getProjectInfo);
|
|
|
|
|
|
+const projectId = ref(useAppState.getProjectId)
|
|
|
|
+const contractId = ref(useAppState.getContractId)
|
|
|
|
+const projectInfo = ref(useAppState.getProjectInfo)
|
|
const isCollapse = ref(useAppState.getCollapse)
|
|
const isCollapse = ref(useAppState.getCollapse)
|
|
-const contractInfo = ref(useAppState.getContractInfo);
|
|
|
|
-const {contractType} = contractInfo.value;
|
|
|
|
|
|
+const contractInfo = ref(useAppState.getContractInfo)
|
|
|
|
+const { contractType } = contractInfo.value
|
|
const classifyType = ref(contractType === 2 ? '2' : '1')
|
|
const classifyType = ref(contractType === 2 ? '2' : '1')
|
|
//监听
|
|
//监听
|
|
watch(() => [
|
|
watch(() => [
|
|
- useAppState.getCollapse
|
|
|
|
|
|
+ useAppState.getCollapse,
|
|
], ([Collapse]) => {
|
|
], ([Collapse]) => {
|
|
isCollapse.value = Collapse
|
|
isCollapse.value = Collapse
|
|
barChartRef.value?.onResize()
|
|
barChartRef.value?.onResize()
|
|
@@ -58,28 +58,29 @@ const treeAutoExpandKeys = ref(getStoreValue('scheduleTreeKeys') || [])
|
|
const barChartRef = ref(null)
|
|
const barChartRef = ref(null)
|
|
|
|
|
|
//懒加载的数据
|
|
//懒加载的数据
|
|
-const treeLoadNode = async ({node, item, level},resolve) => {
|
|
|
|
- let contractIdRelation = '', parentId = '', primaryKeyId = '';
|
|
|
|
|
|
+const treeLoadNode = async ({ node, item, level }, resolve) => {
|
|
|
|
+ let contractIdRelation = '', parentId = '', primaryKeyId = ''
|
|
if (level !== 0) {
|
|
if (level !== 0) {
|
|
- const nodeData = getObjValue(item);
|
|
|
|
|
|
+ const nodeData = getObjValue(item)
|
|
contractIdRelation = nodeData?.contractIdRelation || ''
|
|
contractIdRelation = nodeData?.contractIdRelation || ''
|
|
parentId = contractIdRelation ? nodeData?.primaryKeyId : nodeData?.id
|
|
parentId = contractIdRelation ? nodeData?.primaryKeyId : nodeData?.id
|
|
primaryKeyId = nodeData?.id || ''
|
|
primaryKeyId = nodeData?.id || ''
|
|
}
|
|
}
|
|
//获取数据
|
|
//获取数据
|
|
- const {data} = await queryApi.queryWbsTreeData({
|
|
|
|
|
|
+ const { data } = await queryApi.queryWbsTreeData({
|
|
contractId: contractId.value || '',
|
|
contractId: contractId.value || '',
|
|
contractIdRelation,
|
|
contractIdRelation,
|
|
primaryKeyId,
|
|
primaryKeyId,
|
|
parentId,
|
|
parentId,
|
|
- classifyType: classifyType.value
|
|
|
|
|
|
+ classifyType: classifyType.value,
|
|
|
|
+ tableOwner:'',
|
|
})
|
|
})
|
|
resolve(getArrValue(data))
|
|
resolve(getArrValue(data))
|
|
}
|
|
}
|
|
|
|
|
|
//树被点击
|
|
//树被点击
|
|
const treeItemInfo = ref({})
|
|
const treeItemInfo = ref({})
|
|
-const wbsElTreeClick = ({data, keys}) => {
|
|
|
|
|
|
+const wbsElTreeClick = ({ data, keys }) => {
|
|
treeItemInfo.value = data
|
|
treeItemInfo.value = data
|
|
//缓存自动展开
|
|
//缓存自动展开
|
|
treeAutoExpandKeys.value = keys
|
|
treeAutoExpandKeys.value = keys
|
|
@@ -94,19 +95,19 @@ const barChartDatas = ref([])
|
|
const queryNeiWaiYeProgress = async () => {
|
|
const queryNeiWaiYeProgress = async () => {
|
|
//获取数据
|
|
//获取数据
|
|
isLoading.value = true
|
|
isLoading.value = true
|
|
- const {primaryKeyId, contractIdRelation} = treeItemInfo.value
|
|
|
|
- const {error, code, data} = await DataApi.queryNeiWaiYeProgress({
|
|
|
|
|
|
+ const { primaryKeyId, contractIdRelation } = treeItemInfo.value
|
|
|
|
+ const { error, code, data } = await DataApi.queryNeiWaiYeProgress({
|
|
projectId: projectId.value,
|
|
projectId: projectId.value,
|
|
contractId: contractIdRelation ? contractIdRelation : contractId.value,
|
|
contractId: contractIdRelation ? contractIdRelation : contractId.value,
|
|
contractIdRelation,
|
|
contractIdRelation,
|
|
primaryKeyId,
|
|
primaryKeyId,
|
|
- });
|
|
|
|
|
|
+ })
|
|
//处理数据
|
|
//处理数据
|
|
isLoading.value = false
|
|
isLoading.value = false
|
|
if (!error && code === 200) {
|
|
if (!error && code === 200) {
|
|
- barChartDatas.value = getArrValue(data);
|
|
|
|
|
|
+ barChartDatas.value = getArrValue(data)
|
|
} else {
|
|
} else {
|
|
- barChartDatas.value = [];
|
|
|
|
|
|
+ barChartDatas.value = []
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
@@ -115,15 +116,15 @@ const leftWidth = ref(382)
|
|
const onmousedown = () => {
|
|
const onmousedown = () => {
|
|
const leftNum = isCollapse.value ? 142 : 272
|
|
const leftNum = isCollapse.value ? 142 : 272
|
|
document.onmousemove = (ve) => {
|
|
document.onmousemove = (ve) => {
|
|
- const diffVal = ve.clientX - leftNum;
|
|
|
|
|
|
+ const diffVal = ve.clientX - leftNum
|
|
if (diffVal >= 310 && diffVal <= 900) {
|
|
if (diffVal >= 310 && diffVal <= 900) {
|
|
- leftWidth.value = diffVal;
|
|
|
|
|
|
+ leftWidth.value = diffVal
|
|
}
|
|
}
|
|
}
|
|
}
|
|
document.onmouseup = () => {
|
|
document.onmouseup = () => {
|
|
barChartRef.value?.onResize()
|
|
barChartRef.value?.onResize()
|
|
- document.onmousemove = null;
|
|
|
|
- document.onmouseup = null;
|
|
|
|
|
|
+ document.onmousemove = null
|
|
|
|
+ document.onmouseup = null
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|