南昌市物联网技防平台-前端
zengh
2023-01-16 8aa3edd56c279100c9053576f3e90fa55459fe77
src/views/healthcode/healthcode.vue
@@ -8,6 +8,8 @@
               :before-open="beforeOpen"
               v-model="form"
               ref="crud"
               :row-style="rowStyle"
               :search.sync="search"
               @row-update="rowUpdate"
               @row-save="rowSave"
               @row-del="rowDel"
@@ -18,15 +20,42 @@
               @size-change="sizeChange"
               @refresh-change="refreshChange"
               @on-load="onLoad">
      <template slot="menuLeft">
        <el-button type="danger"
                   size="small"
                   icon="el-icon-delete"
                   plain
                   v-if="true"
                   @click="handleDelete">删 除
        </el-button>
      </template>
        <template slot="menuLeft">
          <el-button
            v-bind:class="activeClass == 0 ? 'btn-color' : ''"
            size="small "
            @click="getHealthcodeData(0)"
            >本日
          </el-button>
          <el-button
            v-bind:class="activeClass == 1 ? 'btn-color' : ''"
            size="small "
            @click="getHealthcodeData(1)"
            >本周
          </el-button>
          <el-button
            v-bind:class="activeClass == 2 ? 'btn-color' : ''"
            size="small "
            @click="getHealthcodeData(2)"
            >本月
          </el-button>
        </template>
        <template slot="menuLeft">
          <el-button type="warning"
                      size="small"
                      plain
                      icon="el-icon-download"
                      @click="handleExport">导出
          </el-button>
          <el-button type="warning"
                      size="small"
                      plain
                      icon="el-icon-pie-chart"
                      @click="handleExportStatis">导出报表
          </el-button>
        </template>
    </avue-crud>
  </basic-container>
