soc_web/src/views/system/dept/extend.vue

<template>
  <div class="app-container">
    <div class="org-extend">
      <div class="extend_mod">
        <div class="info-box">
          <el-descriptions class="margin-top" :column="3" size="medium" border>
            <template #title>
              <h3 class="title">
                <i class="el-icon-collection-tag"></i>
                基础信息
              </h3>
            </template>
            <el-descriptions-item
              v-for="v in dataInfo"
              :label="v.label"
              :key="v.key"
              labelClassName="gx_info_label"
            >{{ v.value }}
            </el-descriptions-item
            >
            <el-descriptions-item labelClassName="gx_info_label" label="机构组织类型" v-if="false">{{
              getLabel(dict.type.reality_org_type, orgType)
              }}
            </el-descriptions-item>
            <el-descriptions-item labelClassName="gx_info_label" label="是否停用">{{
              isLock == 1 ? "是" : "否"
              }}
            </el-descriptions-item>
            <el-descriptions-item labelClassName="gx_info_label" label="机构类型">{{
              getLabel(dict.type.sys_org_type, type)
              }}
            </el-descriptions-item>
          </el-descriptions>
        </div>
      </div>
      <div class="extend_mod ">
        <div class="info-box">
          <h3 class="title">
            <i class="el-icon-collection-tag"></i>
            安全防范设施建设达标信息
            <el-button style="float: right;" @click="handleOrgAdd" type="primary" icon="el-icon-plus" size="small">
              新增
            </el-button>
          </h3>

          <el-table
            border
            size="small"
            style="width: 98%;margin-top: 20px"
            v-loading="orgloading"
            :data="constructionList"
            @selection-change="handleOrgSelectionChange"
          >
            <el-table-column
              type="selection"
              width=""
              align="center"
              v-if="false"
            />
            <el-table-column type="index" width="70" label="序号" align="center"/>
            <el-table-column label="机构类型" align="center" prop="type">
              <template v-slot="scope">
                <dict-tag
                  :options="dict.type.org_extend_type"
                  :value="scope.row.type"
                />
              </template>
            </el-table-column>
            <el-table-column label="GA38标准" align="center" prop="standard">
              <template slot-scope="r"
              >{{ getLabel(dict.type.org_extend_standard, `${r.row.standard}`) }}
              </template>
            </el-table-column>
            <el-table-column
              label="达标日期/计划达标日期"
              align="center"
              prop="dateOfCompliance"
              width="220"
            >
              <template slot-scope="scope">
                <span> {{  scope.row.standard === '3'  ? formatTime(scope.row.dateOfComplete, "YYYY-MM-DD") : formatTime(scope.row.dateOfCompliance, "YYYY-MM-DD") }}</span>
              </template>
            </el-table-column>

            <el-table-column v-if="false"
              label="备注"
              align="center"
              prop="reason"
              width="280"
            >
            </el-table-column>

            <el-table-column
              v-if="false"
              label="机构id"
              align="center"
              prop="orgId"
            />
            <el-table-column
              label="操作"
              align="center"
              class-name="small-padding fixed-width"
            >
              <template slot-scope="scope">
                <el-button
                  v-if="scope.row.certificate"
                  size="mini"
                  type="text"
                  icon="el-icon-search"
                  @click="downBusiness(scope.row.certificate)"
                >查看证书
                </el-button
                >
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit-outline"
                  @click="handleOrgUpdate(scope.row)"
                >编辑
                </el-button
                >
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  @click="handleOrgDelete(scope.row)"
                >删除
                </el-button
                >
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
      <!--补充信息-------------------------------------------------------------------------------------------------------------------------------------->
      <div class="extend_mod ">
        <div class="info-box">
          <h3 class="title">
            <i class="el-icon-collection-tag"></i>
            补充信息
          </h3>
        </div>
        <!--监控中心的补充信息-->
        <div class="info-box">
          <el-descriptions class="margin-top" :column="3" size="medium" border>

            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="行政区域气象">
              <el-cascader
                clearable
                v-model="weatherAreaCode"
                :options="areaList"
                @change="selectArea"
                placeholder="请选择行政区域气象"
              ></el-cascader>
            </el-descriptions-item>
            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="产权类型">
              <el-select
                clearable
                v-model="ownership"
                placeholder="请选择产权类型"
              >
                <el-option
                  v-for="dict in dict.type.property_situation"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-descriptions-item>
            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="所在位置">
              <el-select
                clearable
                v-model="outsideArea"
                placeholder="请选择所在位置"
              >
                <el-option
                  v-for="dict in dict.type.org_extend_is"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="是否设立在行式自助银行">
              <el-radio-group v-model="selfServiceBank">
                <el-radio :label="1">是</el-radio>
                <el-radio :label="0">否</el-radio>
              </el-radio-group>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.yewd || type === org_type.lhzz" labelClassName="gx_info_label" label="大堂式设备">
              <el-input-number
                v-model="lobbyEquipment"
                controls-position="right"
                @change="handleChange"
                :min="0"
                :max="999"
              ></el-input-number>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.yewd || type === org_type.lhzz" labelClassName="gx_info_label" label="穿墙式设备">
              <el-input-number
                v-model="wallPenetratingEquipment"
                controls-position="right"
                @change="handleChange"
                :min="0"
                :max="999"
              ></el-input-number>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="是否设立保管箱库">
              <el-radio-group v-model="safeBox">
                <el-radio :label="1">是</el-radio>
                <el-radio :label="0">否</el-radio>
              </el-radio-group>
            </el-descriptions-item>


            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="是否设立网点业务库">
              <el-radio-group v-model="businessLibrary">
                <el-radio :label="1">是</el-radio>
                <el-radio :label="0">否</el-radio>
              </el-radio-group>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="业务库类型">
              <el-select
                clearable
                v-model="businessLibraryType"
                placeholder="请选择业务库类型"
              >
                <el-option
                  v-for="dict in dict.type.business_library_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="夜间值守方式">
              <el-select
                clearable
                v-model="dutyMode"
                placeholder="请选择夜间值守方式"
              >
                <el-option
                  v-for="dict in dict.type.duty_options"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="是否配备保安人员">
              <el-radio-group v-model="askari">
                <el-radio :label="1">是</el-radio>
                <el-radio :label="0">否</el-radio>
              </el-radio-group>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="内部保安人数">
              <el-input-number
                v-model="innerCount"
                controls-position="right"
                @change="handleChange"
                :min="0"
                :max="999"
              ></el-input-number>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="外聘保安人数">
              <el-input-number
                v-model="outsideCount"
                controls-position="right"
                @change="handleChange"
                :min="0"
                :max="999"
              ></el-input-number>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.jkzx" labelClassName="gx_info_label" label="建设时间">
              <el-date-picker
                clearable
                v-model="constructionTime"
                type="date"
                value-format="yyyy-MM-dd HH:mm:ss"
                placeholder="请选择建设时间"
              >
              </el-date-picker>
            </el-descriptions-item>
            <el-descriptions-item v-if="type === org_type.jkzx" labelClassName="gx_info_label" label="最近一次改造时间">
              <el-date-picker
                clearable
                v-model="constructionTime"
                type="date"
                value-format="yyyy-MM-dd HH:mm:ss"
                placeholder="请选择建设时间"
              >
              </el-date-picker>
            </el-descriptions-item>
            <el-descriptions-item v-if="type === org_type.jkzx" labelClassName="gx_info_label" label="系统平台品牌">
              <el-select
                clearable
                v-model="platformBrand"
                placeholder="请选择系统平台品牌"
              >
                <el-option
                  v-for="dict in dict.type.org_platform_brand"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.jkzx || type === org_type.yewd|| type === org_type.lhzz" labelClassName="gx_info_label" label="出入口远程控制与授权">
              <el-radio-group v-model="remoteControl">
                <el-radio :label="1">是</el-radio>
                <el-radio :label="0">否</el-radio>
              </el-radio-group>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.jkzx || type === org_type.yewd" labelClassName="gx_info_label" label="业务库防控隔离门出入口数量">
              <el-input-number
                v-model="remoteCount"
                controls-position="right"
                @change="handleChange"
                :min="0"
                :max="999"
              ></el-input-number>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.jkzx || type === org_type.lhzz" labelClassName="gx_info_label" label="离行式加钞间出入口数量">
              <el-input-number
                v-model="cashAddingRoom"
                controls-position="right"
                @change="handleChange"
                :min="0"
                :max="999"
              ></el-input-number>
            </el-descriptions-item>

            <el-descriptions-item v-if="type === org_type.yewd" labelClassName="gx_info_label" label="上传保安证">
              <image-upload
                :limit="5"
                :value="askariCertificate"
                @input="getImgUrl"
              ></image-upload>
            </el-descriptions-item>


          </el-descriptions>
        </div>
      </div>



      <div style="
      line-height: 50px;
      width: 100%;
      height: 55px;
      text-align: center;
      background: #ffffff;
      z-index: 9999;">
        <el-button type="primary" @click="saveExtend"
        >提交
        </el-button
        >
        <el-button type="primary" @click="nosaveExtend"
        >取消
        </el-button
        >
      </div>
    </div>
    <DialogCom
      :title="orgtitle"
      :visible.sync="orgopen"
      width="500px"
      append-to-body
    >
      <el-form
        ref="orgform"
        :model="orgform"
        label-width="130px"
        :rules="rules"
      >
        <el-form-item label="机构类型" prop="type">
          <el-select
            prop="type"
            label="机构类型"
            v-model="orgform.type"
            placeholder="请选择机构类型"
            clearable
          >
            <el-option
              v-for="dict in dict.type.org_extend_type"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
        </el-form-item>

        <el-form-item label="GA38标准" prop="standard">
          <el-select
            prop="planType"
            label="标准"
            v-model="orgform.standard"
            placeholder="请选择标准"
            clearable
          >
            <el-option
              v-for="dict in dict.type.org_extend_standard"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item v-show="orgform.standard === '2' || orgform.standard === '1'" label="达标日期" prop="dateOfCompliance">
          <el-date-picker
            clearable
            v-model="orgform.dateOfCompliance"
            type="date"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="请选择达标日期"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item v-show="orgform.standard === '3'" label="计划达标日期" >
          <el-date-picker
            clearable
            v-model="orgform.dateOfComplete"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="请选择计划达标日期"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item v-show="orgform.standard === '3'" label="未达标原因" >
          <el-input type="textarea" rows="5" v-model="orgform.reason" placeholder="请输入未达标原因"/>
        </el-form-item>

        <el-form-item label="上传证书" v-show="orgform.standard !== '3'" prop="certificate">
          <div class="image-container" style="margin-left: 20px">
            <p style="font-size: 12px; color: #999">上传安全防范设施合格证</p>
            <image-upload
              :limit="5"
              :value="orgform.certificate"
              @input="uploadorgSuccess"
            ></image-upload>
          </div>
        </el-form-item>
        <el-form-item v-if="false" label="机构id" prop="orgId">
          <el-input v-model="orgform.orgId" placeholder="请输入机构id"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitOrgForm">确 定</el-button>
        <el-button @click="orgcancel">取 消</el-button>
      </div>
    </DialogCom>
    <div slot="footer" class="dialog-footer" style="height: 50px"></div>
    <el-image-viewer
      v-if="imageViewer"
      :on-close="closeImgViewer"
      :url-list="srcList"
    />
  </div>
