jhbigscreen/src/pages/projectQuality.vue

<template>
  <div class="project-quality">
    <div class="screen-content">
      <el-row>
        <el-col :span="12" style="position: relative">
          <module-one-3-1 label="质量隐患检查" class="hide-scroll">
            <div style="position: absolute; right: 0px; top: 4px">
              <el-date-picker class="bg-date-picker" v-model="selDate" type="daterange"
                popper-class="bg-date-picker-pop" :editable="false" @change="dtChange" :picker-options="pickerOptions"
                range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
            </div>
            <div :key="'a' + elSummaryKey">
              <div class="warning-info-title" style="padding-left: 20px">
                <div :class="safeNav == 0 ? 'active' : ''" @click="doSafeNav(0, '汇总总数')">
                  汇总
                </div>
                <div :class="safeNav == 3 ? 'active' : ''" @click="doSafeNav(3, '集团总数')">
                  集团
                </div>
                <div :class="safeNav == 4 ? 'active' : ''" @click="doSafeNav(4, '子公司总数')">
                  子公司
                </div>
                <div :class="safeNav == 5 ? 'active' : ''" @click="doSafeNav(5, '甲方代表')">
                  甲方代表
                </div>
                <div :class="safeNav == 6 ? 'active' : ''" @click="doSafeNav(6, '监理单位')">
                  监理单位
                </div>
                <div :class="safeNav == 7 ? 'active' : ''" @click="doSafeNav(7, '总包单位')">
                  总包单位
                </div>
              </div>
              <project-overview-chart2 :key="'b' + safeNav" :sp="'\n'" :maintitle="fmt(summaryTotal)"
                :typedata="summary" :text="safeText" :height="230"></project-overview-chart2>
            </div>           
            <div class="proble-list" v-if="isOneProject()">                            
                <div class="my-module-title module-title" style="" >质量隐患明细</div>            
                <ProblemmodifyList ref="probList"></ProblemmodifyList>                
            </div>
            <div v-else style="padding: 0px 20px" :key="'c' + elSummaryPrjKey">
              <el-row>               
                <el-col :span="24">
                  <div class="rank-chart-title bottom-line">
                    <span style="position: relative; top: -4px">项目质量隐患占比({{ summaryPrjTotal }})</span>
                  </div>
                  <div class="idle-list problemmodify_list" style="padding-top: 20px">
                    <el-table style="width: 100%" ref="wgzp" :data="summaryPrj" height="600"
                      @row-click="doProbleRowClick" :row-style="rowStyle" class="elTable">
                      <el-table-column type="index" width="40">
                        <template slot-scope="scope">
                          <div :class="scope.$index < 3 && +scope.row.value > 0? 'idle-list-color': ''">
                            {{ scope.$index + 1 }}
                          </div>
                        </template></el-table-column>
                      <el-table-column prop="projectName" label="项目名称" width="120" class-name="text-left" :show-overflow-tooltip="true">
                      </el-table-column>
                      <el-table-column prop="prop" label="占比">
                        <template slot-scope="scope">
                          <idle-list-chart :prop="Number(scope.row.prop)" :color="scope.$index < 3 && +scope.row.id > 0? '#f05e35': '#6ab9fe'"></idle-list-chart>
                        </template>
                      </el-table-column>
                      <el-table-column prop="id" label="隐患数" width="70" align="center">
                        <template slot-scope="scope">
                          <div>{{ scope.row.id }}</div>
                        </template>
                      </el-table-column>
                      <el-table-column prop="id" label="超时隐患数" width="100" align="center">
                        <template slot-scope="scope">
                          <div>{{ scope.row.infoType }}</div>
                        </template>
                      </el-table-column>
                      <el-table-column prop="id" label="整改率">
                        <template slot-scope="scope">
                          <idle-list-chart :prop="Number(scope.row.rate)" color="#6ab9fe"></idle-list-chart>
                        </template>
                      </el-table-column>
                    </el-table>
                  </div>
                </el-col>
              </el-row>
            </div>
          </module-one-3-1>
        </el-col>
        <el-col :span="6">
          <module-one-1-1 label="材料进场取样复试" style="position: relative">
            <img v-if="prjs.length > 1" src="images/icon2001.png"
              style="position: absolute; cursor: pointer; right: 12px; top: 12px" @click="doShowCheckDetectionDlg" />
            <div class="warning-info">
              <div class="warning-info-title">
                <div :class="samplingNav == it.id ? 'active' : ''" @click="checkDetection(it.id)"
                  v-for="(it, idx) in detectionCheckType" :key="idx">
                  {{ it.text }}
                </div>
              </div>
              <div class="equipment-list-max quality-target-index">
                <el-row>
                  <el-col :span="12">
                    <div class="equipment-list-min quality-target-index-min">
                      <div class="czz-number-img czz-number-img-blue">
                        <svg class="my-svg-icon-blue" style="vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3054">
                          <path d="M530.46 269c4.64 0 9.05 2.01 12.09 5.52l109.54 126.3A16.01 16.01 0 0 1 656 411.3V893c0 8.82-7.18 16-16 16H178c-8.82 0-16-7.18-16-16V285c0-8.82 7.18-16 16-16h352.46m0-64H178c-44.18 0-80 35.82-80 80v608c0 44.18 35.82 80 80 80h462c44.18 0 80-35.82 80-80V411.3c0-19.26-6.95-37.87-19.56-52.42L590.9 232.58A80.014 80.014 0 0 0 530.46 205zM819.29 864h-45.92c-17.67 0-32-14.33-32-32s14.33-32 32-32h45.92c25.21 0 45.71-19.94 45.71-44.46V295.17c0-10.61-3.91-20.88-11.01-28.94L747.58 145.52c-8.7-9.87-21.35-15.52-34.7-15.52H370.49c-17.67 0-32-14.33-32-32s14.33-32 32-32h342.38c31.72 0 61.87 13.56 82.71 37.2L902 223.91c17.41 19.75 27 45.06 27 71.26v460.37C929 815.35 879.78 864 819.29 864zM702 468H552.09c-41.96 0-76.09-31.47-76.09-70.15V240.5h64v157.35c0 1.88 4.57 6.15 12.09 6.15H702v64zM898 326H748.09c-41.96 0-76.09-31.47-76.09-70.15V98.5h64v157.35c0 1.88 4.57 6.15 12.09 6.15H898v64zM535.13 784.5H262.88c-17.67 0-32 14.33-32 32s14.33 32 32 32h272.25c17.67 0 32-14.33 32-32s-14.33-32-32-32zM535.13 638.75H262.88c-17.67 0-32 14.33-32 32s14.33 32 32 32h272.25c17.67 0 32-14.33 32-32s-14.33-32-32-32zM535.13 493H262.88c-17.67 0-32 14.33-32 32s14.33 32 32 32h272.25c17.67 0 32-14.33 32-32s-14.33-32-32-32z"></path>
                        </svg>
                      </div>
                      <div class="equipment-list-data">
                        <p style="font-size: 12px">送检数</p>
                        <div>
                          <span>{{ chkDetection.chk1 }}</span><span style="font-size: 12px">次</span>
                        </div>
                      </div>
                    </div>
                  </el-col>
                  <el-col :span="12">
                    <div class="equipment-list-min quality-target-index-min">
                      <div class="czz-number-img czz-number-img-green">
                        <svg class="my-svg-icon-green" style="vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7849">
                          <path d="M896 64H128c-35.296 0-64 28.704-64 64v768c0 35.296 28.704 64 64 64h592a32 32 0 1 0 0-64H128V128h768v592a32 32 0 1 0 64 0V128c0-35.296-28.704-64-64-64zM791.744 746.496A206.752 206.752 0 0 0 832 624c0-114.688-93.312-208-208-208S416 509.312 416 624s93.312 208 208 208a206.752 206.752 0 0 0 122.496-40.256l110.88 110.88a31.904 31.904 0 0 0 45.248 0 31.968 31.968 0 0 0 0-45.248l-110.88-110.88zM480 624c0-79.392 64.608-144 144-144s144 64.608 144 144-64.608 144-144 144-144-64.608-144-144zM800 264a32 32 0 0 0-32-32H256a32 32 0 0 0 0 64h512a32 32 0 0 0 32-32zM256 422.656a32 32 0 0 0 0 64h96a32 32 0 0 0 0-64H256z" p-id="7850"></path>
                        </svg>
                      </div>
                      <div class="equipment-list-data">
                        <p style="font-size: 12px">待检数</p>
                        <div>
                          <span class="fgreen">{{ chkDetection.chk2 }}</span><span style="font-size: 12px">次</span>
                        </div>
                      </div>
                    </div>
                  </el-col>
                  <el-col :span="12">
                    <div class="equipment-list-min quality-target-index-min">
                      <div class="czz-number-img czz-number-img-blue">
                        <svg class="my-svg-icon-blue" style="vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10575">
                          <path d="M634.593683 354.898336h-189.279113c39.748614-30.284658 71.926063-58.676525 96.532347-87.068391 26.499076 32.177449 58.676525 60.569316 92.746766 87.068391z m30.284658 177.922366h-246.062847v81.390019H662.985549v-81.390019zM984.760041 190.225508v202.528651c0 183.600739-81.390018 355.844732-225.242144 471.304991l-187.386322 151.42329c-5.678373 5.678373-15.142329 7.571165-22.713493 7.571164s-17.03512-1.892791-24.606285-7.571164l-187.386322-151.42329C195.466141 748.598891 114.076122 576.354898 114.076122 392.754159V190.225508c0-15.142329 9.463956-30.284658 24.606285-35.963031l397.486137-151.42329c9.463956-3.785582 18.927911-3.785582 26.499076 0l397.486136 151.42329c15.142329 5.678373 24.606285 20.820702 24.606285 35.963031zM734.911612 464.680222H348.782222v240.384473h70.033272v-24.606285H662.985549v24.606285h70.033272V464.680222z m64.354899-98.425139c-92.746765-39.748614-162.780037-88.961183-210.099816-149.530499l18.927912-22.713493h-98.425139c-41.641405 62.462107-117.35305 121.138632-225.242144 177.922366 17.03512 18.927911 32.177449 39.748614 45.426987 60.569316 22.713494-13.249538 45.426987-26.499076 64.354898-39.748614v30.284658h293.382625v-28.391867c20.820702 13.249538 41.641405 24.606285 62.462107 34.07024 15.142329-18.927911 30.284658-39.748614 49.21257-62.462107z" fill="" p-id="10576"></path>
                        </svg>
                      </div>
                      <div class="equipment-list-data">
                        <p>合格数</p>
                        <div>
                          <span>{{ chkDetection.chk3 }}</span><span style="font-size: 12px">次</span>
                        </div>
                      </div>
                    </div>
                  </el-col>
                  <el-col :span="12">
                    <div class="equipment-list-min quality-target-index-min">
                      <div class="czz-number-img czz-number-img-green">
                        <svg class="my-svg-icon-green" style="vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8279">
                          <path d="M855.13728 187.4176c-105.97376 0-209.34656-36.9152-291.08736-103.936l-40.9344-33.56672-40.94976 33.56672c-81.77152 67.01568-185.15456 103.936-291.09248 103.936H126.49984V622.83264l4.95104 11.90912c67.33824 161.82784 206.54592 289.3824 372.38272 341.2224l19.08224 5.96992 19.11808-5.86752c170.07616-52.16768 305.99168-176.79872 372.92032-341.89824l4.62848-11.43808 0.08704-12.34944 0.03072-3.27168V187.4176h-64.5632z m0 419.22048l-0.03072 3.26144c-58.8544 145.21856-180.87424 258.06848-332.00128 304.44032-148.33664-46.39232-272.86528-162.24256-332.032-304.4096V252.0064c125.99296 0 241.62304-44.46208 332.032-118.56896C613.50912 207.5648 729.088 252.0064 855.13728 252.0064v354.63168z" fill="" p-id="8280"></path>
                          <path d="M400.47616 304.95232c57.68192 2.5856 87.78752 39.74656 90.368 111.5136-2.58048 70.50752-33.97632 107.0336-94.21312 109.5936-55.12192-3.85024-84.59264-40.37632-88.43776-109.5936 2.55488-71.76704 33.31584-108.928 92.28288-111.5136z m-1.92 174.96064c26.91584-1.25952 41.0112-23.07072 42.30144-65.37216-1.29024-42.29632-14.7456-64.08192-40.37632-65.37216-28.20608 0-42.29632 22.44096-42.29632 67.29216 1.25952 39.75168 14.72 60.89728 40.3712 63.45216z m207.64672-174.96064h51.91168l-219.18208 417.21856H387.0208l219.18208-417.21856z m40.37632 199.95648c57.68192 2.5856 87.78752 40.37632 90.36288 113.4336-2.58048 66.6624-33.97632 101.23776-94.208 103.82336-56.41728-3.84512-85.88288-38.45632-88.44288-103.82336 2.56-71.77216 33.32096-109.58848 92.288-113.4336z m-1.92512 176.88576c25.63072-1.25952 39.0912-23.71072 40.38144-67.29728-1.29024-41.0112-14.12096-62.16192-38.45632-63.45216-26.91584 0-41.0368 21.81632-42.30144 65.37728 1.26976 41.0368 14.72512 62.81216 40.37632 65.37216z" fill="" p-id="8281"></path>
                        </svg>
                      </div>
                      <div class="equipment-list-data">
                        <p>合格率</p>
                        <div>
                          <span class="fgreen">{{ chkDetection.percent }}</span><span style="font-size: 12px">%</span>
                        </div>
                      </div>
                    </div>
                  </el-col>
                </el-row>
              </div>
            </div>
          </module-one-1-1>
          <module-one-1-1 label="材料封样" style="position: relative">
            <img src="images/icon2001.png" v-if="prjs.length > 1"
              style="position: absolute; cursor: pointer; right: 12px; top: 12px" @click="showMaterialSealDlg" />
            <project-overview-chart :key="materialKey" :sp="'\n'" :maintitle="materialTotal"
              :legend-opt="materialLegendOpt" txtTop="12" :typedata="materialData" :text="'封样总数'" :height="260"
              gifTop="77px" style="top: 30px"></project-overview-chart>
          </module-one-1-1>
          <module-one-1-1 label="实测实量" :key="elCheck" style="position: relative">
            <img src="images/icon2001.png" v-if="prjs.length > 1"
              style="position: absolute; cursor: pointer; right: 12px; top: 12px" @click="doShowMeasuredDlg" />
            <div class="warning-info-title warning-info-title_div measured-data-list"
              style="padding-left: 12px; position: relative; z-index: 9">
              <div :class="measuredNav == it.id ? 'active' : ''" v-for="(it,idx) in measureTypes" :key="idx" @click="doMeasuredNav(it.id,it.text)">
                {{it.text.replace("工程","") }}
              </div>
            </div>
            <project-overview-chart :sp="'\n'" :maintitle="measuredTotal" :legend-opt="legendOptCheck" txtTop="12"
              :key="measuredNav" :typedata="measuredData" :text="measuredText" :height="260" gifTop="77px"
              style="top: -30px"></project-overview-chart>
          </module-one-1-1>
        </el-col>
        <el-col :span="6">
          <module-one-1-1 label="工程功能检验"  style="position: relative">            
            <funVerifyGroupByCheckType ref="funGroupByCheckType"/>
        </module-one-1-1>
          <projectChecking></projectChecking>          
        </el-col>
      </el-row>
    </div>
    <ProblemmodifyDetail ref="probDlg"></ProblemmodifyDetail>
    <showCheckingDlg ref="checkDlg"></showCheckingDlg>
    <materialSealDetialDlg ref="msDlg"></materialSealDetialDlg>
    <checkDetectionDlg ref="chkDetectionDlg"></checkDetectionDlg>
    <measuredDlg ref="measuredDlg"></measuredDlg>
    <materialSealListDlg ref="msListDlg"></materialSealListDlg>
  </div>
