Browse Source

跳转页面

duy 2 years ago
parent
commit
e8654e7d50
1 changed files with 137 additions and 94 deletions
  1. 137 94
      src/views/home/index/admin.vue

+ 137 - 94
src/views/home/index/admin.vue

@@ -5,47 +5,65 @@
                 <el-col :span="4">
                     <HcCardItem ui="hac-card-item">
                         <template #header>
-                            <div class="hac-card-title g">年度合同指标</div>
+                            <div class="hac-card-title g">
+                                年度合同指标
+                            </div>
                         </template>
                         <template #extra>
                             <img class="hac-extra-img" :src="QImg" alt="">
                         </template>
                         <div class="hac-card-item-body">
-                            <div class="money">¥{{planAnnualTarget.annualContractTarget}}</div>
-                            <div class="text">已收入:¥{{planAnnualTarget.yearReturned}}</div>
+                            <div class="money">
+                                ¥{{ planAnnualTarget.annualContractTarget }}
+                            </div>
+                            <div class="text">
+                                已收入:¥{{ planAnnualTarget.yearReturned }}
+                            </div>
                         </div>
                     </HcCardItem>
                 </el-col>
                 <el-col :span="4">
                     <HcCardItem ui="hac-card-item">
                         <template #header>
-                            <div class="hac-card-title g">年度利润指标</div>
+                            <div class="hac-card-title g">
+                                年度利润指标
+                            </div>
                         </template>
                         <template #extra>
                             <img class="hac-extra-img" :src="QImg" alt="">
                         </template>
                         <div class="hac-card-item-body">
-                            <div class="money">¥{{planAnnualTarget.annualProfitTarget}}</div>
-                            <div class="text">已盈利:¥{{planAnnualTarget.yearProfit}}</div>
+                            <div class="money">
+                                ¥{{ planAnnualTarget.annualProfitTarget }}
+                            </div>
+                            <div class="text">
+                                已盈利:¥{{ planAnnualTarget.yearProfit }}
+                            </div>
                         </div>
                     </HcCardItem>
                 </el-col>
                 <el-col :span="16">
                     <HcCardItem ui="hac-card-item">
                         <template #header>
-                            <div class="hac-card-title g">进度统计</div>
+                            <div class="hac-card-title g">
+                                进度统计
+                            </div>
                         </template>
                         <div class="hac-card-item-body">
                             <div class="hac-item-progress">
-                                <div class="title">年度合同指标</div>
+                                <div class="title">
+                                    年度合同指标
+                                </div>
                                 <div class="num">
-                                    <el-progress :text-inside="true" :stroke-width="18" :percentage="planAnnualTarget.contractSchedule" color="#8978FD"/>
+                                    <el-progress :text-inside="true" :stroke-width="18" :percentage="planAnnualTarget.contractSchedule" color="#8978FD" />
                                 </div>
                             </div>
                             <div class="hac-item-progress">
-                                <div class="title">年度利润指标</div>
+                                <div class="title">
+                                    年度利润指标
+                                </div>
                                 <div class="num">
-                                    <el-progress :text-inside="true" :stroke-width="18" :percentage="planAnnualTarget.profitSchedule" color="#73A3FE"/>
+                                    <el-progress :text-inside="true" :stroke-width="18" :percentage="planAnnualTarget.profitSchedule" color="#73A3FE" />
                                 </div>
                             </div>
                         </div>
@@ -55,10 +73,12 @@
 
             <HcCardItem ui="hac-card-item mt-4">
                 <template #header>
-                    <div class="hac-card-title text-black">年度各项费用统计</div>
+                    <div class="hac-card-title text-black">
+                        年度各项费用统计
+                    </div>
                 </template>
                 <template #extra>
-                    <HcDropdown :cur="planYear1" :datas="yearData" :all="yearData.length > 0" @change="planYear1Change" v-if="yearData.length > 0"/>
+                    <HcDropdown v-if="yearData.length > 0" :cur="planYear1" :datas="yearData" :all="yearData.length > 0" @change="planYear1Change" />
                 </template>
                 <div class="hac-card-item-body mb-2">
                     <el-row :gutter="14">
@@ -66,9 +86,11 @@
                             <HcGradientCard color="purple1">
                                 <div class="hc-card-item-sub">
                                     <div class="item-sub-content">
-                                        <div class="title">总合同</div>
+                                        <div class="title">
+                                            总合同
+                                        </div>
                                         <div class="num-box">