</template>
@@ -40,7 +69,9 @@
      return {
        form: {},
        query: {},
        search:{},
        loading: true,
        activeClass: 0,
        page: {
          pageSize: 10,
          currentPage: 1,
@@ -48,12 +79,14 @@
        },
        selectionList: [],
        option: {
          menu:false,
          height:'auto',
          calcHeight: 30,
          calcHeight: 54,
          border: false,
          stripe:true,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          viewBtn: true,
          selection: true,
@@ -75,26 +108,11 @@
            },
            {
              label: "检测时间",
              prop: "createTime"
              prop: "dtime"
            },
            {
              label: "体温",
              prop: "tempRed"
            },
            {
              label: '图片',
              prop: 'picture',
              type: 'upload',
              width: 300,
              listType: 'picture-img',
              span: 24,
              propsHttp: {
                res: 'data'
              },
              canvasOption: {
                text: 'avue',
                ratio: 0.1
              }
              label: '性别',
              prop: 'sex'
            },
            {
              label: "检测时间",
@@ -103,6 +121,7 @@
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
              searchRange: true,
              searchValue:[this.getStartTime(),this.getEndTime()],
              searchSpan: 5,
              hide: true,
              addDisplay: false,
@@ -118,38 +137,87 @@
              ]
            },
            {
              label: "体温状态",
              label: '省份',
              prop: 'province',
              //search: true,
              searchSpan: 3,
              type: 'select',
              props: {
                label: 'name',
                value: 'name'
              },
              cascaderItem: ['city', 'district'],
              dicUrl: '/api/blade-system/region/select',
              span: 6,
            },
            {
              label: '地市',
              prop: 'city',
              type: 'select',
              searchSpan: 3,
              //search: true,
              props: {
                label: 'name',
                value: 'name'
              },
              dicUrl: '/api/blade-system/region/select?code={{key}}',
              span: 6,
            },
            {
              label: '区县',
              searchSpan: 3,
              //search: true,
              prop: 'district',
              type: 'select',
              props: {
                label: 'name',
                value: 'name'
              },
              dicUrl: '/api/blade-system/region/select?code={{key}}',
              span: 6,
            },
            {
              label: "健康码颜色",
              search: true,
              searchLabelWidth: 120,
              prop: "status",
              searchSpan: 5,
              width:110,
              searchLabelWidth:120,
              prop: "type",
              searchSpan: 4,
              searchValue: this.getHealthcodeType(),
              width:210,
              type: "select",
              dicData: [
                {
                  label: "正常",
                  value: 0
                  label: "绿色",
                  value: "1"
                },
                {
                  label: "异常",
                  value: 1
                  label: "黄色",
                  value: "2"
                },
                {
                  label: "红色",
                  value: "3"
                }
              ],
            }
          ]
        },
        data: []
        data: [],
        isActive: false,
        recorder: null,
      };
    },
    mounted(){
    },
    computed: {
      ...mapGetters(["permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(null, true),
          viewBtn: this.vaildData(null, true),
          delBtn: this.vaildData(null, true),
          editBtn: this.vaildData(null, true)
          addBtn: this.vaildData(null, false),
          viewBtn: this.vaildData(null, false),
          delBtn: this.vaildData(null, false),
          editBtn: this.vaildData(null, false)
        };
      },
      ids() {
@@ -164,10 +232,16 @@
      beforeOpen(done, type) {
      },
      searchReset() {
        //清空搜索框中的内容
        this.query = {};
        //清空this.$route.query
        this.$router.push({ query: {} });
        this.activeClass=0;
        this.onLoad(this.page);
      },
      searchChange(params, done) {
        //清空this.$route.query
        this.$router.push({ query: {} });
        this.query = params;
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
@@ -189,19 +263,217 @@
      refreshChange() {
        this.onLoad(this.page, this.query);
      },
      onLoad(page, params = {}) {
      rowStyle({row, column, rowIndex}){
         if(row.type=="3"){
           return {
             color:"#fe1515"
           }
         }
      },
      getStartTime(){
           if (this.$route.query.startTime != undefined && this.$route.query.startTime != null && this.$route.query.startTime != "" ) {
             return this.$route.query.startTime
           }
           // 当前时间
          var date = new Date();
          //年
          var Y = date.getFullYear();
          //月
          var M = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
          //日
          var D = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
           return Y + "-" + M + "-" + D;
      },
      getEndTime(){
           if (this.$route.query.endTime != undefined && this.$route.query.endTime != null && this.$route.query.endTime != "" ) {
             return this.$route.query.endTime
           }
            // 当前时间
            var date = new Date();
            //年
            var Y = date.getFullYear();
            //月
            var M = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
            //日
            var D = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
            return Y + "-" + M + "-" + D;
      },
      getHealthcodeType(){
          if (this.$route.query.type != undefined) {
              var type = this.$route.query.type+"";
              //this.$route.query = {};
              return type;
          }
      },
      getHealthcodeData(e) {
        var that = this;
        this.query={};
        this.$router.push({ query: {} });
        that.activeClass = e;
        //status 0:本日  1:本月  2:本年   type: 1:绿色   2:黄色  3:红色
        var today = new Date();
        var params ={};
        if(e==0){
          //修改搜索框中的值
          this.search.releaseTimeRange=[this.showToDay(today)+" 00:00:00",this.showToDay(today)+" 23:59:59"]
        }
        if(e==1){
          //修改搜索框中的值
          this.search.releaseTimeRange=[this.showWeekFirstDay(today)+" 00:00:00",this.showToDay(today)+" 23:59:59"]
        }
        if(e==2){
          //修改搜索框中的值
          this.search.releaseTimeRange=[this.showMonthFirstDay(today)+" 00:00:00",this.showToDay(today)+" 23:59:59"]
        }
        params = {
          ... params,
          status: e
        };
        if(this.search.type){
          params = {
            ... params,
            type: this.search.type
          };
        }
        this.query=params;
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
      },
      //本日
      showToDay(Nowdate){
        var M=Number(Nowdate.getMonth())+1;
        if(M<10){
          M="0"+M;
        }
        var day = Nowdate.getDate();
        if(day<10){
          day = "0"+day;
        }
        return Nowdate.getFullYear()+"-"+M+"-"+day;
      },
      //本周第一天
      showWeekFirstDay(Nowdate){
        var WeekFirstDay=new Date(Nowdate-(Nowdate.getDay()-1)*86400000);
        var M=Number(WeekFirstDay.getMonth())+1;
        if(M<10){
          M="0"+M;
        }
        var day = WeekFirstDay.getDate();
        if(day<10){
          day = "0"+day;
        }
        return WeekFirstDay.getFullYear()+"-"+M+"-"+day;
      },
      //本月第一天
      showMonthFirstDay(Nowdate){
        var MonthFirstDay=new Date(Nowdate.getFullYear(),Nowdate.getMonth(),1);
        var M=Number(MonthFirstDay.getMonth())+1;
        if(M<10){
          M="0"+M;
        }
        return MonthFirstDay.getFullYear()+"-"+M+"-"+"0"+MonthFirstDay.getDate();
      },
      //数据导出
      handleExport() {
        this.$confirm("是否导出健康码数据?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          window.open(`/api/blade-jfpts/healthcode/healthcode/export-healthcode?begTime=${this.$route.query.startTime}&endTime=${this.$route.query.endTime}&type=${this.$route.query.type}&timeDesc=${this.$route.query.timeDesc}`);
        });
      },
      //数据报表导出
      handleExportStatis() {
          let begTime = this.$route.query.startTime==undefined? '':this.$route.query.startTime;
          let endTime = this.$route.query.endTime==undefined? '':this.$route.query.endTime;
          let type = this.$route.query.type==undefined? '':this.$route.query.type;
          let timeDesc = this.$route.query.timeDesc==undefined? '':this.$route.query.timeDesc;
          //window.open(`http://localhost:8108/ureport/excel?_u=blade-healthcode.statis.xml.ureport.xml&begTime=${begTime}&endTime=${endTime}&type=${type}&timeDesc=${timeDesc}`);
          window.open(`https://web.byisf.com/api/blade-report/ureport/preview?_u=blade-healthcode.statis.xml.ureport.xml&begTime=${begTime}&endTime=${endTime}&type=${type}&timeDesc=${timeDesc}`);
      },
      onLoad(page, params={}) {
        const { dateTime } = this.query;
        let values = {
          ...params,
        };
        if (this.$route.query.status!=undefined && this.$route.query != undefined && this.$route.query != null && this.$route.query != "" ) {
            if (this.$route.query.type != undefined) {
              this.page.currentPage = 1;
              params = {
                status:this.$route.query.status,
                type:this.$route.query.type
              }
            } else {
              this.page.currentPage = 1;
              params = {
                type:this.$route.query.status
              };
            }
            this.activeClass =4;
        }else if(this.$route.query.type != undefined){
          params = {
            type: this.$route.query.type,
            begTime: this.$route.query.startTime,
            endTime: this.$route.query.endTime
          }
          this.activeClass =4;
        }
        // else{
        //   params = {
        //       status:this.$route.query.status,
        //       type:this.$route.query.type
        //   }
        // }
        if(this.activeClass == 0 && this.query.dateTime==null){
          params = {
              status:this.activeClass,
          }
        }
        if (dateTime) {
          this.activeClass =4;
          values = {
            ...params,
            begTime: dateTime[0],
            endTime: dateTime[1],
            ...this.query,
          };
          values.dateTime = null;
        } else {
          values = {
            ...params,
            ...this.query,
          };
        }
        if (this.$route.query.timeDesc) {
          values = {
            ...params,
            timeDesc: this.$route.query.timeDesc,
            ...this.query,
          };
        }
        this.loading = true;
        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
        getList(page.currentPage, page.pageSize,values).then(res => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;
          this.loading = false;
          this.selectionClear();
        });
      },
      handleHealthcode(row) {
        this.$router.push({ path: `/healthcode/healthcode/${row.deviceNumber}` });
      }
    }
  };
</script>
<style scoped>
  .el-button.btn-color {
    color: rgb(255, 255, 255);
    background-color: rgb(64, 158, 255);
    border-color: rgb(64, 158, 255);
  }
</style>