</template>

<script>
import "../components/module/module-one-3-1";
import "../components/project-overview-chart2";
import "../components/rank-chart";
import "../components/idle-list-chart";
import ProblemmodifyDetail from "./components/ProblemmodifyDetail.vue";
import showCheckingDlg from "./quality/showCheckingDlg.vue";
import materialSealDetialDlg from "./quality/materialSealDetialDlg.vue";
import checkDetectionDlg from "./quality/checkDetectionDlg.vue";
import measuredDlg from "./quality/measuredDlg.vue";
import materialSealChart from "./quality/materialSealChart.vue";
import materialSealListDlg from "./quality/materialSealListDlg.vue";
import projectChecking from "./quality/projectChecking.vue";
import debounce from "lodash.debounce";
import ProblemmodifyList from './components/ProblemmodifyList.vue'
import funVerifyGroupByCheckType from './quality/funVerifyGroupByCheckType.vue'
export default {
  components: {
    materialSealListDlg,
    materialSealChart,
    ProblemmodifyDetail,
    showCheckingDlg,
    materialSealDetialDlg,
    checkDetectionDlg,
    measuredDlg,
    projectChecking,ProblemmodifyList,
    funVerifyGroupByCheckType
  },
  data() {
    return {
      materialSealList: [],
      selDate: [],
      elKey: 0,
      materialSealEl: 0,
      elSummaryKey: 0,
      elSummaryPrjKey: 0,
      elCheck: 0,
      dept: null,
      projectInfo: null,
      safeNav: 0,
      safeText: "汇总总数",
      rowStyle: {
        color: "#B6CFEF",
        fontSize: "12px",
        height: "32px",
      },
      samplingNav: 0,
      measuredNav: 0,
      measuredTotal: 0,
      measuredText: "   全部",
      measuredData: [],
      //举牌验收
      acceptanceDataView: {
        sum: 0,
        okSum: 100,
      },
      //材料封样
      materialKey: 0,
      materialTotal: "0",
      materialData: [],
      acceptanceData: [],
      summary: [],
      summaryTotal: 0,
      summaryPrj: [],
      summaryPrjTotal: 0,
      chkDetection: {
        chk1: 0,
        chk2: 0,
        chk3: 0,
        percent: 100,
      },
      materialLegendOpt: {

      },
      legendOptCheck: {

      },
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      prjs: [],
      detectionCheckType: [],//材料进场取样复试分类
      measureTypes:[],//实测实量分类
    };
  },
  created() {
    this.init();
    let obj = {
      icon: "rect",
      orient: "horizontal",
      itemWidth: "50%",
      left: 240,
      right: "10%",
      itemWidth: 20,
      itemGap: 20,
      itemHeight: 20,
      textStyle: {
        padding: [0, 0, 2, 0],
        fontSize: 10,
        color: "#c3dbfd",
        rich: {
          name: {
            color: "#c3dbfd",
            padding: [5, 2, 5, 2],
          },
          percent: {
            color: "#4676FD",
            padding: [0, 2, 0, 2],
          },
        },
      },
    }
    this.legendOptCheck = { ...obj };
    this.materialLegendOpt = { ...obj };
    this.materialLegendOpt.itemWidth = 50;
    this.$api.dict("check_detection_check_type").then(d => {
      let tmps = (d || []).map(it => {
        return {
          text: it.dictLabel,
          id: +it.dictValue
        }
      });
      this.detectionCheckType = [{ text: '汇总', id: 0 }, ...tmps]
    });
    this.$api.dict("project_measure_type").then(d=>{      
      let tmps = (d || []).map(it => {
        return {
          text: it.dictLabel,
          id: +it.dictValue
        }
      });
      this.measureTypes = [{ text: '汇总', id: 0 }, ...tmps]
    });
  },
  mounted() {   
    let dt1 = this.$dt((+new Date()) - 30 * 24 * 3600 * 1000);
    let dt2 = this.$dt(new Date());
    this.selDate = [dt1, dt2];   
    this.$bus.$on("projectChange",debounce((res) => {
        this.projectInfo = res;
        this.dept = this.$root.dept ||  this.dep||{};
        this.prjs = this.$root.projects ||this.prjs|| [];      
        this.dtChange();
        this.checkDetection(0);
        this.doMeasuredNav(0, "汇总");
        this.groupByApprove();
      })
    );    
    if (this.$root.hasInitHeader) {
      this.initMe();
    }
    setTimeout(()=>{
        this.dtChange();
    },400);
  },
  methods: {
    isOneProject(){
        if(this.prjs && this.projectInfo){
            return this.prjs.length==2||this.projectInfo.id>0;
        }
        return false;
    },  
    showMaterialSealDlg() {
      this.$refs.msListDlg.showDialog({
        deptId: this.dept?.id || 0,
        projectId: this.projectInfo?.id || 0,
        data: this.materialData
      });
    },
    initMe() {
      this.projectInfo = this.$root.project || {};
      this.dept = this.$root.dept || {};
      this.prjs = this.$root.projects || [];      
      this.checkDetection(0);
      this.doMeasuredNav(0, "汇总");
      this.groupByApprove();
    },
    doShowCheckDetectionDlg() {
      this.$refs.chkDetectionDlg.showDialog({
        deptId: this.dept?.id || 0,
        projectId: this.projectInfo.id,
        checkType: this.samplingNav,
        types:this.detectionCheckType,
        data: this.chkDetection
      });
    },
    doShowMeasuredDlg() {
      this.$refs.measuredDlg.showDialog({
        deptId: this.dept?.id || 0,
        projectId: this.projectInfo.id,
        types:this.measureTypes,
        measureType: this.measuredNav,
      });
    },
    showMaterialSeal(it) {
      this.$refs.msDlg.showDialog(it);
    },
    groupByApprove() {
      let postData = {};
      postData.deptId = this.dept?.id || 0;
      postData.projectId = this.projectInfo?.id || 0;
      this.$api.materialSeal.groupByApprove(postData).then((d) => {
        this.materialTotal = "" + d.sum;
        this.materialData = d.data;
        this.materialKey++;
      });
    },
    selectTop20materialSeal() {
      let postData = {};
      postData.deptId = this.dept?.id || 0;
      postData.projectId = this.projectInfo?.id || 0;
      this.$api.materialSeal.groupTop12Month(postData).then((d) => {
        this.materialSealList = (d || []).map((it) => {
          return {
            label: (it.m < 10 ? "0" + it.m : it.m) + "\n" + (it.y + "").substring(2) + "",
            value: it.cnt,
          };
        });
        this.materialSealEl++;
      });
    },
    doShowChecking(it) {
      this.$refs.checkDlg.showDialog(it);
    },
    checkDetection(n) {
      this.samplingNav = n;
      if (!this.projectInfo) {
        return;
      }
      let postData = {
        checkType: "" + n,
      };
      postData.deptId = this.dept?.id || 0;
      postData.projectId = this.projectInfo?.id || 0;
      this.$api.checkDetection.groupByCheckType(postData).then((d) => {
        let datas = d.data || [];
        let tmps = datas.filter((it) => it.id == 1);
        this.chkDetection.chk1 = tmps.length > 0 ? tmps[0].projectId || 0 : 0;
        tmps = datas.filter((it) => it.id == 2);
        this.chkDetection.chk2 = tmps.length > 0 ? tmps[0].projectId || 0 : 0;
        tmps = datas.filter((it) => it.id == 3);
        this.chkDetection.chk3 = tmps.length > 0 ? tmps[0].projectId || 0 : 0;
        if (this.chkDetection.chk1 == 0) {
          this.chkDetection.percent = 100;
        } else {
          this.chkDetection.percent = (
            (this.chkDetection.chk3 * 100.0) /
            this.chkDetection.chk1
          ).toFixed(1);
        }
      });
    },
    doProbleRowClick(a, b, c) {
      this.$refs.probDlg.showDialog(a, 1, this.safeNav, this.selDate);
    },
    fmt(n) {
      n = "" + n;
      return "          ".substring(0, 3 - n.length) + n;
    },
    dtChange() {      
      this.doDeptChane();
    },
    doDeptChane() {
      let postData = {
        deptId: this.dept?.id || 0,
        roleType: this.safeNav,
        projectId: this.projectInfo?.id || 0,
      };
      if (this.selDate.length > 0) {
        postData.startDate = this.$dt(this.selDate[0]).format("YYYY-MM-DD");
      }
      if (this.selDate.length > 1) {
        postData.endDate = this.$dt(this.selDate[1]).format("YYYY-MM-DD");
      }
      this.$api.problemmodify.qualitySummary(postData).then((d) => {
        if(this.isOneProject() && this.$refs.probList){
          this.$refs.probList.loadData(1, this.safeNav, this.selDate);                
        }
        this.summary = (d || []).map((it) => {
          return {
            text: it.problemArea,
            prop: "0.0",
            name: it.problemArea,
            value: +it.roleType || 0,
          };
        });
        this.summaryTotal = 0;
        this.summary.forEach((it) => {
          this.summaryTotal += it.value;
        });
        this.summary.forEach((it) => {
          if (this.summaryTotal == 0) {
            it.prop = "0.0";
          } else {
            it.prop = ((it.value * 100.0) / this.summaryTotal).toFixed(1);
          }
        });
        this.elSummaryKey++;
      });

      this.$api.problemmodify.qualitySummaryByProject(postData).then((d) => {
        this.summaryPrj = (d || []).map((it) => {
          return {
            ...it,
            prop: "0.0",
            value: it.id || 0,
            rate: 0,
          };
        });
        this.summaryPrjTotal = 0;
        this.summaryPrj.forEach((it) => {
          this.summaryPrjTotal += it.value;
        });
        this.summaryPrj.forEach((it) => {
          if (this.summaryPrjTotal == 0) {
            it.prop = "0.0";
          } else {
            it.prop = ((it.value * 100.0) / this.summaryPrjTotal).toFixed(1);
          }
          it.rate = (it.value == 0 ? 0 : (it.isDel * 100.0) / it.value).toFixed(1);
        });
        this.elSummaryPrjKey++;
      });
      //this.doProjectChecking();
    },
    doMeasuredNav(n, t) {
      this.measuredNav = n;
      this.measuredText = t;
      if (!this.projectInfo) {
        return;
      }
      let postData = {
        measureType: n,
      };
      postData.deptId = this.dept?.id || 0;
      postData.projectId = this.projectInfo?.id || 0;
      this.$api.measure.groupMeasureInfo(postData).then((d) => {
        let list = [];
        if (d.data.length > 0) {
          if (n == 6) {
            d.data.forEach((item) => {
              if (item.measureInfo == "间距" || item.measureInfo == "长度") {
                list.push(item);
              }
            });
          } else if (n > 0) {
            d.data.forEach((item) => {
              if (item.measureInfo != "间距" && item.measureInfo != "长度") {
                list.push(item);
              }
            });
          } else {
            list = d.data || [];
          }
        }
        this.measuredData = list.map((it) => {
          return {
            name: it.measureInfo,
            value: it.id,
          };
        });
        this.measuredTotal = 0;
        this.measuredData.forEach((it) => {
          this.measuredTotal += it.value;
        });
        this.elCheck++;
      });
    },
    doSafeNav(n, t) {
      this.safeNav = n;
      this.safeText = t;
      this.dtChange();
    },
    //查询举牌验收
    doProjectChecking() {
      this.acceptanceData = [];
      //举牌验收数据列表
      this.$api.projectChecking
        .getProjectCheckingList(this.dept?.id || 0, this.projectInfo?.id || 0)
        .then((d) => {
          this.acceptanceData = d.rows;
        });
      //举牌验收统计
      // this.$api.projectChecking.getProjectCheckingView(this.dept?.id||0,this.projectInfo?.id||0).then(d=>{
      //     this.acceptanceDataView.sum=d.data.sum;
      //     this.acceptanceDataView.okSum=d.data.okSum;
      // });
    },
    init() {
      this.localStorage = JSON.parse(localStorage.getItem("data1"));
      //设备概况点击事件定时器
      this.overviewInterval = setInterval(this.overviewClick, 5000);
      //重大节点预期预警
      this.majorInterval = setInterval(this.timer, 5000);
      //正在发生 定时器
      this.warningInterval = setInterval(this.automaticRoll, 5000);
      //预警类型 定时器
      this.warningTypeInterval = setInterval(this.automaticRollType, 5000);
    },
    // 获取图片映射
    getProfileImage(url) {
      if (url) {
        return "/jhapi" + url + ".min.jpg";
      }
      return url;
    },
    getBigProfileImage(it) {
      if (it.imageUrls) {
        let tmps = it.imageUrls
          .split(",")
          .filter((d) => d)
          .map((it) => {
            return "/jhapi" + it;
          });
        if (tmps.length > 0) {
          return tmps;
        }
      }
      if (it.mainImage && it.mainImage.trim()) {
        return ["/jhapi" + it.mainImage];
      }
      return [];
    },
  },
};
</script>