</template>

<script>
  import uploadpng from "@/assets/images/upload.png";
  import uplpng from "@/assets/images/upl.png";
  import request from "@/utils/request";
  import {statusOptions, getLabel} from "./../../commonOption";
  import {
    listExtend,
    getExtend,
    addExtend,
    updateExtend,
    delExtend,
    getExtendByOrgId,
    uploadFile,
  } from "@/api/system/extend";

  import {
    listDept,
    getDept,
    delDept,
    addDept,
    updateDept,
    listDeptExcludeChild,
  } from "@/api/system/dept";

  import {
    listOrgPhysicalDefenseConstruction,
    getOrgPhysicalDefenseConstruction,
    addOrgPhysicalDefenseConstruction,
    updateOrgPhysicalDefenseConstruction,
    delOrgPhysicalDefenseConstruction,
  } from "@/api/system/OrgPhysicalDefenseConstruction";
  import {selectCityInfoVoList} from "@/api/core/weather";
  import TreeNodeDialogVue from "../../tool/build/TreeNodeDialog.vue";

  export default {
    dicts: [
      "sys_org_type",
      "org_platform_brand",
      "org_platform_supplier_brand",
      "org_extend_type",
      "business_library_type",
      "reality_org_type",
      "org_extend_standard",
      "org_extend_business_library_standard",
      "org_extend_self_service_bank_standard",
      "org_extend_detached_standard",
      "org_extend_is",
      "property_situation",
      "duty_options",
    ],
    props: [],
    components: {
      "el-image-viewer": () =>
        import("element-ui/packages/image/src/image-viewer"),
    },
    data() {
      let formatRule = function (rule, value, callback) {
        console.log(value, "value");
        if (!value.length) {
          callback(new Error("证书为必填项"));
        } else {
          callback();
        }
      };
      return {
        org_type:{
          jkzx: '10',
          yewd: '4',
          lhzz: '5',
        },
        reqmsg: false,
        imageViewer: false,
        //表单验证
        rules: {
          type: [{required: true, message: "请选择机构类型", trigger: "change"}],
          standard: [{required: true, message: "请输入标准", trigger: "change"}],
        },
        remoteCountoptions: [
          {label: "0", value: 0},
          {label: "1", value: 1},
          {label: "2", value: 2},
          {label: "3", value: 3},
        ],
        cashAddingRoomoptions: [
          {label: "0", value: 0},
          {label: "1", value: 1},
          {label: "2", value: 2},
          {label: "3", value: 3},
        ],
        //基础信息key
        infoKeys: [
          {label: "机构名称", key: "name"},
          {label: "机构简称", key: "shortName"},
          {label: "机构地址", key: "address"},
          {label: "排序号", key: "sort"},
          {label: "更新时间", key: "updateTime"},
          {label: "同步时间", key: "createTime"},
        ],
        innerCount: 0,
        outsideCount: 0,
        safeBox: null,
        remoteCount: 0,
        cashAddingRoom: 0,
        type: null,
        isLock: null,
        dataInfo: [],
        //机构补充信息
        extendId: null,
        orgType: 1,
        weatherAreaCode: null,
        premisesArea: null,
        ownership: null,
        outsideArea: null,
        askari: null,
        businessLibrary: 0,
        businessLibraryType: null,
        dutyMode: null,
        remoteControl: null,
        selfServiceBank: null,
        lobbyEquipment: 0,
        wallPenetratingEquipment: 0,
        platformBrand: null,
        platformSupplierBrand: null,
        constructionTime: null,
        lastUpdateTime: null,
        detachedLobbyEquipment: null,
        detachedWallPenetratingEquipment: null,
        cashAddingRoomRemoteControl: null,
        source: null,
        askariCertificate: null,
        //机构建设数据

        // 遮罩层
        orgloading: true,
        businessloading: true,
        // 选中数组
        orgids: [],
        // 选中数组
        Bankids: [],
        Businessids: [],
        // 非单个停用
        single: true,
        // 非多个停用
        multiple: true,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 机构物防建设表格数据
        constructionList: [],
        // 银行物防建设表格数据
        BankPhysicalDefenseConstructionList: [],
        detachedPhysicalDefenseConstructionList: [],
        BusinessPhysicalDefenseConstructionList: [],
        // 弹出层标题
        orgtitle: "",
        Businesstitle: "",
        // 弹出层标题
        Banktitle: "",
        detachedtitle: "",
        detachedloading: false,
        // 是否显示弹出层
        Bankopen: false,
        detachedopen: false,
        //图片预览
        openUrl: null,
        srcList: [],
        openTitle: null,
        openVisible: false,
        // 表单参数
        Bankform: {},
        detachedform: {},
        Businessform: {},
        // 是否显示弹出层
        Businessopen: false,
        orgopen: false,
        // 表单参数
        orgform: {},
        //2个图片信息
        uploadp: uploadpng,
        uplp: uplpng,
        //下拉框生成信息
        orgTypes: [
          {label: "营业网点", value: 0},
          {label: "在行式自助银行", value: 1},
          {label: "离行式自助银行", value: 2},
          {label: "中心业务库", value: 3},
          {label: "网点业务库", value: 4},
          {label: "保管箱库", value: 5},
          {label: "监控中心", value: 6},
        ],
        businessLibraryTypes: {
          businessLibraryTyp1: {label: "1类业务库", value: 1},
          businessLibraryTyp2: {label: "2类业务库", value: 2},
          businessLibraryTyp3: {label: "3类业务库", value: 3},
        },
        platformBrands: {
          platformBrand1: {label: "品牌1", value: 0},
          platformBrand2: {label: "品牌2", value: 1},
        },
        platformSupplierBrands: {
          platformSupplierBrand1: {label: "品牌1", value: 0},
          platformSupplierBrand2: {label: "品牌2", value: 1},
        },
        prop: "",
        propItem: "",

        row: "",
        areaList: [],
        imgs: [],
        Businessimgs: [],
        Bankimgs: [],
        orgimgs: [],
        detachedimgs: [],
      };
    },
    watch: {
      "detachedform.certificateEvidence"(newValue) {
        if (
          newValue === 1 &&
          this.detachedform.certificate == null &&
          this.detachedimgs.length == 0
        ) {
          this.reqmsg = true;
        }
        if (newValue === 0) {
          this.reqmsg = false;
        }
      },
      "Bankform.certificateEvidence"(newValue) {
        // console.log(this.Bankimgs.length,"this.imgs")
        // console.log(this.Bankform.certificate,"Bankform.certificate")
        if (
          newValue === 1 &&
          this.Bankform.certificate == null &&
          this.Bankimgs.length == 0
        ) {
          this.reqmsg = true;
        }
        if (newValue === 0) {
          this.reqmsg = false;
        }
      },
      "Businessform.certificateEvidence"(newValue) {
        if (
          newValue === 1 &&
          this.Businessform.certificate == null &&
          this.Businessimgs.length === 0
        ) {
          this.reqmsg = true;
        }
        if (newValue === 0) {
          this.reqmsg = false;
        }
      },
      "orgform.certificateEvidence"(newValue) {
        if (
          newValue === 1 &&
          this.orgform.certificate == null &&
          this.orgimgs.length === 0
        ) {
          this.reqmsg = true;
        }
        if (newValue === 0) {
          this.reqmsg = false;
        }
      },
    },
    computed: {
      getLabels() {
        return function (value) {
          const option = this.orgTypes.filter((item) => item.value == value);
          // console.log(option[0].label,"option")
          return option ? option[0].label : "";
        };
      },
      switchModel: {
        get() {
          return this.switchValue === 1; // 将0转换为false，1转换为true
        },
        set(value) {
          this.switchValue = value ? 1 : 0; // 将false转换为0，true转换为1
        },
      },
    },
    created() {
      this.getOrgInfo();
      this.getExtendInfo();
      this.getOrgPhysicalDefenseConstructionInfo();
      this.getBankPhysicalDefenseConstructionInfo();
      this.getBusinessPhysicalDefenseConstructionInfo();
      this.getdetachedPhysicalDefenseConstructionInfo();
      this.getAreaList();
    },
    mounted() {
    },
    methods: {
      closeImgViewer() {
        this.imageViewer = false;
        this.srcList = [];
      },
      isreq(rule, value, callback) {
        if (this.reqmsg) {
          callback(new Error("证书为必填项"));
        } else {
          callback();
        }
      },
      getImgUrl(img) {
        this.imgs.push(img);
        // console.log(this.imgs, "imgs");
      },
      getAreaList() {
        selectCityInfoVoList({}).then((response) => {
          this.areaList = response.data;
        });
      },
      selectArea(value) {
        this.weatherAreaCode = value[1];
      },
      downBusiness(file) {
        let array = file.split(",");
        this.openTitle = "证书";
        this.openUrl = array[0];
        this.srcList = array;
        this.openVisible = true;
        this.imageViewer = true;

        // for (let i = 0; i < array.length; i++) {
        //   window.open(array[i]);
        // }
      },
      //证书上传
      uploadBusinessSuccess(img) {
        this.Businessimgs.push(img);
        this.reqmsg = false;
      },
      uploadBankSuccess(img) {
        this.Bankimgs.push(img);
        this.reqmsg = false;
      },
      uploadorgSuccess(img) {
        this.orgimgs.push(img);
        this.reqmsg = false;
      },
      uploaddetachedSuccess(img) {
        this.detachedimgs.push(img);
        this.reqmsg = false;
      },

      handleInput() {
        // 使用正则表达式过滤输入，只保留数字和小数点
        // this.premisesArea = this.premisesArea.replace(/[^0-9.]/g, "");
        // 限制只能输入1到999999之间的数字
        let value = parseInt(this.premisesArea, 10); // 将输入的值转为整数

        if (isNaN(value) || value < 1 || value > 999999) {
          // 判断是否在范围内
          this.premisesArea = ""; // 不在范围内则清空输入的值
        } else {
          this.premisesArea = value.toString(); // 在范围内则保留输入的值
        }
      },
      handleInput2() {
        // 使用正则表达式过滤输入，只保留数字和小数点
        this.weatherAreaCode = this.weatherAreaCode.replace(/[^a-zA-Z0-9]/g, "");
      },
      request() {
      },
      handleChange(value) {
      },
      getOrgInfo() {
        getDept(this.$route.params.id).then((data) => {
          // console.log(data.data);
          if (!data.data) return;
          let res = data.data;
          this.dataInfo = this.infoKeys.map((v, i) => {
            // console.log(v, res[v.key], "vvvvv");
            v.value = res[v.key];
            return v;
          });
          this.type = data.data.type;
          this.isLock = data.data.isLock;
          this.source = data.data.source;
          // console.log(this.dataInfo, "info");
        });
      },

      getExtendInfo() {
        getExtendByOrgId(this.$route.params.id).then((data) => {
          console.log(data.data);
          if (data.data != null) {
            this.safeBox = data.data.safeBox;
            this.innerCount = data.data.innerCount;
            this.outsideCount = data.data.outsideCount;
            this.cashAddingRoom = data.data.cashAddingRoom;
            this.remoteCount = data.data.remoteCount;
            this.orgType = data.data.orgType;
            this.weatherAreaCode = data.data.weatherAreaCode;
            this.premisesArea = data.data.premisesArea;
            this.ownership = data.data.ownership;
            this.outsideArea = data.data.outsideArea;
            this.askari = data.data.askari;
            this.remoteControl = data.data.remoteControl;
            this.selfServiceBank = data.data.selfServiceBank;
            this.businessLibrary = data.data.businessLibrary;
            this.lobbyEquipment = data.data.lobbyEquipment;
            this.wallPenetratingEquipment = data.data.wallPenetratingEquipment;
            this.askariCertificate = data.data.askariCertificate;
            this.extendId = data.data.id;
            this.constructionTime = data.data.constructionTime;
            this.lastUpdateTime = data.data.lastUpdateTime;
            this.platformBrand = data.data.platformBrand;
            this.platformSupplierBrand = data.data.platformSupplierBrand;
            this.businessLibraryType = data.data.businessLibraryType;
            this.dutyMode = data.data.dutyMode;
            this.detachedLobbyEquipment = data.data.detachedLobbyEquipment;
            this.detachedWallPenetratingEquipment =
              data.data.detachedWallPenetratingEquipment;
            this.cashAddingRoomRemoteControl =
              data.data.cashAddingRoomRemoteControl;
            // if (
            //   this.askariCertificate &&
            //   this.askariCertificate.trim() &&
            //   this.askariCertificate.includes(",")
            // ) {
            //   this.imgs = this.askariCertificate.split(",");
            // } else if (
            //   this.askariCertificate &&
            //   this.askariCertificate.trim() &&
            //   this.askariCertificate.includes(".")
            // ) {
            //   this.imgs.push(this.askariCertificate);
            // }

            // console.log(this.extendId);
          }
        });
      },
      getLabel(options, value) {
        return getLabel(options, value);
      },
      getOrgPhysicalDefenseConstructionInfo() {
        this.orgloading = true;
        let dat = {orgId: this.$route.params.id};
        listOrgPhysicalDefenseConstruction(dat).then((data) => {
          console.log("机构信息获取成功");
          this.constructionList = data.rows;
          this.orgloading = false;
        });
      },
      getBankPhysicalDefenseConstructionInfo() {
        this.bankloading = true;
        let dat = {orgId: this.$route.params.id, type: 3};
        listOrgPhysicalDefenseConstruction(dat).then((data) => {
          // console.log(data);
          this.BankPhysicalDefenseConstructionList = data.rows;
          this.bankloading = false;
        });
      },
      getdetachedPhysicalDefenseConstructionInfo() {
        this.detachedloading = true;
        let dat = {orgId: this.$route.params.id, type: 4};
        listOrgPhysicalDefenseConstruction(dat).then((data) => {
          // console.log(data);
          this.detachedPhysicalDefenseConstructionList = data.rows;
          this.detachedloading = false;
        });
      },
      getBusinessPhysicalDefenseConstructionInfo() {
        this.businessloading = true;
        let dat = {orgId: this.$route.params.id, type: 2};
        listOrgPhysicalDefenseConstruction(dat).then((data) => {
          // console.log(data);
          this.BusinessPhysicalDefenseConstructionList = data.rows;
          this.businessloading = false;
        });
      },
      // 取消按钮
      Businesscancel() {
        this.Businessopen = false;
        this.Businessreset();
      },
      // 表单重置
      Businessreset() {
        this.Businessform = {
          id: null,
          standard: null,
          dateOfCompliance: null,
          certificateEvidence: null,
          certificate: null,
          evidence: null,
          createTime: null,
          updateTime: null,
          createBy: null,
          updateBy: null,
          orgId: null,
        };
        this.reqmsg = false;
        this.resetForm("Businessform");
      },
      // 多选框选中数据
      handleBusinessSelectionChange(selection) {
        this.Businessids = selection.map((item) => item.id);
        this.single = selection.length !== 1;
        this.multiple = !selection.length;
      },
      /** 新增按钮操作 */
      handleBusinessAdd() {
        this.Businessreset();
        this.Businessopen = true;
        this.Businesstitle = "新增安全防范设施建设达标信息";
      },
      /** 编辑按钮操作 */
      handleBusinessUpdate(row) {
        this.Businessreset();
        const id = row.id || this.Businessids;
        getOrgPhysicalDefenseConstruction(id).then((response) => {
          // console.log(response.data,"response.data")
          this.Businessform = response.data;
          // this.Businessform.certificateEvidence=parseInt(response.data.certificateEvidence);
          this.Businessopen = true;
          this.Businesstitle = "编辑安全防范设施建设达标信息";
        });
      },
      /** 提交按钮 */
      submitBusinessForm() {
        if (this.Businessimgs.length > 0) {
          this.Businessform.certificate =
            this.Businessimgs[this.Businessimgs.length - 1].toString(",");
        }

        this.$refs.Businessform.validate((valid) => {
          if (valid) {
            // 表单验证通过，提交数据或执行其他操作
            this.Businessform.orgId = this.$route.params.id;
            this.Businessform.type = 2;

            if (this.Businessform.id != null) {
              // console.log(this.Businessform,"this.Businessform")
              updateOrgPhysicalDefenseConstruction(this.Businessform).then(
                (response) => {
                  this.$modal.msgSuccess("编辑成功");
                  this.Businessopen = false;
                  this.getBusinessPhysicalDefenseConstructionInfo();
                }
              );
            } else {
              addOrgPhysicalDefenseConstruction(this.Businessform).then(
                (response) => {
                  this.$modal.msgSuccess("新增成功");
                  this.Businessopen = false;
                  this.getBusinessPhysicalDefenseConstructionInfo();
                }
              );
            }
            this.Businessimgs = [];
          } else {
            // 表单验证未通过，显示错误信息
          }
        });

        // this.$refs["Businessform"].validate((valid) => {
        //   if (valid) {

        //   }
        // });
      },
      /** 删除按钮操作 */
      handleBusinessDelete(row) {
        const Businessids = row.id || this.Businessids;
        this.$modal
          .confirm("确认删除？")
          .then(function () {
            return delOrgPhysicalDefenseConstruction(Businessids);
          })
          .then(() => {
            this.getBusinessPhysicalDefenseConstructionInfo();
            this.$modal.msgSuccess("删除成功");
          })
          .catch(() => {
          });
      },
      // resetimg(certificate){
      //   this.Bankform.certificate=0;
      // },
      // 取消按钮
      Bankcancel() {
        this.Bankopen = false;
        this.Bankreset();
      },
      // 表单重置
      Bankreset() {
        this.Bankform = {
          id: null,
          standard: null,
          dateOfCompliance: null,
          certificateEvidence: null,
          certificate: null,
          evidence: null,
          createTime: null,
          updateTime: null,
          createBy: null,
          updateBy: null,
          orgId: null,
        };
        this.reqmsg = false;
        this.resetForm("Bankform");
      },
      // 多选框选中数据
      handleBankSelectionChange(selection) {
        this.Bankids = selection.map((item) => item.id);
        this.single = selection.length !== 1;
        this.multiple = !selection.length;
      },
      /** 新增按钮操作 */
      handleBankAdd() {
        this.Bankreset();
        this.Bankopen = true;
        this.Banktitle = "新增安全防范设施建设达标信息";
      },
      /** 编辑按钮操作 */
      handleBankUpdate(row) {
        this.Bankreset();
        const id = row.id || this.Bankids;
        getOrgPhysicalDefenseConstruction(id).then((response) => {
          this.Bankform = response.data;
          // this.Bankform.certificateEvidence=parseInt(response.data.certificateEvidence);
          this.Bankopen = true;
          this.Banktitle = "编辑安全防范设施建设达标信息";
        });
      },
      /** 提交按钮 */
      submitBankForm() {
        if (this.Bankimgs.length > 0) {
          this.Bankform.certificate =
            this.Bankimgs[this.Bankimgs.length - 1].toString(",");
        }

        this.$refs.Bankform.validate((valid) => {
          if (valid) {
            // 表单验证通过，提交数据或执行其他操作
            this.Bankform.orgId = this.$route.params.id;
            this.Bankform.type = 3;

            if (this.Bankform.id != null) {
              updateOrgPhysicalDefenseConstruction(this.Bankform).then(
                (response) => {
                  this.$modal.msgSuccess("编辑成功");
                  this.Bankopen = false;
                  this.getBankPhysicalDefenseConstructionInfo();
                }
              );
            } else {
              addOrgPhysicalDefenseConstruction(this.Bankform).then(
                (response) => {
                  this.$modal.msgSuccess("新增成功");
                  this.Bankopen = false;
                  this.getBankPhysicalDefenseConstructionInfo();
                }
              );
            }
            this.Bankimgs = [];
          } else {
            // 表单验证未通过，显示错误信息
          }
        });

        // this.$refs["Bankform"].validate((valid) => {
        //   if (valid) {

        //   }
        // });
      },
      /** 删除按钮操作 */
      handleBankDelete(row) {
        const Bankids = row.id || this.Bankids;
        this.$modal
          .confirm("确认删除？")
          .then(function () {
            return delOrgPhysicalDefenseConstruction(Bankids);
          })
          .then(() => {
            this.getBankPhysicalDefenseConstructionInfo();
            this.$modal.msgSuccess("删除成功");
          })
          .catch(() => {
          });
      },

      // 取消按钮
      detachedcancel() {
        this.detachedopen = false;
        this.detachedreset();
      },
      // 表单重置
      detachedreset() {
        this.detachedform = {
          id: null,
          standard: null,
          dateOfCompliance: null,
          certificateEvidence: null,
          certificate: null,
          evidence: null,
          createTime: null,
          updateTime: null,
          createBy: null,
          updateBy: null,
          orgId: null,
        };
        this.reqmsg = false;
        this.resetForm("detachedform");
      },
      // 多选框选中数据
      handledetachedSelectionChange(selection) {
        this.detachedids = selection.map((item) => item.id);
        this.single = selection.length !== 1;
        this.multiple = !selection.length;
      },
      /** 新增按钮操作 */
      handledetachedAdd() {
        this.detachedreset();
        this.detachedopen = true;
        this.detachedtitle = "新增安全防范设施建设达标信息";
      },
      /** 编辑按钮操作 */
      handledetachedUpdate(row) {
        this.detachedreset();
        const id = row.id || this.detachedids;
        getOrgPhysicalDefenseConstruction(id).then((response) => {
          this.detachedform = response.data;
          // this.detachedform.certificateEvidence=parseInt(response.data.certificateEvidence);
          this.detachedopen = true;

          this.detachedtitle = "编辑安全防范设施建设达标信息";
        });
      },
      /** 提交按钮 */
      submitdetachedForm() {
        if (this.detachedimgs.length > 0) {
          this.detachedform.certificate =
            this.detachedimgs[this.detachedimgs.length - 1].toString(",");
        }

        this.$refs.detachedform.validate((valid) => {
          if (valid) {
            // 表单验证通过，提交数据或执行其他操作
            this.detachedform.orgId = this.$route.params.id;
            this.detachedform.type = 4;

            if (this.detachedform.id != null) {
              updateOrgPhysicalDefenseConstruction(this.detachedform).then(
                (response) => {
                  this.$modal.msgSuccess("编辑成功");
                  this.detachedopen = false;
                  this.getdetachedPhysicalDefenseConstructionInfo();
                }
              );
            } else {
              addOrgPhysicalDefenseConstruction(this.detachedform).then(
                (response) => {
                  this.$modal.msgSuccess("新增成功");
                  this.detachedopen = false;
                  this.getdetachedPhysicalDefenseConstructionInfo();
                }
              );
            }
            this.detachedimgs = [];
          } else {
            // 表单验证未通过，显示错误信息
          }
        });

        // this.$refs["detachedform"].validate((valid) => {
        //   if (valid) {

        //   }
        // });
      },
      /** 删除按钮操作 */
      handledetachedDelete(row) {
        const detachedids = row.id || this.detachedids;
        this.$modal
          .confirm("确认删除？")
          .then(function () {
            return delOrgPhysicalDefenseConstruction(detachedids);
          })
          .then(() => {
            this.getdetachedPhysicalDefenseConstructionInfo();
            this.$modal.msgSuccess("删除成功");
          })
          .catch(() => {
          });
      },

      // 表单重置
      orgreset() {
        this.orgform = {
          id: null,
          standard: null,
          dateOfCompliance: null,
          dateOfComplete:null,
          certificateEvidence: 0,
          certificate: null,
          evidence: null,
          createTime: null,
          updateTime: null,
          createBy: null,
          updateBy: null,
          orgId: null,
        };
        this.reqmsg = false;
        this.resetForm("orgform");
      },
      // 取消按钮
      orgcancel() {
        this.orgopen = false;
        this.orgreset();
      },
      // 多选框选中数据
      handleOrgSelectionChange(selection) {
        this.orgids = selection.map((item) => item.id);
        this.single = selection.length !== 1;
        this.multiple = !selection.length;
      },
      /** 新增按钮操作 */
      handleOrgAdd() {
        this.orgreset();
        this.orgopen = true;
        this.orgtitle = "新增安全防范设施建设达标信息";
      },
      /** 编辑按钮操作 */
      handleOrgUpdate(row) {
        this.orgreset();
        const id = row.id || this.orgids;
        getOrgPhysicalDefenseConstruction(id).then((response) => {
          this.orgform = response.data;
          this.orgopen = true;
          this.orgtitle = "编辑安全防范设施建设达标信息";
        });
      },
      /** 提交按钮 */
      submitOrgForm() {

        if (this.orgimgs.length > 0) {
          this.orgform.certificate =
            this.orgimgs[this.orgimgs.length - 1].toString(",");
        }
        if(!this.orgform.certificate && this.orgform.standard !== '3'){
          this.$modal.alertError("请上传证书");
          return;
        }
        //certificate
        this.$refs.orgform.validate((valid) => {
          if (valid) {
            // 表单验证通过，提交数据或执行其他操作
            this.orgform.orgId = this.$route.params.id;
            // this.orgform.type = 1;

            if (this.orgform.id != null) {
              updateOrgPhysicalDefenseConstruction(this.orgform).then(
                (response) => {
                  this.$modal.msgSuccess("编辑成功");
                  this.orgopen = false;
                  this.getOrgPhysicalDefenseConstructionInfo();
                }
              );
            } else {
              addOrgPhysicalDefenseConstruction(this.orgform).then((response) => {
                this.$modal.msgSuccess("新增成功");
                this.orgopen = false;
                this.getOrgPhysicalDefenseConstructionInfo();
              });
            }
            this.orgimgs = [];
          } else {
            // 表单验证未通过，显示错误信息
          }
        });
      },
      /** 删除按钮操作 */
      handleOrgDelete(row) {
        const orgids = row.id || this.orgids;
        this.$modal
          .confirm("确认删除？")
          .then(function () {
            return delOrgPhysicalDefenseConstruction(orgids);
          })
          .then(() => {
            this.getOrgPhysicalDefenseConstructionInfo();
            this.$modal.msgSuccess("删除成功");
          })
          .catch(() => {
          });
      },
      saveExtend() {
        let dat = {
          safeBox: this.safeBox ? 1 : 0,
          innerCount: this.innerCount,
          outsideCount: this.outsideCount,
          cashAddingRoom: this.cashAddingRoom,
          orgType: this.orgType,
          remoteCount: this.remoteCount,
          weatherAreaCode: this.weatherAreaCode,
          askariCertificate:
            this.imgs.length > 0
              ? this.imgs[this.imgs.length - 1].toString(",")
              : null,
          premisesArea: this.premisesArea,
          ownership: this.ownership,
          outsideArea: this.outsideArea,
          askari: this.askari ? 1 : 0,
          businessLibraryType: this.businessLibraryType,
          dutyMode: this.dutyMode,
          remoteControl: this.remoteControl ? 1 : 0,
          selfServiceBank: this.selfServiceBank ? 1 : 0,
          businessLibrary: this.businessLibrary ? 1 : 0,
          lobbyEquipment: this.lobbyEquipment,
          wallPenetratingEquipment: this.wallPenetratingEquipment,
          platformBrand: this.platformBrand,
          platformSupplierBrand: this.platformSupplierBrand,
          constructionTime: this.constructionTime,
          lastUpdateTime: this.lastUpdateTime,
          orgId: this.$route.params.id,
          id: this.extendId,
          detachedLobbyEquipment: this.detachedLobbyEquipment,
          detachedWallPenetratingEquipment: this.detachedWallPenetratingEquipment,
          cashAddingRoomRemoteControl: this.cashAddingRoomRemoteControl,
        };
        // console.log(dat);
        if (this.extendId) {
          updateExtend(dat).then((res) => {
            this.$modal.msgSuccess("保存成功");
            // this.$router.go(-1);
            this.$tab.closePageAndPushPrev();
          });
        } else {
          addExtend(dat).then((res) => {
            this.$modal.msgSuccess("保存成功");
            // this.$router.go(-1);
            this.$tab.closePageAndPushPrev();
          });
        }
      },
      nosaveExtend() {
        // this.$router.go(-1);
        this.$tab.closePageAndPushPrev();
      },
      triggerFileInput() {
        this.$refs.fileInput.click();
      },
      async handleFileChange(event) {
        const file = event.target.files[0];
        if (!file) return;
        // // 发送文件到您的文件上传 API
        try {
          uploadFile(file, "org").then((res) => {
            console.log(res);
            // this.orgform.certificateEvidence = res.data;
          });
          // 处理上传成功的逻辑
          console.log("上传成功");
        } catch (error) {
          // 处理上传失败的逻辑
          console.log("上传失败");
        }
        event.target.value = "";
      },
    },
    fillter: {},
  };
