Browse Source

bug和优化

刘洋 1 year ago
parent
commit
1524a3a871

+ 17 - 2
src/components/common/table-loop/index.vue

@@ -12,6 +12,7 @@
       </div>
     </div>
     <swiper
+      v-if="hasData"
       :key="swiperKey"
       :style="{ height: 36 * rowNum + 'px', width: swiperWidth + 'px' }"
       :modules="modules"
@@ -60,11 +61,12 @@
         </div>
       </swiper-slide>
     </swiper>
+    <div v-else class="none-data">暂无数据</div>
   </div>
 </template>
 
 <script setup name="TableLoop">
-import { ref, onMounted, computed } from 'vue';
+import { ref, onMounted, computed, watch } from 'vue';
 import { Navigation, Mousewheel, Autoplay } from 'swiper';
 import { Swiper, SwiperSlide } from 'vue-awesome-swiper';
 import 'swiper/css';
@@ -88,7 +90,12 @@ onMounted(() => {
   }
   swiperWidth.value = w;
 });
-
+const hasData = computed(() => {
+  return !!props.data?.length;
+});
+watch(hasData, () => {
+  swiperKey.value = Date.now() + '';
+});
 onMounted(() => {
   tbodyHeight.value = tableLoop.value.offsetHeight - 46;
   setTimeout(() => {
@@ -106,6 +113,14 @@ const rowClick = (item) => {
 .table-loop {
   height: 100%;
   overflow: auto;
+  .none-data {
+    height: calc(100% - 36px);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    color: #ccc;
+    font-size: 14px;
+  }
   .thead {
     height: 36px;
     font-size: 12px;

+ 33 - 6
src/components/global/chart/index.vue

@@ -1,12 +1,14 @@
 <template>
   <v-charts
-    v-if="renderChart"
+    v-if="renderChart && hasData"
     :option="options"
     :autoresize="autoresize"
     :style="{ width, height }"
     @click="handleClick"
     @zr:click="handleZrClick"
+    :key="key"
   />
+  <div v-else class="none-data">暂无数据</div>
   <t-dialog
     :visible="visible"
     header=""
@@ -28,12 +30,12 @@
 </template>
 
 <script setup>
-import { ref, computed, nextTick } from 'vue';
+import { ref, computed, nextTick, watch } from 'vue';
 import VCharts from 'vue-echarts';
 import { useAppStore } from '@/store';
 const visible = ref(false);
 const emits = defineEmits(['chartClick']);
-
+const key = ref(new Date().getTime() + '');
 const props = defineProps({
   options: {
     type: Object,
@@ -56,9 +58,24 @@ const props = defineProps({
 });
 
 const appStore = useAppStore();
+const hasData = computed(() => {
+  let IS_PIE = props.options?.series?.find((item) => item.type === 'pie');
+  let pieHasData = IS_PIE?.data?.length;
+  let IS_RADAR = props.options?.series?.find((item) => item.type === 'radar');
+  let hasRadarData = IS_RADAR?.data?.length;
+  let IS_NORMAL = props.options?.customType === 'NORMAL';
+  let hasNormalData = props.options?.series?.length;
 
-const mode = computed(() => {
-  return appStore.mode === 'dark' ? 'dark' : 'auto';
+  return IS_PIE
+    ? pieHasData
+    : IS_RADAR
+    ? hasRadarData
+    : IS_NORMAL
+    ? hasNormalData
+    : true;
+});
+watch(hasData, () => {
+  key.value = new Date().getTime() + '';
 });
 
 const renderChart = ref(false);
@@ -87,4 +104,14 @@ defineExpose({
 });
 </script>
 
-<style scoped lang="less"></style>
+<style scoped lang="less">
+.none-data {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #ccc;
+  font-size: 14px;
+}
+</style>

+ 20 - 15
src/utils/chart.js

@@ -55,6 +55,7 @@ export const colorList = [
 export const createStackingBarOption = ({ xData, seriesData }, extend = {}) => {
   return mergeParams(
     {
+      customType: 'NORMAL',
       tooltip: {
         trigger: 'axis',
         axisPointer: {
@@ -152,6 +153,7 @@ export const createStackingBarOption = ({ xData, seriesData }, extend = {}) => {
 export const createBarOption = ({ xData, seriesData }, extend = {}) => {
   return mergeParams(
     {
+      customType: 'NORMAL',
       tooltip: {
         trigger: 'axis',
         axisPointer: {
@@ -244,6 +246,7 @@ export const createRingPieOption = (
   const total = getTotal(data);
   return mergeParams(
     {
+      customType: 'NORMAL',
       tooltip: {
         trigger: 'item',
       },
@@ -507,6 +510,7 @@ export const createPercentBarOption = (
   }
   return mergeParams(
     {
+      customType: 'NORMAL',
       tooltip: {
         trigger: 'axis',
         axisPointer: {
@@ -616,6 +620,7 @@ export const createPercentBarOption = (
 export const createLineOption = ({ sData = [], xData = [] }, extend = {}) => {
   return mergeParams(
     {
+      customType: 'NORMAL',
       grid: {
         top: 50,
         bottom: 15,
@@ -661,15 +666,18 @@ export const createLineOption = ({ sData = [], xData = [] }, extend = {}) => {
 };
 
 // 雷达图
-export const createRadarOption = ({ names, sData }, extend = {}) => {
+export const createRadarOption = ({ names, sData = [] }, extend = {}) => {
   return mergeParams(
     {
       color: colorList,
+      tooltip: {
+        show: true,
+      },
       legend: {
         data: sData.map((item) => item.name),
-        bottom: 10,
-        itemWidth: 8,
-        itemHeight: 8,
+        bottom: 0,
+        itemWidth: 10,
+        itemHeight: 10,
         textStyle: {
           color: '#595959',
           fontSize: 12,
@@ -677,9 +685,7 @@ export const createRadarOption = ({ names, sData }, extend = {}) => {
       },
       radar: {
         radius: '65%',
-        indicator: names.map((item) => {
-          return { name: item };
-        }),
+        indicator: names.map((item) => ({ name: item })),
         axisName: {
           color: '#8c8c8c',
           fontSize: 10,
@@ -702,14 +708,13 @@ export const createRadarOption = ({ names, sData }, extend = {}) => {
       series: [
         {
           type: 'radar',
-          data: sData,
-          itemStyle: {
-            borderWidth: 1,
-            borderColor: '#fff',
-          },
-          areaStyle: {
-            opacity: 0.35,
-          },
+          data: sData.map((item) => ({
+            value: item.data,
+            name: item.name,
+            areaStyle: {
+              opacity: 0.2,
+            },
+          })),
         },
       ],
     },

+ 29 - 16
src/views/report/quality-analysis/index.vue

@@ -152,6 +152,7 @@ import {
   qualityAnalysisInfluence,
 } from '@/api/report';
 import { FullscreenIcon } from 'tdesign-icons-vue-next';
+import { ISSUES_REASON_TYPE } from '@/config/constants';
 const chart11 = ref();
 const chart12 = ref();
 const chart21 = ref();
@@ -267,23 +268,35 @@ const overallRadarOptions = computed(() => {
   //     EXEC3: 4,
   //   },
   // };
-  let xData = Object.keys(result);
-  let names = Object.values(result)
-    ? Object.keys(Object.values(result)[0] || {})
-    : [];
-  let sData = [];
-  for (let i = 0; i < xData.length; i++) {
-    let data = [];
-    for (let j = 0; j < names.length; j++) {
-      data.push(result[xData[i]][names[j]] || 0);
-    }
-    sData.push({
-      name: xData[i] === 'all' ? '全部' : xData[i],
-      value: data,
-    });
-  }
+  // let xData = Object.keys(result);
+  // let names = Object.values(result)
+  //   ? Object.keys(Object.values(result)[0] || {})
+  //   : [];
+  // let sData = [];
+  // for (let i = 0; i < xData.length; i++) {
+  //   let data = [];
+  //   for (let j = 0; j < names.length; j++) {
+  //     data.push(result[xData[i]][names[j]] || 0);
+  //   }
+  //   sData.push({
+  //     name: xData[i] === 'all' ? '全部' : xData[i],
+  //     value: data,
+  //   });
+  // }
+
+  const sData = Object.entries(result).map((arr) => {
+    return {
+      name: arr[0],
+      data: Object.values(
+        Object.keys(ISSUES_REASON_TYPE).reduce((obj, key) => {
+          obj[key] = arr[1][key] || 0;
+          return obj;
+        }, {})
+      ),
+    };
+  });
   return createRadarOption({
-    names,
+    names: Object.values(ISSUES_REASON_TYPE),
     sData,
   });
 });

+ 15 - 5
src/views/resource-guard/person-guard/person-allocate/person-deploy-dialog.vue

@@ -42,12 +42,22 @@
         <t-col :span="12">
           <t-form-item label="人员调配" labelAlign="top">
             <div>
-              <div style="text-align: right">
-                <t-checkbox
-                  v-model="regionUseManage"
-                  @change="regionUseManageChange"
-                  >区域协调人由大区经理兼任</t-checkbox
+              <div style="text-align: right; height: 0">
+                <div
+                  style="display: inline-block; position: relative; top: -26px"
                 >
+                  <span
+                    v-if="!curRow.regionManagerId"
+                    style="vertical-align: top; font-size: 12px; color: #ff7d00"
+                    >(尚未安排大区经理,请先安排大区经理后再勾选)</span
+                  >
+                  <t-checkbox
+                    :disabled="!curRow.regionManagerId"
+                    v-model="regionUseManage"
+                    @change="regionUseManageChange"
+                    >区域协调人由大区经理兼任</t-checkbox
+                  >
+                </div>
               </div>
               <t-table
                 size="small"