<style lang="less">
.warning-info-title div {
  padding: 0 7px 0 7px !important;
  color: #69839e;
  cursor: pointer;
}

.warning-info-title_div div {
  padding: 0 5px 0 5px !important;
}

.project-quality {
  .problemmodify_list {
    .el-table__body-wrapper {
      &::-webkit-scrollbar {
        width: 8px;
        height: 8px;
      }

      &::-webkit-scrollbar-thumb {
        background-color: rgb(1, 169, 255);
        border-radius: 4px;
      }

      tr {
        cursor: pointer;
      }
    }
  }

  .center-image .screen-one-2-1 {
    overflow: hidden;
  }

  .equipment-list-data {
    position: relative;
  }

  .my-svg-icon-blue,
  .my-svg-icon-green {
    width: 28px;
    height: 28px;
    position: relative;
    top: -10px;
  }

  .my-svg-icon-green * {
    fill: #63f8bc;
  }

  .fgreen {
    color: #63f8bc !important;
  }

  .my-svg-icon {
    width: 40px;
    height: 40px;
    margin-bottom: 20px;
  }

  .my-svg-icon-blue *,
  .my-svg-icon * {
    fill: #389de3;
  }

  .people-number-con div:nth-child(3) {
    background: none;
  }

  .labour-education .number-unit {
    position: relative;
    bottom: -8px;
  }

  .bottom-line2,
  .bottom-line {
    border: none !important;
    position: relative;
  }

  .bottom-line::after {
    content: " ";
    display: block;
    position: absolute;
    width: calc(100% - 30px);
    border-bottom: solid 1px rgba(90, 192, 244, 0.3);
    bottom: 5px;
    left: 20px;
    opacity: 0.5;
  }

  .idle-list .el-table__body .el-table__row {
    line-height: 55px;
    height: 55px !important;
  }

  .bottom-line2::after {
    content: " ";
    display: block;
    position: absolute;
    width: calc(100% - 5px);
    border-bottom: solid 1px rgba(90, 192, 244, 0.3);
    bottom: -4px;
    opacity: 0.5;
  }

  .bottom-line2::before {
    content: " ";
    display: inline-block;
    position: absolute;
    width: 60px;
    border-bottom: solid 2px #389de3;
    bottom: -4px;
    opacity: 0.5;
  }

  .my-svg-icon2 {
    width: 40px;
    height: 40px;
  }

  .my-svg-icon2 * {
    fill: #01a9ff;
  }

  .nav-info {
    color: #82c9ff;
    font-size: 12px;
  }

  .nav-info .nav-label {
    font-size: 12px;
  }

  .nav-info .nav-num {
    font-size: 28px;
    font-weight: bold;
  }

  .nav-info .nav-unit {
    font-size: 12px;
  }

  .acceptance-item:first-child {
    margin-top: 10px;
  }

  .acceptance-item {
    padding: 13px;
  }

  .acceptance-item .row-5 {
    //margin-top:10px;
    line-height: 30px;
    color: #c7dafd;
  }

  .acceptance-item .row-3 {
    line-height: 30px;
    color: #4996d4;
  }

  .acceptance-item .row-1 {
    display: flex;
  }

  .acceptance-item .div-img {
    height: 90px;
    margin-right: 10px;

    overflow: hidden;
  }

  .acceptance-item .div-img img {
    width: 125px;
    height: 90px;
  }

  .acceptance-item .sp-lbl {
    background: #074031;
    border: solid 1px #1d642c;
    color: #41aa20;
    padding: 2px 8px;
    float: left;
    width: 35%;
  }

  .acceptance-item .sp-err {
    background: #351717;
    border: solid 1px #5a0303;
    color: #bb2424;
    padding: 2px 8px;
    float: left;
    width: 35%;
  }

  .acceptance-item .sp-date {
    font-size: 12px;
    color: #aaa;
    float: left;
    width: 58%;
    line-height: 36px;
    text-align: right;
  }

  .screen-one-3-1 {
    overflow-y: scroll;

    &::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }

    &::-webkit-scrollbar-thumb {
      background-color: rgb(1, 169, 255);
      border-radius: 4px;
    }
  }

  .hide-scroll>.screen-one-3-1 {
    overflow: hidden;
  }

  .measured-data-list {
    &>div {
      padding: 0px 5px;
    }
  }
}
</style>