-                                            <span class="num">{{annualCostData.yearContractMoney ?? 0}}</span>
+                                            <span class="num">{{ annualCostData.yearContractMoney ?? 0 }}</span>
                                             <span class="text">元</span>
                                         </div>
                                     </div>
@@ -82,9 +104,11 @@
                             <HcGradientCard color="blue1">
                                 <div class="hc-card-item-sub">
                                     <div class="item-sub-content">
-                                        <div class="title">总收入</div>
+                                        <div class="title">
+                                            总收入
+                                        </div>
                                         <div class="num-box">
-                                            <span class="num">{{annualCostData.yearReturned ?? 0}}</span>
+                                            <span class="num">{{ annualCostData.yearReturned ?? 0 }}</span>
                                             <span class="text">元</span>
                                         </div>
                                     </div>
@@ -98,9 +122,11 @@
                             <HcGradientCard color="red1">
                                 <div class="hc-card-item-sub">
                                     <div class="item-sub-content">
-                                        <div class="title">总实际支出</div>
+                                        <div class="title">
+                                            总实际支出
+                                        </div>
                                         <div class="num-box">
-                                            <span class="num">{{annualCostData.yearStaffDisburse ?? 0}}</span>
+                                            <span class="num">{{ annualCostData.yearStaffDisburse ?? 0 }}</span>
                                             <span class="text">元</span>
                                         </div>
                                     </div>
@@ -114,9 +140,11 @@
                             <HcGradientCard color="purple1">
                                 <div class="hc-card-item-sub">
                                     <div class="item-sub-content">
-                                        <div class="title">总计划支出</div>
+                                        <div class="title">
+                                            总计划支出
+                                        </div>
                                         <div class="num-box">
-                                            <span class="num">{{annualCostData.totalBudget ?? 0}}</span>
+                                            <span class="num">{{ annualCostData.totalBudget ?? 0 }}</span>
                                             <span class="text">元</span>
                                         </div>
                                     </div>
@@ -132,14 +160,16 @@
 
             <HcCardItem ui="hac-card-item mt-4">
                 <template #header>
-                    <div class="hac-card-title text-black">年度各项目支出对比</div>
+                    <div class="hac-card-title text-black">
+                        年度各项目支出对比
+                    </div>
                 </template>
                 <template #extra>
-                    <HcDropdown :cur="planYear2" :datas="yearData" @change="planYear2Change" v-if="yearData.length > 0"/>
+                    <HcDropdown v-if="yearData.length > 0" :cur="planYear2" :datas="yearData" @change="planYear2Change" />
                 </template>
                 <div class="hc-row-echarts-box" style="height: 260px">
-                    <BarLabelRotation isMonth :datas="expendDatas" v-if="expendDatas.length > 0"/>
-                    <HcNoData v-else/>
+                    <BarLabelRotation v-if="expendDatas.length > 0" is-month :datas="expendDatas" />
+                    <HcNoData v-else />
                 </div>
             </HcCardItem>
 
@@ -147,13 +177,15 @@
                 <el-col :span="10">
                     <HcCardItem ui="hac-card-item">
                         <template #header>
-                            <div class="hac-card-title text-black">当月各部门计划安排比重</div>
+                            <div class="hac-card-title text-black">
+                                当月各部门计划安排比重
+                            </div>
                         </template>
                         <template #extra>
-                            <el-date-picker type="month" v-model="planTime" format="YYYY-MM" value-format="YYYY-MM" style="width: 130px;" @change="planTimeChange"/>
+                            <el-date-picker v-model="planTime" type="month" format="YYYY-MM" value-format="YYYY-MM" style="width: 130px;" @change="planTimeChange" />
                         </template>
                         <div class="hac-card-item-body" style="height: 410px">
-                            <HcTable ui="no-border" :isIndex="false" :column="tableColumn" :datas="tableData"/>
+                            <HcTable ui="no-border" :is-index="false" :column="tableColumn" :datas="tableData" />
                         </div>
                     </HcCardItem>
                 </el-col>
@@ -162,16 +194,18 @@
                         <HcCardItem ui="hac-card-item">
                             <template #header>
                                 <div class="hac-card-icon-title">
-                                    <HcIcon name="alarm-warning" ui="text-orange text-xl"/>
+                                    <HcIcon name="alarm-warning" ui="text-orange text-xl" />
                                     <el-badge :value="tableData1.length">
                                         <span class="ml-2 mr-3 text-black">影响回款的风险计划</span>
                                     </el-badge>
                                 </div>
                             </template>
                             <div class="hac-card-item-body" style="height: 160px">
