<template>
  <div class="app-container">
    <el-tabs v-model="activeName" type="border-card">
      <el-tab-pane label="质检工单创建" name="first">
        <el-card style="">
          <el-row>
            <span>日期:</span>
            <el-date-picker
              v-model="dateTime"
              :clearable="false"
              size="small"
              type="daterange"
              align="center"
              style="width: 240px;"
              value-format="yyyy-MM-dd"
              format="yyyy-MM-dd"
              range-separator="～"
              start-placeholder="开始日期"
              end-placeholder="结束日期"/>
            <span>状态:</span>
            <el-select v-model="statusNumberValue" placeholder="状态" size="small" style="width:200px" @change="fetchData">
              <el-option
                v-for="item in statusNumber"
                :key="item.value"
                :label="item.label"
                :value="item.value"/>
            </el-select>
            <el-button type="success" icon="el-icon-search" size="small" style="margin-left: 20px;margin-top: 15px" @click="fetchData">查询</el-button>
            <el-button type="warning" icon="el-icon-plus" size="small" style="margin-left: 20px;margin-top: 15px" @click="addCheckOrder()">新增质检单</el-button>
          </el-row>
          <el-col :span="14">
            <el-table
              :data="tableData"
              border
              element-loading-text="数据加载中"
              highlight-current-row
              element-loading-spinner="el-icon-loading"
              element-loading-background="rgba(0, 0, 0, 0.2)"
              style="width: 100%"
              height= "590px"
              size="small"
              @row-click="CheckOrder_rowClick"
            >
              <el-table-column label="序号" type="index" align="center"/>
              <el-table-column label="产品编号" width="150" align="center">
                <template slot-scope="scope">
                  {{ scope.row.产品编号 }}
                </template>
              </el-table-column>
              <el-table-column label="质检单名称" min-width="100" align="center">
                <template slot-scope="scope">
                  {{ scope.row.质检单名称 }}
                </template>
              </el-table-column>
              <el-table-column label="质检日期" width="100" align="center">
                <template slot-scope="scope">
                  {{ scope.row.质检日期 }}
                </template>
              </el-table-column>
              <el-table-column label="检验员" width="100" align="center">
                <template slot-scope="scope">
                  {{ scope.row.质检员姓名 }}
                </template>
              </el-table-column>
              <el-table-column label="状态" width="100" align="center">
                <template slot-scope="scope">
                  <el-tag v-if="scope.row.状态 === 1" size="small" type="danger">未下发</el-tag>
                  <el-tag v-if="scope.row.状态 === 2" size="small" type="warning">未执行</el-tag>
                  <el-tag v-if="scope.row.状态 === 3" size="small" type="primary">质检中</el-tag>
                  <el-tag v-if="scope.row.状态 === 4" size="small" type="success">已完成</el-tag>
                </template>
              </el-table-column>
              <el-table-column label="检验数量" width="100" align="center">
                <template slot-scope="scope">
                  {{ scope.row.质检数量 }}
                </template>
              </el-table-column>
              <el-table-column label="编辑" width="130" align="center">
                <template slot-scope="scope">
                  <el-button v-if="scope.row['状态'] === 1" size="mini" type="text" title="下发" icon="el-icon-bottom" @click="deleteCheckChangeStatus(scope.row, 2)" />
                  <el-button v-if="scope.row['状态'] === 2" size="mini" type="text" title="取消下发" icon="el-icon-top" @click="deleteCheckChangeStatus(scope.row, 1)" />
                  <el-button v-if="scope.row['状态'] === 1" size="mini" type="text" title="修改" icon="el-icon-edit" @click="editCheckOrder(scope.row)" />
                  <el-button v-if="scope.row['状态'] === 1" size="mini" type="text" title="删除" icon="el-icon-delete" style="color: #ff0000" @click="deleteCheckOrder(scope.row)"/>
                </template>
              </el-table-column>
            </el-table>
            <div class="block">
              <el-pagination
                :current-page="currentPage"
                :page-sizes="[10, 20, 30, 40]"
                :page-size="10"
                :total="totalNum"
                layout="total, sizes, prev, pager, next, jumper"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"/>
            </div>
          </el-col>
          <el-col :span="10">
            <el-table
              :data="tableData_content"
              border
              element-loading-text="数据加载中"
              highlight-current-row
              element-loading-spinner="el-icon-loading"
              element-loading-background="rgba(0, 0, 0, 0.2)"
              style="width: 100%;margin-left: 10px"
              height= "590px"
              size="small"
            >
              <el-table-column label="序号" type="index" align="center"/>
              <el-table-column label="工位号" width="100" align="center">
                <template slot-scope="scope">
                  {{ scope.row.工位号 }}
                </template>
              </el-table-column>
              <el-table-column label="质检项目" width="100" align="center">
                <template slot-scope="scope">
                  {{ scope.row.检查项目 }}
                </template>
              </el-table-column>
              <el-table-column label="质检内容" min-width="100" align="center">
                <template slot-scope="scope">
                  {{ scope.row.检查内容 }}
                </template>
              </el-table-column>
              <el-table-column label="质检工具" width="100" align="center">
                <template slot-scope="scope">
                  {{ scope.row.检查工具名称 }}
                </template>
              </el-table-column>
              <el-table-column label="质检方法" width="100" align="center">
                <template slot-scope="scope">
                  {{ scope.row.检查方法名称 }}
                </template>
              </el-table-column>
              <el-table-column fixed="right" label="编辑" width="100" align="center">
                <template slot-scope="scope">
                  <el-button v-if="scope.row.ID === ''" :disbbled="currentSelectCheckOrder['状态'] !== 1" size="mini" title="增加质检项目" type="text" icon="el-icon-plus" @click="addCheckOrder_content()" />
                  <el-button v-if="scope.row.ID !== ''" :disbbled="currentSelectCheckOrder['状态'] !== 1" size="mini" title="编辑质检项目" type="text" icon="el-icon-edit" @click="editCheckOrder_content(scope.row)" />
                  <el-button v-if="scope.row.ID !== ''" :disbbled="currentSelectCheckOrder['状态'] !== 1" size="mini" title="删除质检项目" type="text" icon="el-icon-delete" style="color: #ff0000" @click="deleteCheckOrder_content(scope.row)"/>
                </template>
              </el-table-column>
            </el-table>
          </el-col>
        </el-card>
      </el-tab-pane>
      <el-tab-pane label="检查项管理" name="second">
        <el-card style="">
          <span style="margin-left: 10px">工位号：</span>
          <el-select v-model="stationNumberValue" placeholder="请选择工位号" size="small" style="width: 200px" @change="searchTableCheckContentBase">
            <el-option
              v-for="item in stationNumber"
              :key="item.value"
              :label="item.label"
              :value="item.value"
              size="mini"/>
          </el-select>
          <el-button type="primary" plain size="small" icon="el-icon-search" @click="searchTableCheckContentBase()">查询</el-button>
          <el-button type="warning" plain size="small" icon="el-icon-plus" @click="addCheckContentBase()">新增</el-button>
          <el-table
            v-loading="listLoading1"
            :data="tableDataCheckContentBase"
            border
            element-loading-text="数据加载中"
            highlight-current-row
            element-loading-spinner="el-icon-loading"
            element-loading-background="rgba(0, 0, 0, 0.2)"
            height= "630px"
            style="width: 100%"
            size="small"
          >
            <el-table-column label="序号" type="index" align="center"/>
            <el-table-column label="工位号" width="100" align="center">
              <template slot-scope="scope">
                {{ scope.row.工位号 }}
              </template>
            </el-table-column>
            <el-table-column label="检查项目" width="150" align="center">
              <template slot-scope="scope">
                {{ scope.row.检查项目 }}
              </template>
            </el-table-column>
            <el-table-column label="检查内容" min-width="100" align="center">
              <template slot-scope="scope">
                {{ scope.row.检查内容 }}
              </template>
            </el-table-column>
            <el-table-column label="标准值" width="100" align="center">
              <template slot-scope="scope">
                {{ scope.row.标准值 }}
              </template>
            </el-table-column>
            <el-table-column label="下限" width="100" align="center">
              <template slot-scope="scope">
                {{ scope.row.下限 }}
              </template>
            </el-table-column>
            <el-table-column label="上限" width="100" align="center">
              <template slot-scope="scope">
                {{ scope.row.上限 }}
              </template>
            </el-table-column>
            <el-table-column label="单位" width="100" align="center">
              <template slot-scope="scope">
                {{ scope.row.单位 }}
              </template>
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="100" align="center">
              <template slot-scope="scope">
                <el-button size="mini" type="text" icon="el-icon-edit" @click="editCheckContentBase(scope.row)" />
                <el-button size="mini" type="text" icon="el-icon-delete" style="color: #ff0000" @click="deleteCheckContentBase(scope.row)"/>
              </template>
            </el-table-column>
          </el-table>
        </el-card>
      </el-tab-pane>
      <el-tab-pane label="检查工具/方法管理" name="third">
        <el-card style="">
          <el-col :span="11">
            <el-row style="">
              <el-button type="warning" plain size="small" icon="el-icon-plus" @click="addCheckToolBase()">新增</el-button>
              <el-table
                v-loading="listLoading2"
                :data="tableDataCheckToolBase"
                border
                element-loading-text="数据加载中"
                highlight-current-row
                element-loading-spinner="el-icon-loading"
                element-loading-background="rgba(0, 0, 0, 0.2)"
                style="width: 100%"
                height= "640px"
                size="small"
              >
                <el-table-column label="序号" type="index" align="center"/>
                <el-table-column label="检查工具" align="center">
                  <template slot-scope="scope">
                    {{ scope.row.检查工具名称 }}
                  </template>
                </el-table-column>
                <el-table-column label="操作" width="120" align="center">
                  <template slot-scope="scope">
                    <el-button size="mini" type="text" icon="el-icon-edit" @click="editCheckToolBase(scope.row)" />
                    <el-button size="mini" type="text" icon="el-icon-delete" style="color: #ff0000" @click="deleteCheckToolBase(scope.row)"/>
                  </template>
                </el-table-column>
              </el-table>
            </el-row>
          </el-col>
          <el-col :span="11">
            <el-row style="margin-left: 10px">
              <el-button type="warning" plain size="small" icon="el-icon-plus" @click="addCheckMethodBase()">新增</el-button>
              <el-table
                v-loading="listLoading3"
                :data="tableDataCheckMethodBase"
                border
                element-loading-text="数据加载中"
                highlight-current-row
                element-loading-spinner="el-icon-loading"
                element-loading-background="rgba(0, 0, 0, 0.2)"
                fit
                style="width: 100%"
                height= "640px"
                size="small"
              >
                <el-table-column label="序号" type="index" align="center"/>
                <el-table-column label="检查方法" align="center">
                  <template slot-scope="scope">
                    {{ scope.row.检查方法名称 }}
                  </template>
                </el-table-column>
                <el-table-column label="操作" width="120" align="center">
                  <template slot-scope="scope">
                    <el-button size="mini" type="text" icon="el-icon-edit" @click="editCheckMethodBase(scope.row)" />
                    <el-button size="mini" type="text" icon="el-icon-delete" style="color: #ff0000" @click="deleteCheckMethodBase(scope.row)"/>
                  </template>
                </el-table-column>
              </el-table>
            </el-row>
          </el-col>
        </el-card>
      </el-tab-pane>
    </el-tabs>
    <el-dialog :visible.sync="dialogFormVisible_addCheckContentBase" title="增加检查项" center style="min-height: 200px;" width="400px">
      <el-form ref="form_addCheckContentBase" :model="form_addCheckContentBase" :rules="rules_addCheckContentBase" label-position="right" label-width="110px">
        <el-form-item label="工位号" prop="stationNumberValue" style="display: inline-block">
          <el-select v-model="form_addCheckContentBase.stationNumberValue" size="small" placeholder="请选择工位号">
            <el-option
              v-for="item in stationNumber"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
        </el-form-item>
        <el-form-item label="检查项" prop="checkItem" style="display: inline-block">
          <el-input
            v-model="form_addCheckContentBase.checkItem"
            clearable
            size="small"
            placeholder="请输入检查项"/>
        </el-form-item>
        <el-form-item label="检查内容" prop="checkItemContent" style="display: inline-block">
          <el-input
            v-model="form_addCheckContentBase.checkItemContent"
            clearable
            size="small"
            placeholder="请输入检查内容"/>
        </el-form-item>
        <el-form-item label="标准值" prop="standardValue" style="display: inline-block">
          <el-input
            v-model="form_addCheckContentBase.standardValue"
            clearable
            size="small"
            placeholder="请输入标准值"/>
        </el-form-item>
        <el-form-item label="最大值" prop="maximumValue" style="display: inline-block">
          <el-input
            v-model="form_addCheckContentBase.maximumValue"
            clearable
            size="small"
            placeholder="请输入最大值"/>
        </el-form-item>
        <el-form-item label="最小值" prop="minimumValue" style="display: inline-block">
          <el-input
            v-model="form_addCheckContentBase.minimumValue"
            clearable
            size="small"
            placeholder="请输入最小值"/>
        </el-form-item>
        <el-form-item label="单位" prop="unit" style="display: inline-block">
          <el-input
            v-model="form_addCheckContentBase.unit"
            clearable
            size="small"
            placeholder="单位"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="addCheckContentBase_cancel('form_addCheckContentBase')">取消</el-button>
        <el-button type="primary" size="small" @click="addCheckContentBase_sure('form_addCheckContentBase')">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogFormVisible_editCheckContentBase" title="编辑检查项" center style="min-height: 200px;" width="400px">
      <el-form ref="form_editCheckContentBase" :model="form_editCheckContentBase" :rules="rules_editCheckContentBase" label-position="right" label-width="110px">
        <el-form-item label="工位号" prop="stationNumberValue" style="display: inline-block">
          <el-select v-model="form_editCheckContentBase.stationNumberValue" disabled="" size="small" placeholder="请选择工位号">
            <el-option
              v-for="item in stationNumber"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
        </el-form-item>
        <el-form-item label="检查项" prop="checkItem" style="display: inline-block">
          <el-input
            v-model="form_editCheckContentBase.checkItem"
            clearable
            size="small"
            placeholder="请输入检查项"/>
        </el-form-item>
        <el-form-item label="检查内容" prop="checkItemContent" style="display: inline-block">
          <el-input
            v-model="form_editCheckContentBase.checkItemContent"
            clearable
            size="small"
            placeholder="请输入检查内容"/>
        </el-form-item>
        <el-form-item label="标准值" prop="standardValue" style="display: inline-block">
          <el-input
            v-model="form_editCheckContentBase.standardValue"
            clearable
            size="small"
            placeholder="请输入标准值"/>
        </el-form-item>
        <el-form-item label="最大值" prop="maximumValue" style="display: inline-block">
          <el-input
            v-model="form_editCheckContentBase.maximumValue"
            clearable
            size="small"
            placeholder="请输入最大值"/>
        </el-form-item>
        <el-form-item label="最小值" prop="minimumValue" style="display: inline-block">
          <el-input
            v-model="form_editCheckContentBase.minimumValue"
            clearable
            size="small"
            placeholder="请输入最小值"/>
        </el-form-item>
        <el-form-item label="单位" prop="unit" style="display: inline-block">
          <el-input
            v-model="form_editCheckContentBase.unit"
            clearable
            size="small"
            placeholder="单位"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="editCheckContentBase_cancel('form_editCheckContentBase')">取消</el-button>
        <el-button type="primary" size="small" @click="editCheckContentBase_sure('form_editCheckContentBase')">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogFormVisible_addCheckToolBase" title="增加检查工具" center style="min-height: 200px;" width="400px">
      <el-form ref="form_addCheckToolBase" :model="form_addCheckToolBase" :rules="rules_addCheckToolBase" label-position="right" label-width="110px">
        <el-form-item label="检查工具" prop="toolName" style="display: inline-block">
          <el-input
            v-model="form_addCheckToolBase.toolName"
            clearable
            size="small"
            placeholder="请输入检查工具"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="addCheckToolBase_cancel('form_addCheckToolBase')">取消</el-button>
        <el-button type="primary" size="small" @click="addCheckToolBase_sure('form_addCheckToolBase')">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogFormVisible_editCheckToolBase" title="编辑检查工具" center style="min-height: 200px;" width="400px">
      <el-form ref="form_editCheckToolBase" :model="form_editCheckToolBase" :rules="rules_editCheckToolBase" label-position="right" label-width="110px">
        <el-form-item label="检查工具" prop="toolName" style="display: inline-block">
          <el-input
            v-model="form_editCheckToolBase.toolName"
            clearable
            size="small"
            placeholder="请输入检查工具"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="editCheckToolBase_cancel('form_editCheckToolBase')">取消</el-button>
        <el-button type="primary" size="small" @click="editCheckToolBase_sure('form_editCheckToolBase')">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogFormVisible_addCheckMethodBase" title="增加检查方法" center style="min-height: 200px;" width="400px">
      <el-form ref="form_addCheckMethodBase" :model="form_addCheckMethodBase" :rules="rules_addCheckMethodBase" label-position="right" label-width="110px">
        <el-form-item label="检查方法" prop="toolName" style="display: inline-block">
          <el-input
            v-model="form_addCheckMethodBase.methodName"
            clearable
            size="small"
            placeholder="请输入检查方法"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="addCheckMethodBase_cancel('form_addCheckMethodBase')">取消</el-button>
        <el-button type="primary" size="small" @click="addCheckMethodBase_sure('form_addCheckMethodBase')">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogFormVisible_editCheckMethodBase" title="编辑检查方法" center style="min-height: 200px;" width="400px">
      <el-form ref="form_editCheckMethodBase" :model="form_editCheckMethodBase" :rules="rules_editCheckMethodBase" label-position="right" label-width="110px">
        <el-form-item label="检查方法" prop="toolName" style="display: inline-block">
          <el-input
            v-model="form_editCheckMethodBase.methodName"
            clearable
            size="small"
            placeholder="请输入检查方法"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="editCheckMethodBase_cancel('form_editCheckMethodBase')">取消</el-button>
        <el-button type="primary" size="small" @click="editCheckMethodBase_sure('form_editCheckMethodBase')">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogFormVisible_addCheckOrder" title="增加检查工单" center style="min-height: 200px;" width="400px">
      <el-form ref="form_addCheckOrder" :model="form_addCheckOrder" :rules="rules_addCheckOrder" label-position="right" label-width="110px">
        <el-form-item label="检查单名称" prop="checkOrderName" style="display: inline-block">
          <el-input
            v-model="form_addCheckOrder.checkOrderName"
            clearable
            size="small"
            placeholder="请输入检查单名称"/>
        </el-form-item>
        <el-form-item label="产品编号" prop="productCode" style="display: inline-block">
          <el-input
            v-model="form_addCheckOrder.productCode"
            clearable
            size="small"
            placeholder="请输入产品编号"/>
        </el-form-item>
        <el-form-item label="检查人" prop="usedPersonId" style="display: inline-block">
          <el-input v-model="form_addCheckOrder.usedPersonName" placeholder="请双击选择" size="small" readonly style="width:200px" @dblclick.native="dialogFormVisible_selectPeople = true"/>
        </el-form-item>
        <el-form-item label="检查时间" prop="checkOrderDate" style="display: inline-block">
          <el-date-picker
            v-model="form_addCheckOrder.checkOrderDate"
            :clearable="false"
            size="small"
            type="date"
            style="width: 200px;"
            value-format="yyyy-MM-dd"
            format="yyyy-MM-dd"/>
        </el-form-item>
        <el-form-item label="备注" prop="checkOrderRemarks" style="display: inline-block">
          <div style="width: 200px">
            <el-input
              v-model="form_addCheckOrder.checkOrderRemarks"
              :rows="2"
              type="textarea"
              size="small"
              placeholder="请输入备注"/>
          </div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="addCheckOrder_cancel('form_addCheckOrder')">取消</el-button>
        <el-button type="primary" size="small" @click="addCheckOrder_sure('form_addCheckOrder')">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogFormVisible_editCheckOrder" title="编辑检查工单" center style="min-height: 200px;" width="400px">
      <el-form ref="form_editCheckOrder" :model="form_editCheckOrder" :rules="rules_editCheckOrder" label-position="right" label-width="110px">
        <el-form-item label="检查单名称" prop="checkOrderName" style="display: inline-block">
          <el-input
            v-model="form_editCheckOrder.checkOrderName"
            clearable
            size="small"
            placeholder="请输入检查单名称"/>
        </el-form-item>
        <el-form-item label="产品编号" prop="productCode" style="display: inline-block">
          <el-input
            v-model="form_editCheckOrder.productCode"
            clearable
            size="small"
            placeholder="请输入产品编号"/>
        </el-form-item>
        <el-form-item label="检查人" prop="usedPersonId" style="display: inline-block">
          <el-input v-model="form_editCheckOrder.usedPersonName" placeholder="请双击选择" size="small" readonly style="width:200px" @dblclick.native="dialogFormVisible_selectPeople = true"/>
        </el-form-item>
        <el-form-item label="检查时间" prop="checkOrderDate" style="display: inline-block">
          <el-date-picker
            v-model="form_editCheckOrder.checkOrderDate"
            :clearable="false"
            size="small"
            type="date"
            style="width: 200px;"
            value-format="yyyy-MM-dd"
            format="yyyy-MM-dd"/>
        </el-form-item>
        <el-form-item label="备注" prop="checkOrderRemarks" style="display: inline-block">
          <div style="width: 200px">
            <el-input
              v-model="form_editCheckOrder.checkOrderRemarks"
              :rows="2"
              type="textarea"
              size="small"
              placeholder="请输入备注"/>
          </div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="editCheckOrder_cancel('form_editCheckOrder')">取消</el-button>
        <el-button type="primary" size="small" @click="editCheckOrder_sure('form_editCheckOrder')">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogFormVisible_selectPeople" title="人员信息" center width="750px">
      <div style="height: 420px">
        <div style="float: left;margin-top: 10px;margin-left: 20px;overflow-y: scroll;height: 400px;border: 1px solid #cfcfcf">
          <el-tree
            :data="data2_tree"
            node-key="id"
            style="width: 150px;float: left"
            height="400"
            accordion
            @node-click="handleNodeClick"
          />
        </div>
        <el-table :data="List1" highlight-current-row height="400" style="width: 400px;float: left;margin-left: 30px" @row-click="peopleRowClick">
          <el-table-column label="考勤编号" align="center" >
            <template slot-scope="scope">
              {{ scope.row.考勤编号 }}
            </template>
          </el-table-column>
          <el-table-column label="姓名" align="center" >
            <template slot-scope="scope">
              {{ scope.row.姓名 }}
            </template>
          </el-table-column>
          <el-table-column label="性别" align="center">
            <template slot-scope="scope">
              {{ scope.row.性别 }}
            </template>
          </el-table-column>
        </el-table>
      </div>
      <el-button style="margin-left: 260px" @click="dialogFormVisible = false">取消</el-button>
      <el-button type="primary" style="margin-top: 20px" @click="getName">确认</el-button>
    </el-dialog>
    <el-dialog :visible.sync="dialogFormVisible_addCheckOrder_content" title="增加检查项目" center style="min-height: 200px;" width="800px">
      <el-form ref="form_addCheckOrder_content" :model="form_addCheckOrder_content" :rules="rules_addCheckOrder_content" label-position="right" label-width="110px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="检查单名称" prop="checkOrderName" style="display: inline-block">
              <el-input
                v-model="form_addCheckOrder_content.checkOrderName"
                readonly
                size="small"
                style="width: 200px"
                placeholder=""/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="检查单号" prop="checkOrderCode" style="display: inline-block">
              <el-input
                v-model="form_addCheckOrder_content.checkOrderCode"
                readonly
                style="width: 200px"
                size="small"
                placeholder=""/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="工位号" prop="stationNumberValue" style="display: inline-block">
              <el-select v-model="form_addCheckOrder_content.stationNumberValue" size="small" placeholder="请选择工位号" style="width: 200px" @change="searchCheckContentBase(form_addCheckOrder_content.stationNumberValue)">
                <el-option
                  v-for="item in stationNumber"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="检查项目" prop="checkOrderContentId" style="display: inline-block">
              <el-select v-model="form_addCheckOrder_content.checkOrderContentId" size="small" placeholder="请选择检查项目" style="width: 200px">
                <el-option
                  v-for="item in CheckContentBase"
                  :key="item.ID"
                  :label="item.检查项目"
                  :value="item.ID"/>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="检查内容" prop="checkOrderContent" style="display: inline-block">
            <el-input v-model="form_addCheckOrder_content.checkOrderContent" :rows="2" type="textarea" placeholder="检查内容" size="small" readonly style="width:575px"/>
          </el-form-item>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="检查工具" prop="checkOrderToolId" style="display: inline-block">
              <el-select v-model="form_addCheckOrder_content.checkOrderToolId" size="small" placeholder="请选择检查工具" style="width: 200px">
                <el-option
                  v-for="item in CheckToolBase"
                  :key="item.ID"
                  :label="item.检查工具名称"
                  :value="item.ID"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="检查方法" prop="checkOrderMethodId" style="display: inline-block">
              <el-select v-model="form_addCheckOrder_content.checkOrderMethodId" size="small" placeholder="请选择检查方法" style="width: 200px">
                <el-option
                  v-for="item in CheckMethodBase"
                  :key="item.ID"
                  :label="item.检查方法名称"
                  :value="item.ID"/>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="备注" prop="checkOrderRemarks" style="display: inline-block">
            <div style="width: 575px">
              <el-input
                v-model="form_addCheckOrder_content.checkOrderRemarks"
                :rows="2"
                type="textarea"
                size="small"
                placeholder="请输入备注"/>
            </div>
          </el-form-item>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="addCheckOrder_content_cancel('form_addCheckOrder_content')">取消</el-button>
        <el-button type="primary" size="small" @click="addCheckOrder_content_sure('form_addCheckOrder_content')">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="dialogFormVisible_editCheckOrder_content" title="编辑检查工单" center style="min-height: 200px;" width="800px">
      <el-form ref="form_editCheckOrder_content" :model="form_editCheckOrder_content" :rules="rules_editCheckOrder_content" label-position="right" label-width="110px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="检查单名称" prop="checkOrderName" style="display: inline-block">
              <el-input
                v-model="form_editCheckOrder_content.checkOrderName"
                readonly
                size="small"
                style="width: 200px"
                placeholder=""/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="检查单号" prop="checkOrderCode" style="display: inline-block">
              <el-input
                v-model="form_editCheckOrder_content.checkOrderCode"
                readonly
                style="width: 200px"
                size="small"
                placeholder=""/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="工位号" prop="stationNumberValue" style="display: inline-block">
              <el-select v-model="form_editCheckOrder_content.stationNumberValue" size="small" placeholder="请选择工位号" style="width: 200px" @change="searchCheckContentBase(form_editCheckOrder_content.stationNumberValue)">
                <el-option
                  v-for="item in stationNumber"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="检查项目" prop="checkOrderContentId" style="display: inline-block">
              <el-select v-model="form_editCheckOrder_content.checkOrderContentId" size="small" placeholder="请选择检查项目" style="width: 200px">
                <el-option
                  v-for="item in CheckContentBase"
                  :key="item.ID"
                  :label="item.检查项目"
                  :value="item.ID"/>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="检查内容" prop="checkOrderContent" style="display: inline-block">
            <el-input v-model="form_editCheckOrder_content.checkOrderContent" :rows="2" type="textarea" placeholder="检查内容" size="small" readonly style="width:575px"/>
          </el-form-item>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="检查工具" prop="checkOrderToolId" style="display: inline-block">
              <el-select v-model="form_editCheckOrder_content.checkOrderToolId" size="small" placeholder="请选择检查工具" style="width: 200px">
                <el-option
                  v-for="item in CheckToolBase"
                  :key="item.ID"
                  :label="item.检查工具名称"
                  :value="item.ID"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="检查方法" prop="checkOrderMethodId" style="display: inline-block">
              <el-select v-model="form_editCheckOrder_content.checkOrderMethodId" size="small" placeholder="请选择检查方法" style="width: 200px">
                <el-option
                  v-for="item in CheckMethodBase"
                  :key="item.ID"
                  :label="item.检查方法名称"
                  :value="item.ID"/>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="备注" prop="checkOrderRemarks" style="display: inline-block">
            <div style="width: 575px">
              <el-input
                v-model="form_editCheckOrder_content.checkOrderRemarks"
                :rows="2"
                type="textarea"
                size="small"
                placeholder="请输入备注"/>
            </div>
          </el-form-item>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="editCheckOrder_content_cancel('form_editCheckOrder_content')">取消</el-button>
        <el-button type="primary" size="small" @click="editCheckOrder_content_sure('form_editCheckOrder_content')">确定</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>
