瓦斯巡检提交新版本

src/views/vent/gas/gasAnalysis/components/echartBox.vue

@@ -35,7 +35,7 @@ let props = defineProps({
     },
     maxY: {
         type: String,
-        default: '10'
+        default: '100'
     },
     datazoomShow: {
         type: Boolean,

src/views/vent/gas/gasAnalysis/gasAnalysis.data.ts

@@ -43,7 +43,7 @@ export const columns: BasicColumn[] = [
         align: 'center',
     },
     {
-        title: '漏检率',
+        title: '漏检率(%)',
         dataIndex: 'ljv',
         key: 'ljv',
         align: 'center',
@@ -52,16 +52,17 @@ export const columns: BasicColumn[] = [
         title: '漏检详情',
         dataIndex: 'ljxq',
         key: 'ljxq',
+        width:250,
         align: 'center',
     },
     {
-        title: '班总漏检率',
+        title: '班总漏检率(%)',
         dataIndex: 'bzljv',
         key: 'bzljv',
         align: 'center',
     },
     {
-        title: '日总漏检率',
+        title: '日总漏检率(%)',
         dataIndex: 'totalLossDay',
         key: 'totalLossDay',
         align: 'center',

src/views/vent/gas/gasAnalysis/index.vue

@@ -24,43 +24,70 @@
                     size="small" :data-source="tableData" :scroll="{ y: 470 }" class="tableW" :pagination="pagination">
                     <template #bodyCell="{ column, text }">
                         <template v-if="column.dataIndex == 'bc'">
-                            <div>夜班</div>
-                            <div style="padding: 32px 0px;">早班</div>
-                            <div>中班</div>
+                            <div :style="contentStyle">夜班</div>
+                            <div :style="contentStyle">早班</div>
+                            <div :style="contentStyle">中班</div>
                         </template>
                         <template v-if="column.dataIndex == 'insType'">
-                            <div>
+                            <div :style="contentStyle1">
                                 <div>一次巡检</div>
                                 <div>二次巡检</div>
                             </div>
-                            <div style="padding: 10px 0px;">
+                            <div :style="contentStyle1">
                                 <div>一次巡检</div>
                                 <div>二次巡检</div>
                             </div>
-                            <div>
+                            <div :style="contentStyle1">
                                 <div>一次巡检</div>
                                 <div>二次巡检</div>
                             </div>
                         </template>
                         <template
-                            v-if="column.dataIndex == 'xjzs' || column.dataIndex == 'yxjs' || column.dataIndex == 'wxjs' || column.dataIndex == 'ljv' || column.dataIndex == 'ljxq'">
-                            <div>
+                            v-if="column.dataIndex == 'xjzs' || column.dataIndex == 'yxjs' || column.dataIndex == 'wxjs' || column.dataIndex == 'ljv'">
+                            <div :style="contentStyle1">
                                 <div>{{ text[0] }}</div>
                                 <div>{{ text[1] }}</div>
                             </div>
-                            <div style="padding: 10px 0px;">
+                            <div :style="contentStyle1">
                                 <div>{{ text[2] }}</div>
                                 <div>{{ text[3] }}</div>
                             </div>
-                            <div>
+                            <div :style="contentStyle1">
                                 <div>{{ text[4] }}</div>
                                 <div>{{ text[5] }}</div>
                             </div>
                         </template>
+                        <template
+                            v-if="column.dataIndex == 'ljxq'">
+                            <div :style="contentStyle1">
+                                <div>
+                                    <div v-for="(item,index) in text[0]" :key="index">{{ item.address }}</div>
+                                </div>
+                                <div>
+                                    <div v-for="(item,index) in text[1]" :key="index">{{ item.address }}</div>
+                                </div>
+                            </div>
+                            <div :style="contentStyle1">
+                                <div>
+                                    <div v-for="(item,index) in text[2]" :key="index">{{ item.address }}</div>
+                                </div>
+                                <div>
+                                    <div v-for="(item,index) in text[3]" :key="index">{{ item.address }}</div>
+                                </div>
+                            </div>
+                            <div :style="contentStyle1">
+                                <div>
+                                    <div v-for="(item,index) in text[4]" :key="index">{{ item.address }}</div>
+                                </div>
+                                <div>
+                                    <div v-for="(item,index) in text[5]" :key="index">{{ item.address }}</div>
+                                </div>
+                            </div>
+                        </template>
                         <template v-if="column.dataIndex == 'bzljv'">
-                            <div>{{ text[0] }}</div>
-                            <div style="padding: 32px 0px;">{{ text[1] }}</div>
-                            <div>{{ text[2] }}</div>
+                            <div :style="contentStyle">{{ text[0] }}</div>
+                            <div :style="contentStyle">{{ text[1] }}</div>
+                            <div :style="contentStyle">{{ text[2] }}</div>
                         </template>
                     </template>
                 </a-table>
@@ -124,6 +151,14 @@ let legendData1 = reactive({
 let xData1 = ref<any[]>([])
 let yDataL = ref<any[]>([])
 let typeV = ref('line')
+let styleNum=ref<any>(0)
+
+let contentStyle=computed(()=>{
+    return {height:`${styleNum.value*8.5}px`,width:'100%',display:'flex','align-items':'center','justify-content':'center'}
+})
+let contentStyle1=computed(()=>{
+    return {height:`${styleNum.value*8.5}px`,display:'flex','flex-direction':'column', 'align-items':'center','justify-content':'space-around'}
+})
 //table选中数据切换
 let onSelectChange = (selectedRowKeys, selectedRows) => {
     console.log(`当前选中key: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
@@ -136,12 +171,6 @@ let onSelectChange = (selectedRowKeys, selectedRows) => {
 async function gasReportLogLists() {
     let res = await gasReportLogList({ reportTime: searchTime.value, pageNo: pagination.current, pageSize: pagination.pageSize })
     console.log(res, '瓦斯巡检统计分析列表')
-    // res.records=[
-    //   {id:1,aaa:111,reportTime:'2024-12-30',totalLossDay:10,totalNight1:1,totalNight2:2,totalEarly1:3,totalEarly2:4,totalNoon1:5,totalNoon2:6,finishNight1:'11',finishNight2:'22',finishEarly1:'33',finishEarly2:'44',finishNoon1:'55',finishNoon2:'66',missNight1:'111',missNight2:'222',missEarly1:'333',missEarly2:'444',missNoon1:'555',missNoon2:'666',lossNight1:'1111',lossNight2:'2222',lossEarly1:'3333',lossEarly2:'4444',lossNoon1:'5555',lossNoon2:'6666',detailsLossNight1:'11111',detailsLossNight2:'22222',detailsLossEarly1:'33333',detailsLossEarly2:'44444',detailsLossNoon1:'55555',detailsLossNoon2:'66666'},
-    //   {id:2,aaa:111,reportTime:'2024-12-29',totalLossDay:8,totalNight1:1,totalNight2:2,totalEarly1:3,totalEarly2:4,totalNoon1:5,totalNoon2:6,finishNight1:'11',finishNight2:'22',finishEarly1:'33',finishEarly2:'44',finishNoon1:'55',finishNoon2:'66',missNight1:'111',missNight2:'222',missEarly1:'333',missEarly2:'444',missNoon1:'555',missNoon2:'666',lossNight1:'1111',lossNight2:'2222',lossEarly1:'3333',lossEarly2:'4444',lossNoon1:'5555',lossNoon2:'6666',detailsLossNight1:'11111',detailsLossNight2:'22222',detailsLossEarly1:'33333',detailsLossEarly2:'44444',detailsLossNoon1:'55555',detailsLossNoon2:'66666'},
-    //   {id:3,aaa:111,reportTime:'2024-12-28',totalLossDay:6,totalNight1:1,totalNight2:2,totalEarly1:3,totalEarly2:4,totalNoon1:5,totalNoon2:6,finishNight1:'11',finishNight2:'22',finishEarly1:'33',finishEarly2:'44',finishNoon1:'55',finishNoon2:'66',missNight1:'111',missNight2:'222',missEarly1:'333',missEarly2:'444',missNoon1:'555',missNoon2:'666',lossNight1:'1111',lossNight2:'2222',lossEarly1:'3333',lossEarly2:'4444',lossNoon1:'5555',lossNoon2:'6666',detailsLossNight1:'11111',detailsLossNight2:'22222',detailsLossEarly1:'33333',detailsLossEarly2:'44444',detailsLossNoon1:'55555',detailsLossNoon2:'66666'}
-    //     ]
-    //     console.log(res,'89898089')
     if ( res.records.length != 0) {
         pagination.current = 1
         tableData.value = res.records.map(el => {
@@ -152,8 +181,10 @@ async function gasReportLogLists() {
             el.yxjs = [el.finishNight1 || 0, el.finishNight2 || 0, el.finishEarly1 || 0, el.finishEarly2 || 0, el.finishNoon1 || 0, el.finishNoon2 || 0]
             el.wxjs = [el.missNight1 || 0, el.missNight2 || 0, el.missEarly1 || 0, el.missEarly2 || 0, el.missNoon1 || 0, el.missNoon2 || 0]
             el.ljv = [el.lossNight1 || 0, el.lossNight2 || 0, el.lossEarly1 || 0, el.lossEarly2 || 0, el.lossNoon1 || 0, el.lossNoon2 || 0]
-            el.ljxq = [el.detailsLossNight1 || 0, el.detailsLossNight2 || 0, el.detailsLossEarly1 || 0, el.detailsLossEarly2 || 0, el.detailsLossNoon1 || 0, el.detailsLossNoon2 || 0]
+            el.ljxq = [JSON.parse(el.detailsLossNight1) ,  JSON.parse(el.detailsLossNight2),  JSON.parse(el.detailsLossEarly1), JSON.parse(el.detailsLossEarly2 ), JSON.parse(el.detailsLossNoon1),  JSON.parse(el.detailsLossNoon2)]
             el.bzljv = [el.totalLossNight || 0, el.totalLossEarly || 0, el.totalLossNoon || 0]
+            console.log(el.ljxq,'090')
+            styleNum.value=[...JSON.parse(el.detailsLossNight1) ,  ...JSON.parse(el.detailsLossNight2),  ...JSON.parse(el.detailsLossEarly1), ...JSON.parse(el.detailsLossEarly2 ), ...JSON.parse(el.detailsLossNoon1),  ...JSON.parse(el.detailsLossNoon2)].length
             return el
         })
         pagination.total = res.total

src/views/vent/gas/gasReportInspect/comment/common/Icon/index.vue

@@ -0,0 +1,12 @@
+<template>
+  <svg aria-hidden="true">
+    <use :xlink:href="name" />
+  </svg>
+</template>
+<script setup lang="ts">
+  import { computed } from 'vue';
+  const props = defineProps<{
+    iconName: string;
+  }>();
+  const name = computed(() => `#${props.iconName}`);
+</script>

src/views/vent/gas/gasReportInspect/comment/common/Icon/treeIcon.vue

@@ -0,0 +1,42 @@
+<template>
+  <icon class="iconfont" :iconName="iconNam" />
+</template>
+<script setup lang="ts">
+  import icon from './index.vue';
+  import { computed } from 'vue';
+  const type = {
+    file: 'icon-document',
+    // js: 'icon-javascript',
+    // json: 'icon-json',
+    // vue: 'icon-vue',
+    // scss: 'icon-sass',
+    // file: 'icon-file',
+    // md: 'icon-mdx',
+    // tsx: 'icon-react1',
+    // ts: 'icon-typescript',
+    // css: 'icon-css',
+    // png: 'icon-image',
+    // jpg: 'icon-image',
+    // jpeg: 'icon-image',
+    // webp: 'icon-image',
+    // gif: 'icon-image',
+    // html: 'icon-html',
+    // babelrc: 'icon-babel',
+  };
+  const props = defineProps({
+    title: String,
+  });
+  const iconNam = computed(() => {
+    // const suffix = (props.title || '.file').split('.').pop().toLowerCase();
+    // console.log(suffix, 'suffix');
+    // if (props.title == 'package.json') return 'icon-npm';
+    // return type[suffix];
+    return type['file'];
+  });
+</script>
+<style lang="less" scoped>
+  .iconfont {
+    width: 16px;
+    height: 16px;
+  }
+</style>

src/views/vent/gas/gasReportInspect/comment/common/cameraTree.vue

@@ -0,0 +1,63 @@
+<template>
+  <treeList
+    v-for="model in list"
+    v-bind="$attrs"
+    :model="model"
+    :key="model.id"
+    @detail-node="onDetail"
+  >
+    <template #icon="slotProps">
+      <slot name="icon" v-bind="slotProps"></slot>
+    </template>
+    <template #operation="slotProps">
+      <slot name="operation" v-bind="slotProps"></slot>
+    </template>
+  </treeList>
+</template>
+<script setup lang="ts">
+  import { ref } from 'vue';
+  import treeList from './treeList.vue';
+  const emit = defineEmits([ 'detailNode']);
+  interface IFileSystem {
+    id: string;
+    title: string;
+    pid: string;
+    isFolder: boolean;
+    isAdd: boolean;
+    children?: IFileSystem[];
+  }
+  const props = withDefaults(
+    defineProps<{
+      list: IFileSystem[];
+    }>(),
+    {}
+  );
+  // 递归寻找父组件
+  function findParent(pid, Tree) {
+    let targetNode = null;
+    function find(item, flattenTree) {
+      flattenTree.find((ele) => {
+        if (ele.id == pid) {
+          targetNode = ele;
+          return true;
+        } else {
+          if (ele.children) {
+            find(pid, ele.children);
+          }
+        }
+      });
+    }
+    find(pid, Tree);
+    return targetNode.children;
+  }
+  // 删除
+  const onDetail = (node) => {
+    emit('detailNode', {
+      ...node,
+      eventType: 'detail',
+    });
+  };
+ 
+  
+</script>
+<style scoped></style>

src/views/vent/gas/gasReportInspect/comment/common/tempUpload.vue

@@ -0,0 +1,137 @@
+<template>
+    <div class="tempUpload">
+        <a-modal v-model:visible="visibleUpload" centered :width="600" title="报表或模板上传" @ok="handleUploadOk"
+            @cancel="handleUploadCancel">
+            <a-form :model="uploadForm" :label-col="{ style: { width: '130px' } }" :wrapper-col="{ span: 16 }">
+                <a-form-item label="文件名称:">
+                    <a-input v-model:value="uploadForm.fileName" placeholder="请输入文件名称..." />
+                </a-form-item>
+                <a-form-item label="业务种类:">
+                    <JDictSelectTag v-model:value="uploadForm.busKind" placeholder="请选择业务种类..." dictCode="reportBusKind"
+                        @change="changeKind" />
+                </a-form-item>
+                <a-form-item label="报表类型:">
+                    <JDictSelectTag v-if="kindType == 'ventSReport'" v-model:value="uploadForm.reportType"
+                        placeholder="请选择报表类型..." dictCode="ventSReport" />
+                    <JDictSelectTag v-if="kindType == 'fireSReport'" v-model:value="uploadForm.reportType"
+                        placeholder="请选择报表类型..." dictCode="fireSReport" />
+                    <JDictSelectTag v-if="kindType == 'dustSReport'" v-model:value="uploadForm.reportType"
+                        placeholder="请选择报表类型..." dictCode="dustSReport" />
+                    <JDictSelectTag v-if="kindType == 'gasSReport'" v-model:value="uploadForm.reportType"
+                        placeholder="请选择报表类型..." dictCode="gasSReport" />
+                </a-form-item>
+                <a-form-item label="模式类型:">
+                    <a-radio-group v-model:value="uploadForm.modelType" name="radioGroup">
+                        <a-radio v-for="item in radioList" :value="item.value">{{ item.label }}</a-radio>
+                    </a-radio-group>
+                </a-form-item>
+                <a-form-item label="文件上传">
+                    <a-upload :before-upload="beforeUpload" @remove="handleRemove" :multiple="false"
+                        :file-list="fileList">
+                        <a-button type="primary" preIcon="ant-design:cloud-upload-outlined">选择文件</a-button>
+                    </a-upload>
+                </a-form-item>
+            </a-form>
+        </a-modal>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, watch } from 'vue'
+import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
+import { getUpload } from '../../gasReportInspect.api'
+import { useMessage } from '/@/hooks/web/useMessage';
+
+let props = defineProps({
+    visibleUp: {
+        type: Number,
+        default: 0
+    }
+})
+
+let visibleUpload = ref(false)
+let uploadForm = reactive({
+    fileName: '',
+    busKind: '',
+    modelType: '',
+    reportType: '',
+})
+//模式类型数据
+let radioList = ref<any[]>([
+    { label: '自动生成', value: 0 },
+    { label: '手动填写', value: 1 },
+    { label: '模板', value: 2 },
+])
+let kindType = ref('ventSReport')
+let fileList = reactive<any[]>([]); //上传文件列表
+const { createMessage } = useMessage();
+let emit = defineEmits(['resetUpload'])
+
+//确认上传
+async function handleUploadOk() {
+    const formData = new FormData();
+    formData.append('file', fileList[0]);
+    formData.append('fileName', uploadForm.fileName);
+    formData.append('busKind', uploadForm.busKind);
+    formData.append('modelType', uploadForm.modelType);
+    formData.append('reportType', uploadForm.reportType);
+    let res = await getUpload(formData)
+    if (res) {
+        visibleUpload.value = false
+        emit('resetUpload')
+    }
+}
+//取消上传
+function handleUploadCancel() {
+    visibleUpload.value = false
+    uploadForm.modelType = ''
+    uploadForm.fileName = ''
+    uploadForm.reportType = ''
+    uploadForm.busKind = ''
+}
+//业务种类下拉选项切换
+function changeKind(val) {
+    kindType.value = `${val}Report`
+}
+//上传文件
+let beforeUpload = (file) => {
+    fileList.length = 0;
+    let index = file.name.indexOf('.');
+    let name = file.name.substring(index + 1);
+    if (name == 'png' || name == 'jpg' || name == 'gif' || name == 'psd' || name == 'webp') {
+        createMessage.warning('禁止上传图片类型的文件!');
+    } else {
+        fileList.push(file);
+    }
+};
+// 文件移除
+let handleRemove = (file) => {
+    const index = fileList.indexOf(file);
+    const newFileList = fileList.slice();
+    newFileList.splice(index, 1);
+    fileList.length = 0;
+};
+
+watch(() => props.visibleUp, (newV, oldV) => {
+    fileList.length = 0
+    visibleUpload.value = !visibleUpload.value
+})
+</script>
+
+<style lang="less" scoped>
+.tempUpload {
+    position: relative;
+    width: 100%;
+    height: 100%;
+
+}
+
+.zxm-form {
+    padding-top: 20px !important;
+    box-sizing: border-box
+}
+
+:deep(.zxm-upload-list-item-name) {
+    color: #fff !important;
+}
+</style>

src/views/vent/gas/gasReportInspect/comment/common/treeList.vue

@@ -0,0 +1,191 @@
+<template>
+  <div class="vtl-node" :id="model.id" :class="{ 'vtl-leaf-node': !isFolder, 'vtl-tree-node': isFolder }">
+    <div :class="treeNodeClass" @mouseover="mouseOver" @mouseout="mouseOut" @click.stop="toggle">
+      <div class="vtl-border-text">
+        <template v-if="isFolder">
+          <slot v-if="isexpanded" :item="{ title: model.title, isFolder: true, isexpanded: true }" name="icon"> </slot>
+          <slot v-else :item="{ title: model.title, isFolder: true, isexpanded: false }" name="icon"></slot>
+        </template>
+        <slot v-else :item="{ title: model.title, isFolder: false }" name="icon"></slot>
+        <span class="vtl-node-content ellipsis">
+          {{ model.title }}
+        </span>
+      </div>
+      <div class="vtl-operation" v-show="isHover && !isFolder">
+        <span @click.stop.prevent="delNode">
+          <slot name="operation" type="detailNode"></slot>
+        </span>
+      </div>
+    </div>
+  </div>
+  <div class="vtl-tree-margin" v-show="isexpanded">
+    <!-- 这里无法使用$attr来透传属性官方还未解决此bug -->
+    <treeList
+      @on-click="(depth) => $emit('onClick', depth)"
+      @detail-node="(depth) => $emit('detailNode', depth)"
+      v-for="newmodel in model.children"
+      :selected="selected"
+      :model="newmodel"
+      :key="newmodel.id"
+    >
+      <template #icon="slotProps">
+        <slot name="icon" v-bind="slotProps"></slot>
+      </template>
+      <template #operation="slotProps">
+        <slot name="operation" v-bind="slotProps"></slot>
+      </template>
+    </treeList>
+  </div>
+</template>
+<script setup lang="ts">
+  import { computed, ref } from 'vue';
+  interface IFileSystem {
+    id: string;
+    title: string;
+    pid: string;
+    ppid: string;
+    isFolder: boolean;
+    isexpanded: boolean;
+    isAdd: boolean;
+    children?: IFileSystem[];
+  }
+  // 吐出去的事件
+  const emit = defineEmits(['onClick', 'detailNode']);
+  // 拿到传入的值
+  const props = withDefaults(
+    defineProps<{
+      model: IFileSystem;
+      selected: IFileSystem;
+    }>(),
+    {
+      // draggable: false,
+    }
+  );
+  //是否移入
+  const isHover = ref(false);
+  // 是否是文件夹
+  const isFolder = computed(() => {
+    return props.model.isFolder;
+  });
+  //是否展开
+  const isexpanded = computed(() => {
+    return props.model.isexpanded;
+  });
+  const isSelected = computed(() => {
+    if (props.model.pid == '0' || props.model.pid == '1' || props.model.pid == '2') {
+      return props.selected.id === props.model.id && props.selected.pid === props.model.pid;
+    } else if (props.model.ppid == '0' || props.model.ppid == '1' || props.model.ppid == '2') {
+      return props.selected.id === props.model.id && props.selected.ppid === props.model.ppid;
+    } else {
+      return props.selected.id === props.model.id;
+    }
+  });
+
+  // 拖拽样式
+  const treeNodeClass = computed(() => {
+    return {
+      'vtl-node-main': true,
+      selected: isSelected.value,
+    };
+  });
+
+  // 删除目录
+  const delNode = () => {
+    emit('detailNode', {
+      ...props.model,
+      eventType: 'detail',
+    });
+  };
+
+  // 展开收起
+  const toggle = () => {
+    if (isFolder.value) {
+      console.log(props.model, 'props.model---------');
+      props.model.isexpanded = !props.model.isexpanded;
+      emit('onClick', {
+        ...props.model,
+      }); //lxh
+    } else {
+      console.log(props.model, 'props.model---------');
+      emit('onClick', {
+        ...props.model,
+      });
+    }
+  };
+  // 拖拽结束
+  const mouseOver = () => {
+    isHover.value = true;
+  };
+  // 移出
+  const mouseOut = () => {
+    isHover.value = false;
+  };
+</script>
+<style lang="less">
+  @import '/@/design/theme.less';
+
+  @{theme-deepblue} {
+    .vtl-node {
+      --node-select-bg: #3f506a;
+    }
+  }
+
+  .vtl-node {
+    --node-select-bg: #1c4869;
+    .vtl-node-main {
+      display: flex;
+      align-items: center;
+      padding: 2px 0 2px 2px;
+      cursor: pointer;
+
+      &:hover {
+        .vtl-border-text {
+          width: 80%;
+        }
+      }
+
+      .vtl-border-text {
+        display: flex; //lxh
+        flex: 1;
+        align-items: center; //lxh
+        width: 100%;
+        padding-left: 5px;
+
+        .iconfont {
+          width: 16px;
+          height: 16px;
+          vertical-align: text-bottom;
+        }
+      }
+
+      &.selected {
+        // background-color: rgba(45, 113, 134, 0.2);
+        background-color: var(--node-select-bg);
+      }
+
+      .vtl-node-content {
+        color: #fff;
+        padding-left: 5px;
+        font-size: 14px;
+        width: 80%;
+        display: inline-block;
+        vertical-align: bottom;
+      }
+
+      &:hover {
+        .vtl-node-content {
+          color: #fff;
+          overflow: hidden;
+        }
+      }
+
+      .vtl-operation {
+        padding-right: 10px;
+      }
+    }
+  }
+
+  .vtl-tree-margin {
+    padding-left: 1em;
+  }
+</style>

src/views/vent/gas/gasReportInspect/gasReportInspect.api.ts

@@ -0,0 +1,13 @@
+import { defHttp } from '/@/utils/http/axios';
+
+enum Api {
+queryReportData='/safety/reportLocalData/queryReportData'
+}
+
+
+/**
+ * 树列表
+ * @param params
+ */
+export const queryReportData = (params) => defHttp.post({ url: Api.queryReportData,params },);
+

src/views/vent/gas/gasReportInspect/gasReportInspect.data.ts

@@ -0,0 +1,285 @@
+import { BasicColumn } from '/@/components/Table';
+export const columnsGas1: BasicColumn[] = [
+    {
+        title: '序号',
+        width: 60,
+        align: 'center',
+        customRender: ({ index }: { index: number }) => `${index + 1}`
+    },
+    {
+        title: '监测地点',
+        dataIndex: 'jcdd',
+        key: 'jcdd',
+        width:180,
+        align: 'center',
+    },
+    {
+        title: '夜班',
+        children: [
+            {
+                title: 'CH₄‌(%)',
+                dataIndex: 'ch4Night',
+                key: 'ch4Night',
+                align: 'center',
+            },
+            {
+                title: 'CO₂‌(%)',
+                dataIndex: 'co2Night',
+                key: 'co2Night',
+                align: 'center',
+            },
+            {
+                title: 'CO(ppm)',
+                dataIndex: 'coNight',
+                key: 'coNight',
+                align: 'center',
+            },
+            {
+                title: 'O₂‌(%)',
+                dataIndex: 'o2Night',
+                key: 'o2Night',
+                align: 'center',
+            },
+            {
+                title: 'T(°C)',
+                dataIndex: 'tNight',
+                key: 'tNight',
+                align: 'center',
+            },
+        ]
+    },
+    {
+        title: '早班',
+        children: [
+            {
+                title: 'CH₄‌(%)',
+                dataIndex: 'ch4Early',
+                key: 'ch4Early',
+                align: 'center',
+            },
+            {
+                title: 'CO₂‌(%)',
+                dataIndex: 'co2Early',
+                key: 'co2Early',
+                align: 'center',
+            },
+            {
+                title: 'CO(ppm)',
+                dataIndex: 'coEarly',
+                key: 'coEarly',
+                align: 'center',
+            },
+            {
+                title: 'O₂‌(%)',
+                dataIndex: 'o2Early',
+                key: 'o2Early',
+                align: 'center',
+            },
+            {
+                title: 'T(°C)',
+                dataIndex: 'tEarly',
+                key: 'tEarly',
+                align: 'center',
+            },
+        ]
+
+    },
+    {
+        title: '中班',
+        children: [
+            {
+                title: 'CH₄‌(%)',
+                dataIndex: 'ch4Noon',
+                key: 'ch4Noon',
+                align: 'center',
+            },
+            {
+                title: 'CO₂‌(%)',
+                dataIndex: 'co2Noon',
+                key: 'co2Noon',
+                align: 'center',
+            },
+            {
+                title: 'CO(ppm)',
+                dataIndex: 'coNoon',
+                key: 'coNoon',
+                align: 'center',
+            },
+            {
+                title: 'O₂‌(%)',
+                dataIndex: 'o2Noon',
+                key: 'o2Noon',
+                align: 'center',
+            },
+            {
+                title: 'T(°C)',
+                dataIndex: 'tNoon',
+                key: 'tNoon',
+                align: 'center',
+            },
+        ]
+
+    },
+    
+];
+
+export const columnsGas2: BasicColumn[] = [
+    {
+        title: '序号',
+        width: 60,
+        align: 'center',
+        customRender: ({ index }: { index: number }) => `${index + 1}`
+    },
+    {
+        title: '监测地点',
+        dataIndex: 'jcdd',
+        key: 'jcdd',
+        width:130,
+        align: 'center',
+    },
+    {
+        title: '煤层',
+        dataIndex: 'mc',
+        width:80,
+        key: 'mc',
+        align: 'center',
+    },
+    {
+        title: '夜班',
+        children: [
+            {
+                title: 'CH₄‌(%)',
+                dataIndex: 'ch4Night',
+                key: 'ch4Night',
+                align: 'center',
+            },
+            {
+                title: 'CO₂‌(%)',
+                dataIndex: 'co2Night',
+                key: 'co2Night',
+                align: 'center',
+            },
+            {
+                title: 'CO(ppm)',
+                dataIndex: 'coNight',
+                key: 'coNight',
+                width:80,
+                align: 'center',
+            },
+            {
+                title: 'O₂‌(%)',
+                dataIndex: 'o2Night',
+                key: 'o2Night',
+                align: 'center',
+            },
+            {
+                title: 'T(°C)',
+                dataIndex: 'tNight',
+                key: 'tNight',
+                align: 'center',
+            },
+            {
+                title: '巡检员',
+                dataIndex: 'checkPersonNight',
+                key: 'checkPersonNight',
+                align: 'center',
+            },
+        ]
+    },
+    {
+        title: '早班',
+        children: [
+            {
+                title: 'CH₄‌(%)',
+                dataIndex: 'ch4Early',
+                key: 'ch4Early',
+                align: 'center',
+            },
+            {
+                title: 'CO₂‌(%)',
+                dataIndex: 'co2Early',
+                key: 'co2Early',
+                align: 'center',
+            },
+            {
+                title: 'CO(ppm)',
+                dataIndex: 'coEarly',
+                key: 'coEarly',
+                width:80,
+                align: 'center',
+            },
+            {
+                title: 'O₂‌(%)',
+                dataIndex: 'o2Early',
+                key: 'o2Early',
+                align: 'center',
+            },
+            {
+                title: 'T(°C)',
+                dataIndex: 'tEarly',
+                key: 'tEarly',
+                align: 'center',
+            },
+            {
+                title: '巡检员',
+                dataIndex: 'checkPersonEarly',
+                key: 'checkPersonEarly',
+                align: 'center',
+            },
+        ]
+
+    },
+    {
+        title: '中班',
+        children: [
+            {
+                title: 'CH₄‌(%)',
+                dataIndex: 'ch4Noon',
+                key: 'ch4Noon',
+                align: 'center',
+            },
+            {
+                title: 'CO₂‌(%)',
+                dataIndex: 'co2Noon',
+                key: 'co2Noon',
+                align: 'center',
+            },
+            {
+                title: 'CO(ppm)',
+                dataIndex: 'coNoon',
+                key: 'coNoon',
+                width:80,
+                align: 'center',
+            },
+            {
+                title: 'O₂‌(%)',
+                dataIndex: 'o2Noon',
+                key: 'o2Noon',
+                align: 'center',
+            },
+            {
+                title: 'T(°C)',
+                dataIndex: 'tNoon',
+                key: 'tNoon',
+                align: 'center',
+            },
+            {
+                title: '巡检员',
+                dataIndex: 'checkPersonNoon',
+                key: 'checkPersonNoon',
+                align: 'center',
+            },
+        ]
+
+    },
+    
+];
+//分页参数
+export const pagination = {
+    current: 1, // 当前页码
+    pageSize: 15, // 每页显示条数
+    total: 0, // 总条目数，后端返回
+    // showTotal: (total, range) => `${range[0]}-${range[1]} 条，总共 ${total} 条`, // 分页右下角显示信息
+    showSizeChanger: true, // 是否可改变每页显示条数
+    pageSizeOptions: ['10','15', '20','25', '50'], // 可选的每页显示条数
+};

src/views/vent/gas/gasReportInspect/index.vue

@@ -0,0 +1,158 @@
+<template>
+    <div class="gasReportInspect">
+        <customHeader>报表管理中心</customHeader>
+        <div class="content">
+            <div class="left-box">
+                <!-- 左侧树菜单 -->
+                <div class="card-toggle">
+                    <div class="card-item" @click="handlerToggle('gasDay1')">一次巡检</div>
+                    <div class="card-item" @click="handlerToggle('gasDay2')">二次巡检</div>
+                </div>
+                <fileSystem :selected="selected" :list="listArr" :draggable="true" @on-click="onClick">
+                    <template #icon="{ item }">
+                        <template v-if="item.isFolder">
+                            <SvgIcon v-if="item.isexpanded" size="18" name="file-open" />
+                            <SvgIcon v-else size="18" name="file-close" />
+                        </template>
+                        <treeIcon class="iconfont" :title="item.title" v-else />
+                    </template>
+                </fileSystem>
+            </div>
+            <div class="right-box">
+                <a-table :columns="columnsType" size="small" :data-source="tableData" :scroll="{ y: 700 }"
+                    class="tableW" :pagination="pagination"></a-table>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ref, nextTick, reactive, onMounted } from 'vue';
+import customHeader from '/@/components/vent/customHeader.vue';
+import fileSystem from './comment/common/cameraTree.vue';
+import { SvgIcon } from '/@/components/Icon';
+import treeIcon from './comment/common/Icon/treeIcon.vue';
+import { columnsGas1,columnsGas2, pagination } from './gasReportInspect.data';
+import { queryReportData } from './gasReportInspect.api';
+
+
+let gasType = ref('gasDay1')
+//左侧菜单列表
+let listArr = reactive<any[]>([]);
+//lxh 当前选中树节点
+let selected = reactive<any>({
+    id: null,
+    pid: null,
+    title: '',
+    isFolder: false,
+});
+let tableData = ref<any[]>([])
+let columnsType = ref<any[]>(columnsGas1)
+let handlerToggle = (param) => {
+    gasType.value = param
+    pagination.current = 1
+    switch (gasType.value) {
+        case 'gasDay1':
+            columnsType.value = columnsGas1
+            getTreeList()
+            break;
+        case 'gasDay2':
+            columnsType.value=columnsGas2
+            getTreeList()
+            break;
+    }
+}
+//获取左侧菜单树
+async function getTreeList() {
+    listArr.length = 0
+    const res = await queryReportData({ type: gasType.value })
+    if (res) {
+        listArr.push({
+            id: res.id,
+            pid: null,
+            title: res.fileName,
+            isFolder: true,
+        })
+        tableData.value = JSON.parse(res.content)
+        pagination.total = Math.ceil(tableData.value.length / pagination.pageSize)
+    }
+}
+//点击目录
+function onClick(node) {
+    selected.id = node.id;
+    selected.pid = node.pid;
+    selected.title = node.title;
+    selected.isFolder = node.isFolder;
+    selected.ppid = node.ppid
+};
+
+onMounted(() => {
+    getTreeList()
+})
+</script>
+
+<style lang="less" scoped>
+.gasReportInspect {
+    width: calc(100% - 20px);
+    height: calc(100% - 90px);
+    position: relative;
+    margin: 35px 10px 10px 10px;
+
+    .content {
+        width: 100%;
+        height: calc(100% - 30px);
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        align-items: flex-start;
+        position: relative;
+
+        // z-index: 999;
+        .left-box {
+            width: 15%;
+            height: 100%;
+            padding: 20px;
+            border: 1px solid #99e8ff66;
+            background: #27546e1a;
+            box-shadow: 0px 0px 20px 7px rgba(145, 233, 254, 0.7) inset;
+            -moz-box-shadow: 0px 0px 20px 7px rgba(145, 233, 254, 0.7) inset;
+            -webkit-box-shadow: 0px 0px 50px 1px rgb(149 235 255 / 5%) inset;
+            overflow-y: auto;
+
+            .card-toggle {
+                height: 30px;
+                display: flex;
+                justify-content: space-between;
+                align-items: center;
+                margin-bottom: 10px;
+                color: #fff;
+
+                .card-item {
+                    width: calc(50% - 5px);
+                    height: 100%;
+                    display: flex;
+                    justify-content: center;
+                    align-items: center;
+                    background: #1a5b7f;
+                    border-radius: 5px;
+                    cursor: pointer;
+                }
+            }
+
+            // lxh
+            .iconfont {
+                color: #fff;
+                font-size: 12px;
+                margin-left: 5px;
+            }
+        }
+
+        .right-box {
+            width: 85%;
+            height: 100%;
+            padding: 0px 0px 0px 15px;
+            box-sizing: border-box;
+        }
+    }
+}
+</style>

src/views/vent/performance/comment/NormalTable.vue

@@ -14,8 +14,7 @@
         <a-popconfirm title="确定删除?" @confirm="handleDelete(record)">
           <a class="table-action-link">删除</a>
         </a-popconfirm>
-        <a class="table-action-link" @click="handlerSg(record)">束管分析</a>
-        <a class="table-action-link" @click="handlerSpy(record)">色谱仪分析</a>
+        <a class="table-action-link" @click="handlerJc(nodeParam.id)">{{ nodeParam.id=='1600000000000000001' ? '粉尘报表分析' : nodeParam.id=='1500000000000000002' ? '束管报表分析' : nodeParam.id=='1500000000000000003' ? '束管色谱仪分析'  : nodeParam.id=='1400000000000000003' || nodeParam.id=='1400000000000000002' ? '瓦斯日报巡检分析' : ''   }}</a>
       </template>
 
       <template #bodyCell="{ column, record }">
@@ -364,13 +363,31 @@
       navigator.msSaveBlob(blob, fileName);
     }
   }
-  //束管分析
-  function handlerSg(record){
-    router.push('/bundle/bundleTable')
+ 
+ //报表监测跳转
+ function handlerJc(data){
+  switch(data){
+    case '1600000000000000001':
+      //粉尘报表
+      router.push('/dust/dustMonitorTable')
+      break;
+      case '1500000000000000002':
+        //束管日报
+        router.push('/bundle/bundleTable')
+      break;
+      case '1500000000000000003':
+        //束管色谱仪
+        router.push('/bundleSpy/bundleSpyTable')
+      break;
+      case '1400000000000000002':
+        //瓦斯日报巡检分析
+        router.push('/gas/gas-report-inspect')
+      break;
+      case '1400000000000000003':
+        //瓦斯日报巡检分析
+        router.push('/gas/gas-report-inspect')
+      break;
   }
-  //色谱仪分析
- function handlerSpy(record){
-  router.push('/bundleSpy/bundleSpyTable')
  }
   // CAD预览相关的逻辑
   const [registerCADModal, { openModal: openCADModal }] = useModal();