</script>

<style scoped lang="scss">
  /*.org-extend{
    background-color: #fff;
    padding: 10px;
  }*/
  .title {
    font-size: 18px;
    text-align: left;
    color: #008cd6;
    height: 36px;
    line-height: 36px;
    padding-left: 8px;
    margin: 0;
  }

  .info-box {
    margin: 20px;
  }

  .demo-form-inline {
  }

  .dialog-footer {
  }

  .container {
  }

  .zoom-image {
    transition: transform 0.3s ease;
  }

  .zoom-image:hover {
    transform: scale(1.02);
  }

  .border-color-change {
    border: 1px solid #ccc;
    transition: border-color 0.3s ease;
  }

  .border-color-change:hover {
    border-color: #1ea8e9;
    /* 您可以将此颜色更改为所需的颜色 */
  }

  .extend_mod {
    background-color: #fff;
    padding: 1px 15px 1px 15px;
    margin-bottom: 2px;
    -webkit-box-shadow: 0 2px 8px #ccc;
    box-shadow: 0 2px 8px #ccc;
  }

  .el-table thead > tr > th {
    background-color: #fafafa !important;
  }



  .el-row {
    margin-bottom: 20px;
    &:last-child {
      margin-bottom: 0;
    }
  }
  .el-col {
    border-radius: 4px;
  }
  .bg-purple-dark {
    background: #99a9bf;
  }
  .bg-purple {
    background: #d3dce6;
  }
  .bg-purple-light {
    background: #e5e9f2;
  }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }


</style>