import { fn } from '@/api/BasicData/WorkshopPersonnelRoleMana'
import { getNowTime2 } from '@/utils/tool'
import request from '@/utils/request'
import { mapGetters } from 'vuex'
import { getBeforeOrAfterTime } from '../../../utils/tool'
export default {
  data() {
    return {
      department: '', // 部门
      staffName: '', // 员工姓名
      roleName: null, // 角色名称
      tableData_people: [],
      List1: [],
      data2_tree: [],
      roleNames: [],
      personNumber: '',
      personName: '',
      stationNumber: [],
      stationNumberValue: '0',
      statusNumber: [
        {
          value: 0,
          label: '全部'
        },
        {
          value: 1,
          label: '未下发'
        },
        {
          value: 2,
          label: '已下发'
        }
      ],
      statusNumberValue: 0,
      activeName: 'first',
      dateTime: [],
      dialogFormVisible_selectPeople: false,
      tableData: [],
      tableData_content: [],
      dialogFormVisible_addCheckOrder: false,
      form_addCheckOrder: {
        checkOrderName: '',
        checkOrderRemarks: '',
        makePersonId: '',
        makePersonName: '',
        usedPersonId: '',
        usedPersonName: '',
        productCode: '',
        checkOrderDate: ''
      },
      rules_addCheckOrder: {
        usedPersonId: [{ required: true, message: '请选择检查人员' }],
        checkOrderName: [{ required: true, message: '请输入检查工单名称', trigger: 'blur' }],
        productCode: [{ required: true, message: '请选择产品编号', trigger: 'blur' }]
      },
      dialogFormVisible_editCheckOrder: false,
      form_editCheckOrder: {
        checkOrderName: '',
        checkOrderRemarks: '',
        makePersonId: '',
        makePersonName: '',
        usedPersonId: '',
        usedPersonName: '',
        productCode: '',
        checkOrderDate: ''
      },
      rules_editCheckOrder: {
        usedPersonId: [{ required: true, message: '请选择检查人员' }],
        checkOrderName: [{ required: true, message: '请输入检查工单名称', trigger: 'blur' }],
        productCode: [{ required: true, message: '请选择产品编号', trigger: 'blur' }]
      },

      currentSelectCheckOrder: {},
      dialogFormVisible_addCheckOrder_content: false,
      form_addCheckOrder_content: {
        checkOrderRemarks: '',
        checkOrderName: '',
        checkOrderCode: '',
        stationNumberValue: '',
        checkOrderContentId: '',
        checkOrderContent: '',
        checkOrderToolId: '',
        checkOrderMethodId: ''
      },
      rules_addCheckOrder_content: {
        checkOrderContentId: [{ required: true, message: '请选择检查项', trigger: 'change' }],
        checkOrderToolId: [{ required: true, message: '请选择检查工具', trigger: 'change' }],
        checkOrderMethodId: [{ required: true, message: '请选择检查方法', trigger: 'change' }]
      },
      dialogFormVisible_editCheckOrder_content: false,
      form_editCheckOrder_content: {
        ID: '',
        checkOrderRemarks: '',
        checkOrderName: '',
        checkOrderCode: '',
        stationNumberValue: '',
        checkOrderContentId: '',
        checkOrderContent: '',
        checkOrderToolId: '',
        checkOrderMethodId: ''
      },
      rules_editCheckOrder_content: {
        checkOrderContentId: [{ required: true, message: '请选择检查项', trigger: 'change' }],
        checkOrderToolId: [{ required: true, message: '请选择检查工具', trigger: 'change' }],
        checkOrderMethodId: [{ required: true, message: '请选择检查方法', trigger: 'change' }]
      },

      CheckContentBase: [],
      tableDataCheckContentBase: [],
      dialogFormVisible_addCheckContentBase: false,
      form_addCheckContentBase: {
        stationNumberValue: '',
        checkItem: '',
        checkItemContent: '',
        standardValue: '',
        maximumValue: '',
        minimumValue: '',
        unit: ''
      },
      rules_addCheckContentBase: {
        stationNumberValue: [{ required: true, message: '请选择工位号', trigger: 'change' }],
        checkItem: [{ required: true, message: '请输入检查项', trigger: 'blur' }],
        checkItemContent: [{ required: true, message: '请输入检查项内容', trigger: 'blur' }]
      },
      dialogFormVisible_editCheckContentBase: false,
      form_editCheckContentBase: {
        ID: '',
        stationNumberValue: '',
        checkItem: '',
        checkItemContent: '',
        standardValue: '',
        maximumValue: '',
        minimumValue: '',
        unit: ''
      },
      rules_editCheckContentBase: {
        stationNumberValue: [{ required: true, message: '请选择工位号', trigger: 'change' }],
        checkItem: [{ required: true, message: '请输入检查项', trigger: 'blur' }],
        checkItemContent: [{ required: true, message: '请输入检查项内容', trigger: 'blur' }]
      },

      tableDataCheckToolBase: [],
      CheckToolBase: [],
      dialogFormVisible_addCheckToolBase: false,
      form_addCheckToolBase: {
        toolName: ''
      },
      rules_addCheckToolBase: {
        toolName: [{ required: true, message: '请输入工具名称', trigger: 'blur' }]
      },
      dialogFormVisible_editCheckToolBase: false,
      form_editCheckToolBase: {
        ID: '',
        toolName: ''
      },
      rules_editCheckToolBase: {
        toolName: [{ required: true, message: '请输入工具名称', trigger: 'blur' }]
      },
      CheckMethodBase: [],
      tableDataCheckMethodBase: [],
      dialogFormVisible_addCheckMethodBase: false,
      form_addCheckMethodBase: {
        methodName: ''
      },
      rules_addCheckMethodBase: {
        methodName: [{ required: true, message: '请输入检查方法名称', trigger: 'blur' }]
      },
      dialogFormVisible_editCheckMethodBase: false,
      form_editCheckMethodBase: {
        ID: '',
        methodName: ''
      },
      rules_editCheckMethodBase: {
        methodName: [{ required: true, message: '请输入检查方法名称', trigger: 'blur' }]
      },
      listLoading: false,
      listLoading1: false,
      listLoading2: false,
      listLoading3: false,
      listLoading4: false,
      listLoading5: false,
      currentPage: 1,
      pageSize: 10,
      pageCurrent: 1,
      totalNum: null,
      downloadLoading: '',
      tableData_excel: [],
      colorchart: []
    }
  },
  computed: {
    ...mapGetters([
      'name',
      'id'
    ])
  },
  created() {
    this.dateTime = [getBeforeOrAfterTime(-7), getNowTime2()]
    this.fetchData()
    this.fetchData_getPeople()
    this.getStationNumber()
    this.searchCheckToolBase()
    this.searchCheckMethodBase()
    this.searchTableCheckToolBase()
    this.searchTableCheckMethodBase()
  },
  methods: {
    fetchData_getPeople() {
      var param = []
      param[0] = ['子节点', 0]
      var Data = this.CreateData('11', '人事档案管理_部门关系_查询节点', param)
      this.ExecDatabase(Data).then(response => {
        const data = response.data
        this.data2_tree = fn(data, 0)
      })
      var param1 = []
      var Data1 = this.CreateData('11', '菜单系统模块_项目角色_查询数据_new', param1)
      this.ExecDatabase(Data1).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.roleNames.push({
            label: response.data[i].角色功能,
            value: response.data[i].角色编号
          })
        }
      })
      this.searchData_getPeople()
    },
    searchData_getPeople() {
      if (this.staffName !== '' && this.staffName !== null) {
        this.check1 = 1
      } else {
        this.check1 = 0
      }
      if (this.roleName !== '' && this.roleName !== null) {
        this.check2 = 1
      } else {
        this.check2 = 0
      }
      var param = []
      param[0] = ['姓名_check', this.check1]
      param[1] = ['姓名', this.staffName]
      param[2] = ['角色编号_check', this.check2]
      param[3] = ['角色编号', this.roleName]
      var Data = this.CreateData('11', '菜单系统模块_项目角色员工综合_查询数据', param)
      this.ExecDatabase(Data).then(response => {
        this.tableData_people = response.data
      })
    },
    handleNodeClick(data) { // 树节点点击
      this.department = data.label
      var param = []
      param[0] = ['考核部门编号', data.id]
      var Data = this.CreateData('11', '人事档案管理_人员_部门与人员_查询数据_根据部门编号', param)
      this.ExecDatabase(Data).then(response => {
        this.List1 = response.data
      })
    },
    getName() { // 提交人员
      this.dialogFormVisible_selectPeople = false
      this.form_addCheckOrder.usedPersonId = this.personNumber
      this.form_addCheckOrder.usedPersonName = this.personName
      this.form_editCheckOrder.usedPersonId = this.personNumber
      this.form_editCheckOrder.usedPersonName = this.personName
    },
    peopleRowClick(row) { // 获取当前行人员信息
      this.personName = row.姓名
      this.personNumber = row.人员编号
    },
    getStationNumber() {
      this.stationNumber = []
      var param = []
      var Data = this.CreateData('11', 'MES_计划BOM_工位与名称_查询', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data.length) {
          this.stationNumberValue = response.data[0].工位号
          this.stationName = response.data[0].工位名称
        }
        for (let i = 0; i < response.data.length; i++) {
          this.stationNumber.push({
            label: `【${response.data[i].工位号}】${response.data[i].工位名称}`,
            value: response.data[i].工位号,
            labelName: response.data[i].工位名称
          })
        }
      })
    },

    // region 质检工单维护
    fetchData() {
      this.listLoading = true
      const statusNumber = this.statusNumberValue === 0 ? 0 : 1
      var param = []
      param[0] = ['开始日期', this.dateTime[0]]
      param[1] = ['结束日期', this.dateTime[1]]
      param[2] = ['状态', this.statusNumberValue]
      param[3] = ['状态_ischeck', statusNumber]
      param[4] = ['PageCurrent', this.pageCurrent]
      param[5] = ['PageSize', this.pageSize]
      param[6] = ['PageCount', 1000, 'int', '1']
      param[7] = ['ItemCount', 1000, 'int', '1']
      param[8] = ['日期_ischeck', 1]
      var Data = this.CreateData('11', '质检_工单_查询', param)
      this.ExecDatabase(Data).then(response => {
        this.tableData = response.data.result
        this.totalNum = parseInt(response.data.output[0].ItemCount)
        this.listLoading = false
      }).catch(er => {
        this.listLoading = false
        this.$message.error('错误')
      })
    },
    addCheckOrder() {
      this.dialogFormVisible_addCheckOrder = true
      this.form_addCheckOrder.checkOrderName = ''
      this.form_addCheckOrder.checkOrderRemarks = ''
      this.form_addCheckOrder.makePersonId = this.id
      this.form_addCheckOrder.makePersonName = ''
      this.form_addCheckOrder.usedPersonId = ''
      this.form_addCheckOrder.usedPersonName = ''
      this.form_addCheckOrder.productCode = ''
      this.form_addCheckOrder.checkOrderDate = getNowTime2()
    },
    addCheckOrder_sure(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var param = []
          param[0] = ['质检单名称', this.form_addCheckOrder.checkOrderName]
          param[1] = ['检查备注', this.form_addCheckOrder.checkOrderRemarks]
          param[2] = ['下发人id', this.form_addCheckOrder.makePersonId]
          param[3] = ['检验员id', this.form_addCheckOrder.usedPersonId]
          param[4] = ['产品编号', this.form_addCheckOrder.productCode]
          param[5] = ['质检日期', this.form_addCheckOrder.checkOrderDate]
          var Data = this.CreateData('12', '质检_工单_新增', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '增加成功',
                type: 'success'
              })
              this.dialogFormVisible_addCheckOrder = false
              this.fetchData()
            } else {
              this.$message.error('增加失败！')
            }
          })
        } else {
          return false
        }
      })
    },
    addCheckOrder_cancel(formName) {
      this.dialogFormVisible_addCheckOrder = false
      this.$refs[formName].resetFields()
    },
    editCheckOrder(row) {
      this.dialogFormVisible_editCheckOrder = true
      this.form_editCheckOrder.checkOrderName = row.质检单名称
      this.form_editCheckOrder.checkOrderRemarks = row.检查备注
      this.form_editCheckOrder.makePersonId = row.下发人id
      this.form_editCheckOrder.makePersonName = row.下发人姓名
      this.form_editCheckOrder.usedPersonId = row.检验员id
      this.form_editCheckOrder.usedPersonName = row.质检员姓名
      this.form_editCheckOrder.productCode = row.产品编号
      this.form_editCheckOrder.checkOrderDate = row.质检日期
      this.form_editCheckOrder.ID = row.ID
    },
    editCheckOrder_sure(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var param = []
          param[0] = ['质检单名称', this.form_editCheckOrder.checkOrderName]
          param[1] = ['检查备注', this.form_editCheckOrder.checkOrderRemarks]
          param[2] = ['下发人id', this.form_editCheckOrder.makePersonId]
          param[3] = ['检验员id', this.form_editCheckOrder.usedPersonId]
          param[4] = ['产品编号', this.form_editCheckOrder.productCode]
          param[5] = ['质检日期', this.form_editCheckOrder.checkOrderDate]
          param[6] = ['ID', this.form_editCheckOrder.ID]
          var Data = this.CreateData('12', '质检_工单_编辑', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '编辑成功！',
                type: 'success'
              })
              this.dialogFormVisible_editCheckOrder = false
              this.fetchData()
            } else {
              this.$message.error('编辑失败！')
            }
          })
        } else {
          return false
        }
      })
    },
    editCheckOrder_cancel(formName) {
      this.dialogFormVisible_editCheckContentBase = false
      this.$refs[formName].resetFields()
    },
    deleteCheckOrder(row) {
      this.$confirm('此操作将永久删除该行, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var param = []
        param[0] = ['ID', row.ID]
        var Data = this.CreateData('12', '质检_工单_删除', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result === '1') {
            this.$message({
              message: '质检工单删除成功',
              type: 'success'
            })
            this.fetchData()
          } else {
            this.$message.error('质检工单删除失败！')
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    deleteCheckChangeStatus(row, status) {
      var param = []
      param[0] = ['ID', row.ID]
      param[1] = ['状态', status]
      var message = [
        '',
        '取消下发',
        '下发'
      ]
      var Data = this.CreateData('12', '质检_工单_状态更改', param)
      this.ExecDatabase(Data).then(response => {
        if (response.data[0].result === '1') {
          this.$message({
            message: message[status] + '成功',
            type: 'success'
          })
          this.fetchData()
        } else {
          this.$message.error(message[status] + '失败！')
        }
      })
    },
    CheckOrder_rowClick(row) {
      this.currentSelectCheckOrder = row
      this.fetchData_content(row)
    },
    searchCheckContentBase(stationNumberValue) {
      this.CheckContentBase = []
      var param = []
      param[0] = ['工位号', stationNumberValue]
      var Data = this.CreateData('11', '质检_基础_检查项_查询', param)
      this.ExecDatabase(Data).then(response => {
        this.CheckContentBase = response.data
        if (this.CheckContentBase.length > 0) {
          this.form_addCheckOrder_content.checkOrderContentId = response.data[0]['ID']
          this.form_editCheckOrder_content.checkOrderContentId = response.data[0]['ID']
          this.form_addCheckOrder_content.checkOrderContent = response.data[0]['检查内容']
          this.form_editCheckOrder_content.checkOrderContent = response.data[0]['检查内容']
        } else {
          this.form_addCheckOrder_content.checkOrderContentId = ''
          this.form_editCheckOrder_content.checkOrderContentId = ''
          this.form_addCheckOrder_content.checkOrderContent = ''
          this.form_editCheckOrder_content.checkOrderContent = ''
        }
      }).catch(er => {
        this.$message.error('错误')
      })
    },
    searchCheckToolBase() {
      this.CheckToolBase = []
      var param = []
      var Data = this.CreateData('11', '质检_基础_检查工具_查询', param)
      this.ExecDatabase(Data).then(response => {
        this.CheckToolBase = response.data
        if (this.CheckToolBase.length > 0) {
          this.form_addCheckOrder_content.checkOrderToolId = response.data[0]['ID']
        } else {
          this.form_addCheckOrder_content.checkOrderToolId = ''
        }
      }).catch(er => {
        this.listLoading2 = false
        this.$message.error('错误')
      })
    },
    searchCheckMethodBase() {
      this.CheckMethodBase = []
      var param = []
      var Data = this.CreateData('11', '质检_基础_检查方法_查询', param)
      this.ExecDatabase(Data).then(response => {
        this.CheckMethodBase = response.data
        if (this.CheckMethodBase.length > 0) {
          this.form_addCheckOrder_content.checkOrderMethodId = response.data[0]['ID']
        } else {
          this.form_addCheckOrder_content.checkOrderMethodId = ''
        }
      }).catch(er => {
        this.$message.error('错误')
      })
    },
    // endregion
    // region 质检工单详细信息维护
    fetchData_content(row) {
      var param = []
      param[0] = ['质检单号', row.质检单号]
      var Data = this.CreateData('11', '质检_工单检查内容_查询', param)
      this.ExecDatabase(Data).then(response => {
        this.tableData_content = response.data
        this.tableData_content.push({
          ID: ''
        })
      }).catch(er => {
        this.$message.error('错误')
      })
    },
    addCheckOrder_content() {
      this.dialogFormVisible_addCheckOrder_content = true
      this.form_addCheckOrder_content.checkOrderName = this.currentSelectCheckOrder['质检单名称']
      this.form_addCheckOrder_content.checkOrderCode = this.currentSelectCheckOrder['质检单号']
    },
    addCheckOrder_content_sure(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var param = []
          param[0] = ['质检单号', this.form_addCheckOrder_content.checkOrderCode]
          param[1] = ['原始备注', this.form_addCheckOrder_content.checkOrderRemarks]
          param[2] = ['检查项id', this.form_addCheckOrder_content.checkOrderContentId]
          param[3] = ['检查工具id', this.form_addCheckOrder_content.checkOrderToolId]
          param[4] = ['检查方法id', this.form_addCheckOrder_content.checkOrderMethodId]
          var Data = this.CreateData('12', '质检_工单检查内容_新增', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '增加成功',
                type: 'success'
              })
              this.dialogFormVisible_addCheckOrder_content = false
              this.fetchData_content(this.currentSelectCheckOrder)
            } else {
              this.$message.error('增加失败！')
            }
          })
        } else {
          return false
        }
      })
    },
    addCheckOrder_content_cancel(formName) {
      this.dialogFormVisible_addCheckOrder_content = false
      this.$refs[formName].resetFields()
    },
    editCheckOrder_content(row) {
      this.dialogFormVisible_editCheckOrder_content = true
      this.searchCheckContentBase(row.工位号)
      this.form_editCheckOrder_content.checkOrderRemarks = row.原始备注
      this.form_editCheckOrder_content.checkOrderName = this.currentSelectCheckOrder['质检单名称']
      this.form_editCheckOrder_content.checkOrderCode = this.currentSelectCheckOrder['质检单号']
      this.form_editCheckOrder_content.stationNumberValue = row.工位号
      this.form_editCheckOrder_content.checkOrderContentId = row.检查项id
      this.form_editCheckOrder_content.checkOrderContent = row.检查内容
      this.form_editCheckOrder_content.checkOrderToolId = row.检查工具id
      this.form_editCheckOrder_content.checkOrderMethodId = row.检查方法id
      this.form_editCheckOrder_content.ID = row.ID
    },
    editCheckOrder_content_sure(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var param = []
          param[0] = ['质检单号', this.form_editCheckOrder_content.checkOrderCode]
          param[1] = ['原始备注', this.form_editCheckOrder_content.checkOrderRemarks]
          param[2] = ['检查项id', this.form_editCheckOrder_content.checkOrderContentId]
          param[3] = ['检查工具id', this.form_editCheckOrder_content.checkOrderToolId]
          param[4] = ['检查方法id', this.form_editCheckOrder_content.checkOrderMethodId]
          param[5] = ['ID', this.form_editCheckOrder_content.ID]
          var Data = this.CreateData('12', '质检_工单检查内容_编辑', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '编辑成功！',
                type: 'success'
              })
              this.dialogFormVisible_editCheckOrder_content = false
              this.fetchData_content(this.currentSelectCheckOrder)
            } else {
              this.$message.error('编辑失败！')
            }
          })
        } else {
          return false
        }
      })
    },
    editCheckOrder_content_cancel(formName) {
      this.dialogFormVisible_editCheckOrder_content = false
      this.$refs[formName].resetFields()
    },
    deleteCheckOrder_content(row) {
      this.$confirm('此操作将永久删除该行, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var param = []
        param[0] = ['ID', row.ID]
        var Data = this.CreateData('12', '质检_工单检查内容_删除', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result === '1') {
            this.$message({
              message: '质检单检查项删除成功',
              type: 'success'
            })
            this.dialogFormVisible_editCheckOrder_content = false
            this.fetchData_content(this.currentSelectCheckOrder)
          } else {
            this.$message.error('质检单检查项删除失败！')
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // endregion
    // region 质检项维护
    searchTableCheckContentBase() {
      this.listLoading1 = true
      this.tableDataCheckContentBase = []
      var param = []
      param[0] = ['工位号', this.stationNumberValue]
      var Data = this.CreateData('11', '质检_基础_检查项_查询', param)
      this.ExecDatabase(Data).then(response => {
        this.tableDataCheckContentBase = response.data
        this.listLoading1 = false
      }).catch(er => {
        this.listLoading1 = false
        this.$message.error('错误')
      })
    },
    addCheckContentBase() {
      this.dialogFormVisible_addCheckContentBase = true
      this.form_addCheckContentBase.stationNumberValue = ''
      this.form_addCheckContentBase.checkItem = ''
      this.form_addCheckContentBase.checkItemContent = ''
      this.form_addCheckContentBase.standardValue = ''
      this.form_addCheckContentBase.maximumValue = ''
      this.form_addCheckContentBase.minimumValue = ''
      this.form_addCheckContentBase.unit = ''
    },
    addCheckContentBase_sure(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var param = []
          param[0] = ['工位号', this.form_addCheckContentBase.stationNumberValue]
          param[1] = ['检查项目', this.form_addCheckContentBase.checkItem]
          param[2] = ['检查内容', this.form_addCheckContentBase.checkItemContent]
          param[3] = ['标准值', this.form_addCheckContentBase.standardValue]
          param[4] = ['上限', this.form_addCheckContentBase.maximumValue]
          param[5] = ['下限', this.form_addCheckContentBase.minimumValue]
          param[6] = ['单位', this.form_addCheckContentBase.unit]
          var Data = this.CreateData('12', '质检_基础_检查项_增加', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '增加成功',
                type: 'success'
              })
              this.dialogFormVisible_addCheckContentBase = false
              this.searchTableCheckContentBase()
            } else {
              this.$message.error('增加失败！')
            }
          })
        } else {
          return false
        }
      })
    },
    addCheckContentBase_cancel(formName) {
      this.dialogFormVisible_addCheckContentBase = false
      this.$refs[formName].resetFields()
    },
    editCheckContentBase(row) {
      this.dialogFormVisible_editCheckContentBase = true
      this.form_editCheckContentBase.stationNumberValue = row.工位号
      this.form_editCheckContentBase.checkItem = row.检查项目
      this.form_editCheckContentBase.checkItemContent = row.检查内容
      this.form_editCheckContentBase.standardValue = row.标准值
      this.form_editCheckContentBase.maximumValue = row.上限
      this.form_editCheckContentBase.minimumValue = row.下限
      this.form_editCheckContentBase.unit = row.单位
      this.form_editCheckContentBase.ID = row.ID
    },
    editCheckContentBase_sure(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var param = []
          param[0] = ['工位号', this.form_editCheckContentBase.stationNumberValue]
          param[1] = ['检查项目', this.form_editCheckContentBase.checkItem]
          param[2] = ['检查内容', this.form_editCheckContentBase.checkItemContent]
          param[3] = ['标准值', this.form_editCheckContentBase.standardValue]
          param[4] = ['上限', this.form_editCheckContentBase.maximumValue]
          param[5] = ['下限', this.form_editCheckContentBase.minimumValue]
          param[6] = ['单位', this.form_editCheckContentBase.unit]
          param[7] = ['ID', this.form_editCheckContentBase.ID]
          var Data = this.CreateData('12', '质检_基础_检查项_编辑', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '编辑成功！',
                type: 'success'
              })
              this.dialogFormVisible_editCheckContentBase = false
              this.searchTableCheckContentBase()
            } else {
              this.$message.error('编辑失败！')
            }
          })
        } else {
          return false
        }
      })
    },
    editCheckContentBase_cancel(formName) {
      this.dialogFormVisible_editCheckContentBase = false
      this.$refs[formName].resetFields()
    },
    deleteCheckContentBase(row) {
      this.$confirm('此操作将永久删除该行, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var param = []
        param[0] = ['ID', row.ID]
        var Data = this.CreateData('12', '质检_基础_检查项_删除', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result === '1') {
            this.$message({
              message: '检查项删除成功',
              type: 'success'
            })
            this.searchTableCheckContentBase()
          } else {
            this.$message.error('检查项删除失败！')
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // endregion
    // region 质检工具维护
    searchTableCheckToolBase() {
      this.listLoading2 = true
      this.tableDataCheckToolBase = []
      var param = []
      var Data = this.CreateData('11', '质检_基础_检查工具_查询', param)
      this.ExecDatabase(Data).then(response => {
        this.tableDataCheckToolBase = response.data
        this.listLoading2 = false
      }).catch(er => {
        this.listLoading2 = false
        this.$message.error('错误')
      })
    },
    addCheckToolBase() {
      this.dialogFormVisible_addCheckToolBase = true
      this.form_addCheckToolBase.toolName = ''
    },
    addCheckToolBase_sure(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var param = []
          param[0] = ['检查工具名称', this.form_addCheckToolBase.toolName]
          var Data = this.CreateData('12', '质检_基础_检查工具_增加', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '增加成功',
                type: 'success'
              })
              this.dialogFormVisible_addCheckToolBase = false
              this.searchTableCheckToolBase()
            } else {
              this.$message.error('增加失败！')
            }
          })
        } else {
          return false
        }
      })
    },
    addCheckToolBase_cancel(formName) {
      this.dialogFormVisible_addCheckToolBase = false
      this.$refs[formName].resetFields()
    },
    editCheckToolBase(row) {
      this.dialogFormVisible_editCheckToolBase = true
      this.form_editCheckToolBase.toolName = row.检查方法名称
      this.form_editCheckToolBase.ID = row.ID
    },
    editCheckToolBase_sure(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var param = []
          param[0] = ['检查工具名称', this.form_editCheckToolBase.toolName]
          param[1] = ['ID', this.form_editCheckToolBase.ID]
          var Data = this.CreateData('12', '质检_基础_检查工具_修改', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '编辑成功！',
                type: 'success'
              })
              this.dialogFormVisible_editCheckToolBase = false
              this.searchTableCheckToolBase()
            } else {
              this.$message.error('编辑失败！')
            }
          })
        } else {
          return false
        }
      })
    },
    editCheckToolBase_cancel(formName) {
      this.dialogFormVisible_editCheckToolBase = false
      this.$refs[formName].resetFields()
    },
    deleteCheckToolBase(row) {
      this.$confirm('此操作将永久删除该行, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var param = []
        param[0] = ['ID', row.ID]
        var Data = this.CreateData('12', '质检_基础_检查工具_删除', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result === '1') {
            this.$message({
              message: '检查工具删除成功',
              type: 'success'
            })
            this.searchTableCheckToolBase()
          } else {
            this.$message.error('检查工具删除失败！')
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // endregion
    // region 质检方法维护
    searchTableCheckMethodBase() {
      this.listLoading3 = true
      this.tableDataCheckMethodBase = []
      var param = []
      var Data = this.CreateData('11', '质检_基础_检查方法_查询', param)
      this.ExecDatabase(Data).then(response => {
        this.tableDataCheckMethodBase = response.data
        this.listLoading3 = false
      }).catch(er => {
        this.listLoading3 = false
        this.$message.error('错误')
      })
    },
    addCheckMethodBase() {
      this.dialogFormVisible_addCheckMethodBase = true
      this.form_addCheckMethodBase.methodName = ''
    },
    addCheckMethodBase_sure(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var param = []
          param[0] = ['检查方法名称', this.form_addCheckMethodBase.methodName]
          var Data = this.CreateData('12', '质检_基础_检查方法_增加', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '增加成功',
                type: 'success'
              })
              this.dialogFormVisible_addCheckMethodBase = false
              this.searchTableCheckMethodBase()
            } else {
              this.$message.error('增加失败！')
            }
          })
        } else {
          return false
        }
      })
    },
    addCheckMethodBase_cancel(formName) {
      this.dialogFormVisible_addCheckMethodBase = false
      this.$refs[formName].resetFields()
    },
    editCheckMethodBase(row) {
      this.dialogFormVisible_editCheckMethodBase = true
      this.form_editCheckMethodBase.methodName = row.检查方法名称
      this.form_editCheckMethodBase.ID = row.ID
    },
    editCheckMethodBase_sure(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var param = []
          param[0] = ['检查方法名称', this.form_editCheckMethodBase.methodName]
          param[1] = ['ID', this.form_editCheckMethodBase.ID]
          var Data = this.CreateData('12', '质检_基础_检查方法_修改', param)
          this.ExecDatabase(Data).then(response => {
            if (response.data[0].result === '1') {
              this.$message({
                message: '编辑成功！',
                type: 'success'
              })
              this.dialogFormVisible_editCheckMethodBase = false
              this.searchTableCheckMethodBase()
            } else {
              this.$message.error('编辑失败！')
            }
          })
        } else {
          return false
        }
      })
    },
    editCheckMethodBase_cancel(formName) {
      this.dialogFormVisible_editCheckMethodBase = false
      this.$refs[formName].resetFields()
    },
    deleteCheckMethodBase(row) {
      this.$confirm('此操作将永久删除该行, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var param = []
        param[0] = ['ID', row.ID]
        var Data = this.CreateData('12', '质检_基础_检查方法_删除', param)
        this.ExecDatabase(Data).then(response => {
          if (response.data[0].result === '1') {
            this.$message({
              message: '检查方法删除成功',
              type: 'success'
            })
            this.searchTableCheckMethodBase()
          } else {
            this.$message.error('检查方法删除失败！')
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // endregion
    // 分页功能改变显示数量
    handleSizeChange(val) {
      this.pageSize = val
      this.fetchData()
    },
    // 分页功能改变当前页
    handleCurrentChange(val) {
      this.pageCurrent = val
      this.fetchData()
    },
    // 导出excel
    handleDownload() {
      this.downloadLoading = true
      // const tHeader = ['呼叫类型名称', '呼叫原因名称', '呼叫原因名称_二级', '工位名称', '处理状态代码', '发动机流水号', '呼叫备注', '呼叫人员呼叫时间']
      // const filterVal = ['呼叫类型名称', '呼叫原因名称', '呼叫原因名称_二级', '工位名称', '处理状态代码', '发动机流水号', '呼叫备注', '呼叫人员呼叫时间']
      // const list = this.tableData_excel
      var s = ``
      if (this.startTime && this.endTime) {
        s = ` where  操作时间>='${this.startTime}' and 操作时间<='${this.endTime}'`
      }
      request({
        url: '',
        method: 'post',
        data: {
          type: '3',
          name: `  select * from [报警数据_大柴]` + s
        }
      }).then(response => {
        this.tableData_excel = []
        if (response.data.length !== 0) {
          this.tableData_excel = response.data
          this.downloadLoading = true
            import('@/vendor/Export2Excel').then(excel => {
              const tHeader = ['报警类型', '工位名称', '处理状态', '报警开始时间', '报警结束时间', '操作时间']
              const filterVal = ['测量项目', '工位号', '信号值', '报警开始时间', '报警结束时间', '操作时间']
              const list = this.tableData_excel
              const data = this.formatJson(filterVal, list)
              excel.export_json_to_excel({
                header: tHeader,
                data,
                filename: '报警统计表',
                autoWidth: this.autoWidth,
                bookType: this.bookType
              })
              this.downloadLoading = false
            })
        } else {
          this.$message.error('无数据无法导出')
        }
      })
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => {
        return v[j]
      }))
    },
    // 获取图形数据
    drawLine(res) {
      const myChart = this.$echarts.init(document.getElementById('myChart'))
      const myChart2 = this.$echarts.init(document.getElementById('myChart2'))
      const xData = []
      const yData = []
      const series = []
      for (let i = 0; i < res.length; i++) {
        xData.push(res[i].测量项目)
      }
      for (let i = 0; i < res.length; i++) {
        yData.push(res[i].次数)
      }
      for (let i = 0; i < res.length; i++) {
        series.push({
          value: res[i].次数,
          name: res[i].测量项目
        })
      }
      // 随机颜色方式
      var colorList = []
      for (var i = 0; i < res.length; i++) {
        var colorStr = Math.floor(Math.random() * 0xffffff).toString(16)
        // 如果颜色值是五位，则补零
        if (colorStr.length < 6) {
          colorStr += '0'
        }
        if (colorStr === '005094') {
          i--
          continue
        }
        colorList.push('#' + colorStr)
      }
      this.colorchart = colorList
      // colorList = ['#C33531','#EFE42A','#64BD3D','#EE9201','#29AAE3', '#B74AE5','#0AAF9F','#E89589','#16A085','#4A235A','#C39BD3 ','#F9E79F','#BA4A00','#ECF0F1','#616A6B','#EAF2F8','#4A235A','#3498DB' ];
      myChart.clear()
      myChart.setOption({
        // color: ['#3398DB'],
        title: {
          left: 'center',
          text: '报警分类统计'
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: { // 坐标轴指示器，坐标轴触发有效
            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
          }
        },
        grid: {
          left: '3%',
          right: '12%',
          bottom: '3%',
          containLabel: true,
          show: true
        },
        xAxis: [
          {
            name: '报警类型',
            type: 'category',
            data: xData,
            axisTick: {
              alignWithLabel: true
            },
            axisLabel: {
              interval: 0,
              rotate: 30
            }
          }
        ],
        yAxis: [
          {
            name: '报警次数',
            type: 'value'
          }
        ],
        series: [
          {
            name: '报警次数',
            type: 'bar',
            barWidth: '60%',
            data: yData,
            itemStyle: {
              normal: {
                // 随机显示
                // 定制显示（按顺序）
                color: function(params) {
                  // colorList = colorList
                  return colorList[params.dataIndex]
                },
                label: {
                  show: true,		// 开启显示
                  position: 'top',	// 在上方显示
                  textStyle: { // 数值样式
                    color: 'black',
                    fontSize: 16
                  }
                }
              }
            }
          }
        ]
      })

      myChart2.clear()
      myChart2.setOption({
        title: {
          text: '报警类型比例',
          // subtext: '分类统计',
          x: 'center'
        },
        tooltip: {
          trigger: 'item',
          formatter: '{a} <br/>{b} : {c} ({d}%)'
        },
        legend: {
          orient: 'vertical',
          left: 'left',
          data: xData
        },
        series: [
          {
            name: '报警类型',
            type: 'pie',
            radius: '55%',
            center: ['50%', '60%'],
            data: series,
            itemStyle: {
              emphasis: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
              },
              normal: {
                label: {
                  show: true,
                  formatter: '{b} : {c} ({d}%)'
                },
                labelLine: { show: true },
                // 随机显示
                // 定制显示（按顺序）
                color: function(params) {
                  // colorList = colorList
                  return colorList[params.dataIndex]
                }
              }
            }
          }
        ]
      })
    },
    searchChart() {
      var s = ``
      if (this.startTime && this.endTime) {
        s = ` where  操作时间>='${this.startTime}' and 操作时间<='${this.endTime}'`
      }
      request({
        url: '',
        method: 'post',
        data: {
          type: '3',
          name: `  select 测量项目 ,COUNT(测量项目) as 次数 from 报警数据_大柴 ` + s + `group by  测量项目  order by 次数 desc`
        }
      }).then(response => {
        this.drawLine(response.data)
      }).catch(er => {
      }
      )
    },
    searchChart2() {
      request({
        url: '',
        method: 'post',
        data: {
          type: '3',
          name: ` SELECT 呼叫类型代码,[呼叫类型名称],SUM(停台时间 ) as 停台时间
FROM dbo.安东_安东呼叫详情_主记录_视图
where  三级人员呼叫时间>='${this.startTime}' and 三级人员呼叫时间<='${this.endTime}'
GROUP BY
呼叫类型代码
,[呼叫类型名称] order by 停台时间 desc  `
        }
      }).then(response => {
        this.drawLine2(response.data)
      }).catch(er => {
      }
      )
    },
    drawLine2(res) {
      const myChart3 = this.$echarts.init(document.getElementById('myChart3'))
      const myChart4 = this.$echarts.init(document.getElementById('myChart4'))
      const xData = []
      const yData = []
      const series = []
      for (let i = 0; i < res.length; i++) {
        xData.push(res[i].呼叫类型名称)
      }
      for (let i = 0; i < res.length; i++) {
        yData.push(res[i].停台时间)
      }
      for (let i = 0; i < res.length; i++) {
        series.push({
          value: res[i].停台时间,
          name: res[i].呼叫类型名称
        })
      }
      // 随机颜色方式
      var colorList = []
      for (var i = 0; i < res.length; i++) {
        var colorStr = Math.floor(Math.random() * 0xffffff).toString(16)
        // 如果颜色值是五位，则补零
        if (colorStr.length < 6) {
          colorStr += '0'
        }
        if (colorStr === '005094') {
          i--
          continue
        }
        colorList.push('#' + colorStr)
      }
      // colorList = ['#C33531','#EFE42A','#64BD3D','#EE9201','#29AAE3', '#B74AE5','#0AAF9F','#E89589','#16A085','#4A235A','#C39BD3 ','#F9E79F','#BA4A00','#ECF0F1','#616A6B','#EAF2F8','#4A235A','#3498DB' ];
      myChart3.clear()
      myChart3.setOption({
        // color: ['#3398DB'],
        title: {
          left: 'center',
          text: '条形统计图'
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: { // 坐标轴指示器，坐标轴触发有效
            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
          }
        },
        grid: {
          left: '3%',
          right: '12%',
          bottom: '3%',
          containLabel: true,
          show: true
        },
        xAxis: [
          {
            name: '呼叫类型',
            type: 'category',
            data: xData,
            axisTick: {
              alignWithLabel: true
            }
          }
        ],
        yAxis: [
          {
            name: '停台时间',
            type: 'value'
          }
        ],
        series: [
          {
            name: '停台时间',
            type: 'bar',
            barWidth: '60%',
            data: yData,
            itemStyle: {
              normal: {
                // 随机显示
                // 定制显示（按顺序）
                color: function(params) {
                  // colorList = colorList
                  return colorList[params.dataIndex]
                },
                label: {
                  show: true,		// 开启显示
                  position: 'top',	// 在上方显示
                  textStyle: { // 数值样式
                    color: 'black',
                    fontSize: 16
                  }
                }
              }
            }
          }
        ]
      })

      myChart4.clear()
      myChart4.setOption({
        title: {
          text: '分类统计',
          // subtext: '分类统计',
          x: 'center'
        },
        tooltip: {
          trigger: 'item',
          formatter: '{a} <br/>{b} : {c} ({d}%)'
        },
        legend: {
          orient: 'vertical',
          left: 'left',
          data: xData
        },
        series: [
          {
            name: '呼叫类型',
            type: 'pie',
            radius: '55%',
            center: ['50%', '60%'],
            data: series,
            itemStyle: {
              emphasis: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
              },
              normal: {
                // 随机显示
                // 定制显示（按顺序）
                color: function(params) {
                  // colorList = colorList
                  return colorList[params.dataIndex]
                }
              }
            }
          }
        ]
      })
    }
  }
}
</script>

<style scoped>
  span{
    /*margin: 10px 0px 10px 10px;*/
  }
  .el-table .warning-row{

  }
  .el-table .warning-row {
       background: #a94442;
     }
  .el-table .sucess-row {
    background: #f0f9eb;
  }
  .el-table td, .is-leaf{
    background-color: rgb(255, 91, 103);
    color: black;
    font-weight:400
  }
</style>

