add 权限

src/views/home/condition.vue

@@ -2,7 +2,7 @@
   <div class="condition">
     <div class="selct" style="display: inline-block">
       <!-- <span style="margin-right:15px"></span> -->
-      <Select
+      <Select v-if="!cameraType"
         v-model:value="type"
         style="width: 100px; margin-right: 15px"
         placeholder="请选择类型"
@@ -43,6 +43,7 @@ const props = defineProps({
   timeType: String,
   name:Object,
   selectTimeType:Number,
+  cameraType:Boolean,
 });
 
 type RangeValue = [Dayjs, Dayjs];

src/views/home/faultType.vue

@@ -110,7 +110,7 @@ function handlesetOptions() {
           //图形样式
           normal: {
             borderColor: '#ffffff',
-            borderWidth: 6,
+            borderWidth: 4,
           },
         },
         label: {

src/views/home/lineEcharts.vue

@@ -1,119 +1,143 @@
 <template>
   <Card :title="title" :loading="loading">
     <template #extra>
-      <condition @change="Search"  @expor="handleExport" />
+      <condition @change="Search" :cameraType="true" @expor="handleExport" />
     </template>
-      <div ref="chartRef" :style="{ height:'280px', width:'100%' }"></div>
+    <div ref="chartRef" :style="{ height: '280px', width: '100%' }"></div>
   </Card>
 </template>
 <script lang="ts" setup>
-  import { Card } from 'ant-design-vue';
-  import { ref, Ref, watch, onMounted, reactive } from 'vue';
-  import { volumeTrend } from '/@/api/home/index';
-  import condition from './condition.vue';
-  import dayjs from 'dayjs';
-  import { useECharts } from '/@/hooks/web/useECharts';
-  import { exportElsxFile, } from '/@/utils/file/download';
-  const props = defineProps({
+import { Card } from 'ant-design-vue';
+import { ref, Ref, watch, onMounted, reactive } from 'vue';
+import { volumeTrend } from '/@/api/home/index';
+import condition from './condition.vue';
+import dayjs from 'dayjs';
+import { useECharts } from '/@/hooks/web/useECharts';
+import { exportElsxFile } from '/@/utils/file/download';
+import { useI18n } from '/@/hooks/web/useI18n';
+const props = defineProps({
   loading: Boolean,
   title: String,
+});
+const { t } = useI18n();
+let SearchData = reactive({
+  startTime: dayjs().subtract(6, 'month').format('YYYY-MM-DD'),
+  endTime: dayjs().format('YYYY-MM-DD'),
+  type: '2',
+  cameraType: '0',
+});
+const viewStaticsData = ref({
+  kjList: [],
+  kkList: [],
+  ssList: [],
+});
+const shareStaticsData = ref<number[]>([]);
+const yixStringData = ref<string[]>([]);
+const maxSize = ref(0);
+const chartRef = ref<HTMLDivElement | null>(null);
+const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
+onMounted(() => {
+  getAddUser();
+});
+function handleChange(val) {
+  console.log('handleChange', val);
+  SearchData = val;
+  getAddUser();
+}
+function Search(val) {
+  SearchData = val;
+  getAddUser();
+}
+function handleExport() {
+  console.log('props', props.title);
+  let fields = {
+    time: '日期',
+    num: '数量',
+  };
+  let data = yixStringData.value.map((ele, index) => {
+    return {
+      time: ele,
+      num: (viewStaticsData.value && viewStaticsData.value[index]) || 0,
+    };
   });
-  let SearchData = reactive({
-    startTime: dayjs().subtract(6,'month').format('YYYY-MM-DD'),
-    endTime: dayjs().format('YYYY-MM-DD'),
-    type: '2',
-    cameraType: '0',
-  });
-  const viewStaticsData = ref<number[]>([]);
-  const shareStaticsData = ref<number[]>([]);
-  const yixStringData = ref<string[]>([]);
-  const maxSize = ref(0);
-  const chartRef = ref<HTMLDivElement | null>(null);
-  const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
-  onMounted(() => {
-    getAddUser();
+  exportElsxFile(data, fields, props.title);
+}
+async function getAddUser() {
+  let xdata = [],
+  kj = [],
+  kk = [],
+  ss = [];
+  let apiSrc = volumeTrend;
+  let { kjList = [], kkList = [], ssList = [], } = await apiSrc(SearchData);
+  kjList.map((ele) => {
+    xdata.unshift(ele.groupKey);
+    kj.unshift(ele.count);
   });
-  function handleChange(val){
-    console.log('handleChange',val)
-    SearchData = val
-    getAddUser()
-  }
-  function Search(val) {
-    SearchData = val;
-    getAddUser();
-  }
-  function handleExport(){
-  console.log('props',props.title)
-  let fields  = {
-    'time':'日期',
-    'num':'数量',
-  }
-    let data = yixStringData.value.map((ele,index) => {
-      return {
-        'time':ele,
-        'num':viewStaticsData.value && viewStaticsData.value[index] || 0,
-      }
-    })
-    exportElsxFile(data, fields,  props.title)
+  kk = kkList.map(ele => ele.count)
+  ss = ssList.map(ele => ele.count)
+  yixStringData.value = xdata;
+  viewStaticsData.value.kjList = kj;
+  viewStaticsData.value.kkList = kk.reverse();
+  viewStaticsData.value.ssList = ss.reverse();
+  handlesetOptions();
 }
-  async function getAddUser() {
-    let xdata = [], yData=[]
-    let apiSrc = volumeTrend
-    let res = await apiSrc(SearchData);
-    const data = res.reverse()
-    data.map(ele => {
-      xdata.unshift(ele.groupKey)
-      yData.unshift(ele.count)
-    })
-    yixStringData.value = xdata
-    viewStaticsData.value = yData
-    handlesetOptions()
-  }
-  function handlesetOptions() {
-    setOptions({
-      tooltip: {
-        trigger: 'axis',
-        axisPointer: {
-          lineStyle: {
-            width: 1,
-            color: '#019680',
-          },
+function handlesetOptions() {
+  setOptions({
+    tooltip: {
+      trigger: 'axis',
+      axisPointer: {
+        lineStyle: {
+          width: 1,
+          color: '#019680',
         },
       },
-      legend: {
-        orient: 'horizontal',
-        bottom: 0,
+    },
+    legend: {
+      orient: 'horizontal',
+      bottom: 0,
+    },
+    xAxis: {
+      type: 'category',
+      data: yixStringData.value,
+    },
+    yAxis: {
+      name: '数量',
+      type: 'value',
+      splitNumber: 4,
+    },
+    series: [
+      {
+        data: viewStaticsData.value.kjList,
+        type: 'line',
+        itemStyle: { color: '#38a0ff' },
+        name: t('routes.scene.tableType.0'),
       },
-      xAxis: {
-        type: 'category',
-        data: yixStringData.value,
+      {
+        data: viewStaticsData.value.kkList,
+        type: 'line',
+        itemStyle: { color: '#4cca73' },
+        name: t('routes.scene.tableType.1'),
       },
-      yAxis: {
-        name:'数量',
-        type: 'value',
-        splitNumber: 4,
+      {
+        data: viewStaticsData.value.ssList,
+        type: 'line',
+        itemStyle: { color: '#FDD56A' },
+        name: t('routes.scene.tableType.2'),
       },
-      series: [
-        {
-          data: viewStaticsData.value,
-          type: 'line',
-          itemStyle: { color: '#38a0ff' },
-          name:'数量',
-        },
-      ],
-    });
-  }
-  watch(
-    () => props.loading,
-    () => {
-      const maxNumber = Math.max(...viewStaticsData.value.concat(shareStaticsData.value));
-      const pow = Math.pow(10, maxNumber.toString().length - 1);
-      maxSize.value = maxNumber > 10 ? Math.floor(maxNumber / 10) * 10 + pow * 2 : 10;
-      handlesetOptions();
-    },
-    {
-      immediate: true,
-      deep: true,
-    },
-  );
+    ],
+  });
+}
+watch(
+  () => props.loading,
+  () => {
+    // const maxNumber = Math.max(...viewStaticsData.value.concat(shareStaticsData.value));
+    // const pow = Math.pow(10, maxNumber.toString().length - 1);
+    // maxSize.value = maxNumber > 10 ? Math.floor(maxNumber / 10) * 10 + pow * 2 : 10;
+    handlesetOptions();
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+);
 </script>