-                                <HcTable ui="no-border" :isIndex="false" :column="tableColumn1" :datas="tableData1">
-                                    <template #action="{row,index}">
-                                        <el-button plain size="small" type="primary" @click="rowViewClick(row)">查看</el-button>
+                                <HcTable ui="no-border" :is-index="false" :column="tableColumn1" :datas="tableData1">
+                                    <template #action="{ row }">
+                                        <el-button plain size="small" type="primary" @click="rowViewClick(row)">
+                                            查看
+                                        </el-button>
                                     </template>
                                 </HcTable>
                             </div>
@@ -182,28 +216,32 @@
                             <el-col :span="12">
                                 <HcCardItem ui="hac-card-item">
                                     <template #header>
-                                        <div class="hac-card-title text-black">各项目支出占比统计</div>
+                                        <div class="hac-card-title text-black">
+                                            各项目支出占比统计
+                                        </div>
                                     </template>
                                     <template #extra>
-                                        <HcDropdown :cur="planYear3" :datas="yearData" @change="planYear3Change" v-if="yearData.length > 0"/>
+                                        <HcDropdown v-if="yearData.length > 0" :cur="planYear3" :datas="yearData" @change="planYear3Change" />
                                     </template>
                                     <div class="hac-card-item-body" style="height: 160px">
-                                        <BorderRadius :datas="expendStatisticsDatas" v-if="expendStatisticsDatas.length > 0"/>
-                                        <HcStatus class="border-radius-status" v-else/>
+                                        <BorderRadius v-if="expendStatisticsDatas.length > 0" :datas="expendStatisticsDatas" />
+                                        <HcStatus v-else class="border-radius-status" />
                                     </div>
                                 </HcCardItem>
                             </el-col>
                             <el-col :span="12">
                                 <HcCardItem ui="hac-card-item">
                                     <template #header>
-                                        <div class="hac-card-title text-black">各项目收入占比统计</div>
+                                        <div class="hac-card-title text-black">
+                                            各项目收入占比统计
+                                        </div>
                                     </template>
                                     <template #extra>
-                                        <HcDropdown :cur="planYear4" :datas="yearData" @change="planYear4Change" v-if="yearData.length > 0"/>
+                                        <HcDropdown v-if="yearData.length > 0" :cur="planYear4" :datas="yearData" @change="planYear4Change" />
                                     </template>
                                     <div class="hac-card-item-body" style="height: 160px">
-                                        <SimpleChart :datas="incomeStatisticsDatas" v-if="incomeStatisticsDatas.length > 0"/>
-                                        <HcStatus class="simple-chart-status" v-else/>
+                                        <SimpleChart v-if="incomeStatisticsDatas.length > 0" :datas="incomeStatisticsDatas" />
+                                        <HcStatus v-else class="simple-chart-status" />
                                     </div>
                                 </HcCardItem>
                             </el-col>
@@ -214,24 +252,27 @@
 
             <HcCardItem ui="hac-card-item mt-4">
                 <template #header>
-                    <div class="hac-card-title text-black">项目服务阶段进程</div>
+                    <div class="hac-card-title text-black">
+                        项目服务阶段进程
+                    </div>
                 </template>
                 <template #extra>
-                    <el-select v-model="portalProjectId" @change="portalProjectIdChange" v-if="projectData.length > 0">
-                        <el-option v-for="items in projectData" :label="items.projectName" :value="items.projectId"/>
+                    <el-select v-if="projectData.length > 0" v-model="portalProjectId" @change="portalProjectIdChange">
+                        <el-option v-for="items in projectData" :key="items.projectId" :label="items.projectName" :value="items.projectId" />
                     </el-select>
                 </template>
                 <div class="hc-row-echarts-box pt-5 mb-1">
                     <template v-for="(item, index) in projectProcessData" v-if="projectProcessData.length > 0">
-                        <ProgressChart :leftTitle="index===0?'计划执行进度':''"
-                                       :rightTitle="index===0?'已支出成本':''"
-                                       :title="item.processName"
-                                       :leftRatio="item.processProgressBar"
-                                       :rightRatio="item.processCostProgressBar"
-                                       :rightText="item.processCostCount"
+                        <ProgressChart
+                            :left-title="index === 0 ? '计划执行进度' : ''"
+                            :right-title="index === 0 ? '已支出成本' : ''"
+                            :title="item.processName"
+                            :left-ratio="item.processProgressBar"
+                            :right-ratio="item.processCostProgressBar"
+                            :right-text="item.processCostCount"
                         />
                     </template>
-                    <HcStatus class="project-process-status" v-else/>
+                    <HcStatus v-else class="project-process-status" />
                 </div>
             </HcCardItem>
         </div>
@@ -239,28 +280,30 @@
 </template>
 
 <script setup>
-import {onActivated, onMounted, ref} from "vue";
-import QImg from "~src/assets/images/q.png";
-import HeImg from "~src/assets/images/he.png";
-import ShouImg from "~src/assets/images/shou.png";
-import ZhiImg from "~src/assets/images/zhi.png";
-import Zhi1Img from "~src/assets/images/zhi1.png";
-import BarLabelRotation from "~com/echarts/BarLabelRotation.vue";
-import BorderRadius from "~com/echarts/BorderRadius.vue";
-import SimpleChart from "~com/echarts/SimpleChart.vue";
-import ProgressChart from "~com/echarts/ProgressChart.vue";
-import mainApi from "~api/home/index";
-import {getProjectList} from "~api/other";
+import { onActivated, onMounted, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import QImg from '~src/assets/images/q.png'
+import HeImg from '~src/assets/images/he.png'
+import ShouImg from '~src/assets/images/shou.png'
+import ZhiImg from '~src/assets/images/zhi.png'
+import Zhi1Img from '~src/assets/images/zhi1.png'
+import BarLabelRotation from '~com/echarts/BarLabelRotation.vue'
+import BorderRadius from '~com/echarts/BorderRadius.vue'
+import SimpleChart from '~com/echarts/SimpleChart.vue'
+import ProgressChart from '~com/echarts/ProgressChart.vue'
+import mainApi from '~api/home/index'
+import { getProjectList } from '~api/other'
 
 //时间类
-import dayjs from "dayjs"
+import dayjs from 'dayjs'
 import 'dayjs/locale/zh-cn'
-import {getArrValue, getObjValue} from "js-fast-way";
+import { getArrValue, getObjValue } from 'js-fast-way'
 dayjs.locale('zh-cn')
-
+//初始组合式
+const router = useRouter()
 //年份
-const planYear = dayjs().format('YYYY') + '年';
-const planDate = dayjs().format('YYYY-MM');
+const planYear = dayjs().format('YYYY') + '年'
+const planDate = dayjs().format('YYYY-MM')
 
 //页面首次渲染完成时
 onMounted(async () => {
@@ -290,7 +333,7 @@ const getYearDataApi = () => {
 //项目类型
 const planAnnualTarget = ref({})
 const getPlanAnnualTarget = async () => {
-    const {error, code, data} = await mainApi.portalAnnualTarget()
+    const { error, code, data } = await mainApi.portalAnnualTarget()
     //判断状态
     if (!error && code === 200) {
         planAnnualTarget.value = getObjValue(data)
@@ -300,9 +343,9 @@ const getPlanAnnualTarget = async () => {
 }
 
 //获取年度列表
-const yearData = ref([]);
+const yearData = ref([])
 const getYearList = async () => {
-    const {error, code, data} = await mainApi.yearList()
+    const { error, code, data } = await mainApi.yearList()
     //判断状态
     if (!error && code === 200) {
         const arr = getArrValue(data)
@@ -320,7 +363,7 @@ const getYearList = async () => {
             yearContractMoney: 0,
             yearReturned: 0,
             yearStaffDisburse: 0,
-            totalBudget: 0
+            totalBudget: 0,
         }
     }
 }
@@ -334,11 +377,11 @@ const planYear1Change = (val) => {
 
 //获取数据
 const annualCostData = ref({
-    yearContractMoney: 0, yearReturned: 0, yearStaffDisburse: 0, totalBudget: 0
+    yearContractMoney: 0, yearReturned: 0, yearStaffDisburse: 0, totalBudget: 0,
 })
 const getPortalAnnualCost = async () => {
-    const {error, code, data} = await mainApi.portalAnnualCost({
-        year: planYear1.value
+    const { error, code, data } = await mainApi.portalAnnualCost({
+        year: planYear1.value,
     })
     //判断状态
     if (!error && code === 200) {
@@ -348,7 +391,7 @@ const getPortalAnnualCost = async () => {
             yearContractMoney: 0,
             yearReturned: 0,
             yearStaffDisburse: 0,
-            totalBudget: 0
+            totalBudget: 0,
         }
     }
 }
@@ -364,8 +407,8 @@ const planYear2Change = (val) => {
 const expendDatas = ref([])
 const getExpendDatas = async () => {
     expendDatas.value = []
-    const {error, code, data} = await mainApi.portalAnnualProjectCost({
-        year: planYear2.value
+    const { error, code, data } = await mainApi.portalAnnualProjectCost({
+        year: planYear2.value,
     })
     //判断状态
     if (!error && code === 200) {
@@ -381,16 +424,16 @@ const planTimeChange = () => {
     getTableData()
 }
 const tableColumn = [
-    {key: 'projectName', name: '项目名称'},
-    {key: 'businessRatio', name: '实施投入', align: 'center'},
-    {key: 'devRatio', name: '研发投入', align: 'center'},
-    {key: 'maintainRatio', name: '维护投入', align: 'center'}
+    { key: 'projectName', name: '项目名称' },
+    { key: 'businessRatio', name: '实施投入', align: 'center' },
+    { key: 'devRatio', name: '研发投入', align: 'center' },
+    { key: 'maintainRatio', name: '维护投入', align: 'center' },
 ]
 const tableData = ref([])
 const getTableData = async () => {
     tableData.value = []
-    const {error, code, data} = await mainApi.portalDeptMonthPlanRatio({
-        date: planTime.value
+    const { error, code, data } = await mainApi.portalDeptMonthPlanRatio({
+        date: planTime.value,
     })
     //判断状态
     if (!error && code === 200) {
@@ -403,15 +446,15 @@ const getTableData = async () => {
 
 //影响回款的风险计划
 const tableColumn1 = [
-    {key: 'projectName', name: '项目名称'},
-    {key: 'costTypeValue', name: '风险部门', align: 'center'},
-    {key: 'timeOutPlanTotal', name: '延期计划条数', align: 'center'},
-    {key: 'action', name: '操作', align: 'center'},
+    { key: 'projectName', name: '项目名称' },
+    { key: 'costTypeValue', name: '风险部门', align: 'center' },
+    { key: 'timeOutPlanTotal', name: '延期计划条数', align: 'center' },
+    { key: 'action', name: '操作', align: 'center' },
 ]
 const tableData1 = ref([])
 const getTableData1 = async () => {
     tableData1.value = []
-    const {error, code, data} = await mainApi.portalRiskPlan()
+    const { error, code, data } = await mainApi.portalRiskPlan()
     //判断状态
     if (!error && code === 200) {
         tableData1.value = getArrValue(data)
@@ -421,7 +464,7 @@ const getTableData1 = async () => {
 }
 //查看
 const rowViewClick = (row) => {
-
+    router.push({ name: 'program-section' })
 }
 
 
@@ -434,7 +477,7 @@ const planYear3Change = (val) => {
 const expendStatisticsDatas = ref([])
 const getExpendStatisticsData = async () => {
     expendStatisticsDatas.value = []
-    const {error, code, data} = await mainApi.portalProjectCostRatio(planYear3.value)
+    const { error, code, data } = await mainApi.portalProjectCostRatio(planYear3.value)
     //判断状态
     if (!error && code === 200) {
         const arr = getArrValue(data)
@@ -459,11 +502,11 @@ const incomeStatisticsDatas = ref([
     { value: 1048, name: '奉建路' },
     { value: 735, name: '西环线' },
     { value: 580, name: '陈油路' },
-    { value: 484, name: '宝北路' }
+    { value: 484, name: '宝北路' },
 ])
 const getIncomeStatisticsData = async () => {
     incomeStatisticsDatas.value = []
-    const {error, code, data} = await mainApi.portalProjectIncomeRatio(planYear4.value)
+    const { error, code, data } = await mainApi.portalProjectIncomeRatio(planYear4.value)
     //判断状态
     if (!error && code === 200) {
         const arr = getArrValue(data)
@@ -481,7 +524,7 @@ const getIncomeStatisticsData = async () => {
 const portalProjectId = ref('')
 const projectData = ref([])
 const getProjectData = async () => {
-    const {error, code, data} = await getProjectList()
+    const { error, code, data } = await getProjectList()
     //判断状态
     if (!error && code === 200) {
         const arr = getArrValue(data)
@@ -502,7 +545,7 @@ const portalProjectIdChange = () => {
 const projectProcessData = ref([])
 const getPortalProjectProcess = async () => {
     projectProcessData.value = []
-    const {error, code, data} = await mainApi.portalProjectProcess(portalProjectId.value)
+    const { error, code, data } = await mainApi.portalProjectProcess(portalProjectId.value)
     //判断状态
     if (!error && code === 200) {
         projectProcessData.value = getArrValue(data)