整体更改

liuyg

2021-08-17 6bb5ac166f1ec6a1daeb56689fa2bc21035da9f4

 src/views/home/index.vue

@@ -1,1136 +1,378 @@
<template>
  <div style="width: 100%;height: 100%; background: #ccc;">
    <div style="background-color: #25aff3;width: 100%;height: 50px;">
      <span
        style="display: inline-block;color: #ffffff;font-size: 24px;line-height: 50px;margin-left: 5px;">服务许可审批备案系统</span>
      <div
        style="display: block;float: right;height: 50px;padding-right: 52px;color: #fff;line-height: 50px;cursor: pointer;position: relative;">
        <img src="http://nx.baibaodun.cn:80/assets/images/username-person.png"
             style="display: inline-block;vertical-align: middle">
        <i
          style="font-style: normal;color: #ffffff;font-size: 16px;line-height: 50px;display: inline-block;margin: 0; padding-left: 4px">{{userName}}</i>
        <a style="margin-left: 15px;color: #ffffff;font-size: 16px;line-height: 50px" @click="logout">退出登录</a>
  <div id="examine">
    <div class="examine_heard">
      服务许可审批备案系统
      <div class="e_h_right">
        <img
          src="http://nx.baibaodun.cn:80/assets/images/username-person.png"
          alt=""
        />
        <span>
          {{ userName }}
        </span>
        <div @click="logout">退出登录</div>
      </div>
    </div>
    <div style="position: relative;
    width: 100%;
    height: 100%;background:#eff2fa">
      <div class="header">
        <h2 style="text-align: center;margin: 0;padding-top: 20px;">保安相关申请流程</h2>
        <button
          style="border:1px solid red;border-radius:3px; position: absolute;right: 16%;top: 30px;height:25px;width: 140px;text-align:center"
          @click="ss">
          审批进度查询
        </button>
    <div class="examine_body">
      <div class="title">
        <h2>保安相关申请流程</h2>
        <button @click="openApproval">审批进度查询</button>
      </div>

      <div class="main">
        <div v-for="(item, index) in menuData"
             :key="index"
             class='item-box'>

          <div class='box-top'
               :style="{ background: item.topUrl }"
               @click="targetClick(item)">

            <div class='img-box'>
              <img :src="item.centerUrl"
                   alt="">
            </div>

          </div>

          <div class="box-bottom">
            {{ item.menuName }}
          </div>

        </div>
      <div class="b_main">
        <!-- 卡片 -->
        <examineCard
          v-for="(item, index) in dataCard"
          :key="index"
          :data="item"
          :ind="index"
          @open="openMain"
          v-show="showCard"
        ></examineCard>
      </div>
    </div>
    <div class="detail-box" v-show="onit">
      <span class="layui-layer-setwin">
        <a class="layui-layer-ico layui-layer-close layui-layer-close1" href="javascript:;" id="close"></a>
    <!-- 审批进度查询 -->
    <Approval class="Approval">
      <span slot="close">
        <i class="el-icon-close ApprovalClose" @click="ApprovalClose"></i>
      </span>
      <div class="layui-layer-title" style="height: 40px;line-height:40px;">保安服务公司许可证</div>
      <span class="layui-layer-setwin"><a class="layui-layer-ico layui-layer-close layui-layer-close1"
                                          href="javascript:;" @click="js_method"></a></span>
      <div id="" class="layui-layer-content" style="height: 298px;">
        <div class="radio-custom radio-primary">
          <label for="sponsorlicenseType1">
            <input id="sponsorlicenseType1" type="radio" value="0" name="sponsorlicenseType" ref="name"
                   checked="">保安服务公司设立许可</label>
          <div class="handling-guideline"><p>材料说明：普通保安服务公司是指申请服务范围为：门卫、巡逻、守护、随身护卫、安全检查、安全技术防范、安全风险评估、区域秩序维护的公司。</p>
          </div>
        </div>
        <div class="radio-custom radio-primary">
          <label for="sponsorlicenseType2"><input id="sponsorlicenseType2" type="radio" value="1" ref="name"
                                                  name="sponsorlicenseType">保安培训公司设立许可</label>
          <div class="handling-guideline"><p>
            国务院《保安服务管理条例》（2009年国务院令第564号）第九条：申请设立保安服务公司,应当向所在地设区的市级人民政府公安机关提交申请书以及能够证明其符合本条例第八条规定条件的材料。</p>
          </div>
        </div>
      </div>
      <div class="layui-layer-btn" style="margin-left: 260px">
        <button class="layui-layer-btn0" @click="onNext"
                style="position: absolute;width: 95px; border: 1px solid #2673e5;background: rgb(46, 141, 237);border-radius: 4px;width: 100px;height: 38px;">
          确认
        </button>
      </div>

    </div>

    <div class="lod" v-if="forms != 0">
      <div class="lod-in">
        <div v-show="forms == 1" class="first-box-outer">
          <div class="first-box-title" style="">设立保安服务公司行政许可证
          </div>
          <div class="first-box-content">
            <div class="handling-guideline">
              <h2 class="hand-title">保安服务公司许可办理指南</h2>
              <div class="hand-content">
                <p><label>审批依据：</label></p>
                <p>
                  1、《保安服务管理条例》(中华人民共和国国务院令第564号)；<br>

                  2、《公安机关实施保安服务管理条例办法》(中华人民共和国公安部令 第 112 号)；<br>

                  3、关于印发《宁夏回族自治区保安服务公司许可备案实施细则（试行）》和《宁夏回族自治区保安培训机构管理办法实施细则（试行）》的通知（宁公通〔2017〕61号）；<br>

                </p>
                <p><label>申请条件：</label>自然人、法人和其他组织。自然人需要有完全民事行为能力，年满18周岁且不具有精神疾病。 </p>
                <p><label>申请材料：</label></p>
                <p>
                  1、《申请设立保安服务公司行政许可审批表》。<br>
                  2、设立保安服务公司申请书<br>
                  3、设立保安服务公司可行性分析报告<br>

                  4、保安服务从业单位法定代表人（主要负责人）登记表<br>
                  5、保安服务公司章程<br>
                  6、注册资本认缴金额证明。<br>
                  7、拟任的法定代表人、主要管理人员应提供下列材料：<br>
                  ①有效身份证件；②保安师资格证书原件及复印件；③个人简历及5年以上军队、公安、安全、审判、检察、司法行政或者治保安卫、保安经营管理工作经验证明。<br>
                  8、专业技术人员名单，法律、行政法规有资格要求的资格证明。<br>
                  9、拟设保安服务公司住所的所有权或使用权有效证明文件和提供保安服务所需的有关设备、交通工具等材料并附彩色照片。<br>
                  10、组织机构和保安服务管理制度、岗位责任制度、保安员管理制度材料。<br>
                  11、工商行政管理部门核发的企业名称预先核准通知书。<br>
                </p>


                <p><label>申请设立中外合资、中外合作或者外资独资保安服务公司除以上1-11项内容外还需另外提供以下材料：</label></p>

                <p>
                  1、中外合资、中外合作合同原件及复印件。<br>

                  2、外方的资信证明和注册登记文件原件及复印件。<br>

                  3、境外法定代表人、主要管理人员所属国家或者地区无被刑事处罚记录证明（原居住地警察机构出具并经公证机关公证）。<br>

                  4、境外法定代表人、主要管理人员5年以上保安经营管理工作经验证明。<br>
                </p>

                <p><label>法定周期：</label>区、市20个工作日</p>
                <p><label>承诺时限：</label>区、市20个工作日</p>

                <p><label>受理部门：</label>市级公安机关</p>

                <p><label>审批机关：：</label>区级公安机关</p>


                <p><label>申请设立或增设从事武装守护押运业务的保安服务公司还需另外提供以下材料：</label></p>

                <p>
                  1、1000万元人民币以上注册资本。<br>

                  2、出资属国有独资或者国有资本占注册资本总额51%以上的有效证明文件原件及复印件。<br>

                  3、符合国家或者行业标准的专用运输车辆以及通信、报警设备的材料。<br>

                  4、枪支安全管理制度和保管设施情况的材料。<br>
                </p>


                <p><label>法定周期：</label>区、市20个工作日</p>
                <p><label>承诺时限：</label>区、市20个工作日</p>

                <p><label>受理部门：</label>市级公安机关</p>

                <p><label>审批机关：：</label>区级公安机关</p>

                <p><label>审批机关：：</label>公安部</p>


              </div>
            </div>
            <div class="hand-next">
              <el-button type="primary" @click="tip0">下一步</el-button>
              <el-button type="primary" @click="qx">取消</el-button>
            </div>
          </div>
        </div>
        <div v-show="forms == 2" class="first-box-outer">
          <avue-form
            ref="form1"
            v-model="obj0"
            :option="option">
            <template slot="menuForm">
              <el-button type="primary" @click="tip1up1">上一页</el-button>
              <el-button type="primary" @click="tip1">暂存</el-button>
              <el-button type="primary" @click="up()">提交审批</el-button>
              <el-button type="info" @click="tipover">取消</el-button>
            </template>
          </avue-form>
        </div>
      </div>
    </div>

    <div class="lod" v-show="onits">
      <div class="lod-in">
        <div class="first-box-outers">
          <div class="first-box-titles">审批进度
            <a  style="margin-left: 1120px;font-size: 18px" href="javascript:;" @click="js_methods">X</a>
          </div>
          <div class="first-box-content">
            <avue-crud :option="option1"
                       :table-loading="loading"
                       :data="data"
                       :page.sync="page"
                       :permission="permissionList"
                       :before-open="beforeOpen"
                       v-model="form"
                       ref="crud"
                       @row-update="rowUpdate"
                       @row-save="rowSave"
                       @row-del="rowDel"
                       @search-change="searchChange"
                       @search-reset="searchReset"
                       @selection-change="selectionChange"
                       @current-change="currentChange"
                       @size-change="sizeChange"
                       @refresh-change="refreshChange"
                       @on-load="onLoad"
                       :row-style="rowStyle"
            >
              <template class="tdtype" slot-scope="{ row }" slot="type">
                <el-tag class="dtype">
                  {{
                    row.type == "0" ? "通过" : row.type == "1" ? "不通过" : "待审核"
                  }}
                  <i class="gz" v-if="row.type == '0' "></i>
                  <i class="yj" v-if="row.type == '1' "></i>
                  <i class="zc" v-if="row.type == '2' "></i>
                </el-tag>
              </template>
            </avue-crud>

          </div>

        </div>
      </div>
    </div>
    </Approval>
    <!-- 保安服务公司许可申请 -->
    <securityPermit class="securityPermit" :type="dataCard[0].type">
      <span slot="close">
        <i class="el-icon-close ApprovalClose" @click="openClose"> </i>
      </span>
    </securityPermit>
    <!-- 跨区域经营备案 -->
    <crossRegion class="crossRegion" :type="dataCard[1].type">
      <span slot="close">
        <i class="el-icon-close ApprovalClose" @click="openClose"> </i>
      </span>
    </crossRegion>
    <!-- 自招保安单位备案 -->
    <securityGuard class="securityGuard" :type="dataCard[2].type">
      <span slot="close">
        <i class="el-icon-close ApprovalClose" @click="openClose"> </i>
      </span>
    </securityGuard>
    <!-- 保安培训公司备案 -->
    <securityTraining class="securityTraining" :type="dataCard[3].type">
      <span slot="close">
        <i class="el-icon-close ApprovalClose" @click="openClose"> </i>
      </span>
    </securityTraining>
    <!-- 自招保安单位备案撤销 -->
    <cancellationOfFiling class="cancellationOfFiling" :type="dataCard[4].type">
      <span slot="close">
        <i class="el-icon-close ApprovalClose" @click="openClose"> </i>
      </span>
    </cancellationOfFiling>
  </div>
</template>

<script>
import examineCard from "@/components/examineCard/examineCard.vue"; //卡片
import Approval from "@/components/Approval/Approval.vue"; //审批进度查询
import securityPermit from "@/components/securityPermit/securityPermit.vue"; // 保安服务公司许可申请
import crossRegion from "@/components/crossRegion/crossRegion.vue"; // 跨区域经营备案
import securityGuard from "@/components/securityGuard/securityGuard.vue"; // 自招保安单位备案
import securityTraining from "@/components/securityTraining/securityTraining.vue"; // 保安培训公司备案
import cancellationOfFiling from "@/components/cancellationOfFiling/cancellationOfFiling.vue"; // 自招保安单位备案撤销
import {
  add,
  adds,
  getDetail,
  getList,
  getListre,
  getListrek,
  getListrev,
  remove,
  selectIn,
  update
} from "@/api/permit/permit"
import {mapGetters} from "vuex";
import {resetRouter} from '@/router/router'
} from "@/api/permit/permit";
import { mapGetters } from "vuex";
import { resetRouter } from "@/router/router";

export default {
  data() {
    return {
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      obj0: {
        title0: "保安服务公司许可证审批",
      },
      // option0: {
      //   emptyBtn: false,
      //   submitBtn: false,
      //   gutter: 30,
      //   column: column0,
      // },
      option: {
        emptyBtn: false,
        submitBtn: false,
        gutter: 50,
        column: [
          {
            label: "",
            labelWidth: 20,
            type: 'title',
            prop: "title0",
            span: 24,
            styles: {
              fontSize: '24px'
            }
          },
          {
            label: "统一社会信用代码",
            prop: "creditcode",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入社会信用代码",
              trigger: "blur"
            }]
          },
          {
            label: "辖区",
            prop: "jurisdiction",
            // type: "tree",
            // disabled: true,
            type: "tree",
            dicUrl: "/api/jurisdiction/lazy-trees",
            props: {
              label: "title",
              value: "id"
            },
            labelWidth: 160,
            span: 12,
          },
          {
            label: "企业类型",
            prop: "ptype",
            hide: true,
            display: false,
          },
          {
            label: "所属单位",
            prop: "deptid",
            hide: true,
            display: false,
          },
          {
            label: "企业名称",
            prop: "enterprisename",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入企业名称",
              trigger: "blur"
            }]
          },
          {
            label: "法定代表人",
            prop: "representative",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入法定代表人",
              trigger: "blur"
            }]
          },
          {
            label: "法定代表人电话",
            prop: "representativecell",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "法定代表人电话",
              trigger: "blur"
            }]
          },
          {
            label: "联系人",
            prop: "contacts",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "联系人",
              trigger: "blur"
            }]
          },
          {
            label: "联系人电话",
            prop: "contactscell",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "联系人电话",
              trigger: "blur"
            }]
          },
          {
            label: "成立日期",
            prop: "establishtime",
            labelWidth: 160,
            span: 12,
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "timestamp",
          },
          {
            label: "注册资本(万元人民币)",
            prop: "registeredcapital",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入注册资本",
              trigger: "blur"
            }]
          },
          // {
          //   label: "实缴资本(万元人民币)",
          //   prop: "capital",
          //   labelWidth: 160,
          //   span: 12,
          //   rules: [{
          //     required: true,
          //     message: "请输入实缴资本",
          //     trigger: "blur"
          //   }]
          // },
          {
            label: "组织机构代码",
            prop: "organizationcode",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入组织机构代码",
              trigger: "blur"
            }]
          },
          {
            label: "工商注册号",
            prop: "registrationnumber",

            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入工商注册号",
              trigger: "blur"
            }]
          },
          // {
          //   label: "纳税人识别号",
          //   prop: "identificationnumber",
          //   labelWidth: 160,
          //   span: 12,
          //   rules: [{
          //     required: true,
          //     message: "请输入纳税人识别号",
          //     trigger: "blur"
          //   }]
          // },
          {
            label: "注册地址",
            prop: "address",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入注册地址",
              trigger: "blur"
            }]
          },
          {
            label: "经营范围",
            prop: "business",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入经营范围",
              trigger: "blur"
            }]
          },
          {
            label: "所属地区",
            prop: "region",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入所属地区",
              trigger: "blur"
            }]
          },
          {
            label: "登记机关",
            prop: "registration",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入登记机关",
              trigger: "blur"
            }]
            // overHidden: true,
          },
          {
            label: "所属行业",
            prop: "industry",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入所属行业",
              trigger: "blur"
            }]
          },
          {
            label: '拖拽上传',
            prop: 'imgUrl5',
            type: 'upload',
            span: 12,
            drag: true,
            propsHttp: {
              res: 'data'
            },
            tip: '只能上传jpg/png文件，且不超过500kb',
            action: '/api/blade-resource/oss/endpoint/put-file-attach?deptid=&type=0'
          },
        ]
      },
      option1: {
        delBtn: false,
        editBtn: false,
        addBtn: false,
        height: 'auto',
        calcHeight: 260,
        tip: false,
        searchShow: true,
        searchMenuSpan: 8,
        labelWidth: 130,
        headerAlign: 'center',
        align: 'center',
        border: true,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "企业名称",
            prop: "enterprisename",
            labelWidth: 160,
            span: 12,
            rules: [{
              required: true,
              message: "请输入企业名称",
              trigger: "blur"
            }]
          },
          {
            label: "许可类型",
            prop: "ptype",
            type: "select",
            dicData: [
              {
                label: "保安服务公司许可",
                value: '0'
              },
              {
                label: "保安培训公司许可",
                value: '1'
              },
              {
                label: "保安服务公司备案",
                value: '2'
              },
              {
                label: "跨区域备案",
                value: '3'
              },
              {
                label: "备案撤销",
                value: '4'
              },
            ],
          },
          {
            label: "审批意见",
            prop: "reason",

          },
          {
            label: "提交时间",
            prop: "permitime",
            addDisplay: false,
            type: "date",
            format: "yyyy-MM-dd HH:mm:ss",
            valueFormat: "yyyy-MM-dd HH:mm:ss",
          },
          {
            label: "审核状态",
            prop: "type",
            addDisplay: false,
            type: "select",
            dicData: [
              {
                label: "通过",
                value: '0'
              },
              {
                label: "不通过",
                value: '1'
              },
              {
                label: "待审核",
                value: '2'
              }
            ],
          },

        ]
      },
      data0: {},
      forms: 0,
      onit: false,
      onits: false,
      menuData: [
        {
          menuName: '保安服务公司许可',
          centerUrl: '/img/logo.png',
          topUrl: 'url(/img/permit/服务许可背景图.jpg)',
          targetUrl: 'per'
        },
        {
          menuName: '保安服务公司备案',
          centerUrl: '/img/logo.png',
          topUrl: 'url(/img/permit/服务许可背景图.jpg)'
        },
        {
          menuName: '自招保安单位备案撤销',
          centerUrl: '/img/logo.png',
          topUrl: 'url(/img/permit/服务许可背景图.jpg)'
        },
        {
          menuName: '跨区域经营备案',
          centerUrl: '/img/logo.png',
          topUrl: 'url(/img/permit/服务许可背景图.jpg)'
        },
      ],
      userName:''
    }
  components: {
    examineCard: examineCard,
    Approval: Approval,
    securityPermit: securityPermit,
    crossRegion: crossRegion,
    securityGuard: securityGuard,
    securityTraining: securityTraining,
    cancellationOfFiling: cancellationOfFiling,
  },
  computed: {
    ...mapGetters(["userInfo"]),
  },
  data() {
    return {
      userName: "",
      showCard: false,
      zhezao: false,
      data: [],
      dataCard: [
        {
          menuName: "保安服务公司许可申请",
          centerUrl: "/img/logo.png",
          topUrl: "url(/img/permit/服务许可背景图.jpg)",
          targetUrl: "per",
          type: 0,
        },
        {
          menuName: "跨区域经营备案",
          centerUrl: "/img/logo.png",
          topUrl: "url(/img/permit/服务许可背景图.jpg)",
          type: 3,
        },
        {
          menuName: "自招保安单位备案",
          centerUrl: "/img/logo.png",
          topUrl: "url(/img/permit/服务许可背景图.jpg)",
          type: 1,
        },
        {
          menuName: "保安培训公司备案",
          centerUrl: "/img/logo.png",
          topUrl: "url(/img/permit/服务许可背景图.jpg)",
          type: 2,
        },
        {
          menuName: "自招保安单位备案撤销",
          centerUrl: "/img/logo.png",
          topUrl: "url(/img/permit/服务许可背景图.jpg)",
          type: 6,
        },
      ],
    };
  },
  computed: {
    ...mapGetters(["userInfo", "ApprovalShow", "useWhere"]),
  },
  created() {
    this.convert();
    this.cc();
    var page = {
      pageSize: 10,
      currentPage: 1,
      total: 0,
    };
    this.onLoad(page);
  },
  methods: {
    cc: function(){
      this.userName =this.$store.getters.userInfo.user_name
    },
    convert: function () {
      var caridid = this.$store.getters.userInfo.Id;
      selectIn(caridid).then(res => {
        this.option.column[1].value = res.data.data.creditCode
        this.option.column[2].value = res.data.data.jurisdiction
        this.option.column[3].value = res.data.data.enterpriseName
        this.option.column[4].value = res.data.data.representative
        this.option.column[5].value = res.data.data.representativecell
        this.option.column[6].value = res.data.data.contacts
        this.option.column[7].value = res.data.data.contactscell
        this.option.column[8].value = res.data.data.establishTime
        this.option.column[9].value = res.data.data.registeredCapital
        this.option.column[10].value = res.data.data.capital
        this.option.column[11].value = res.data.data.organizationCode
        this.option.column[12].value = res.data.data.identificationNumber
        this.option.column[13].value = res.data.data.enterprises
        this.option.column[14].value = res.data.data.address
        this.option.column[15].value = res.data.data.business
        this.option.column[16].value = res.data.data.region
        this.option.column[17].value = res.data.data.registration
        this.option.column[18].value = res.data.data.industry
      })
    },
    ss() {
      this.onits = true;
      //this.$router.push({path: '/homespi'});
    },
    onNext() {
      this.forms = 1;
      this.onit = false;
    },
    targetClick(item) {
      var url = item.targetUrl
      if (url == "per") {
        this.onit = true;
      }
    },
    tip0() {
      this.forms = 2;
    },
    qx(){
      this.forms = 0;
    },
    up() {
      var d = {};
      for (var k in this.obj0) {
        for (var i in this.option.column) {
          if (k == this.option.column[i].prop && k != "title0") {
            d[k] = this.obj0[k];
          }
        }
      }
      this.data0 = d;
      this.data0.ptype = this.$refs.name.value
      this.data0.cardid = this.$store.getters.userInfo.Id
      add(this.data0).then(() => {
        this.tipover();
      });
    },
    tip1() {
      var d = {};
      for (var k in this.obj0) {
        for (var i in this.option.column) {
          if (k == this.option.column[i].prop && k != "title0") {
            d[k] = this.obj0[k];
          }
        }
      }
      this.data0 = d;
      this.data0.ptype = this.$refs.name.value
      this.data0.deptid = this.$store.getters.userInfo.dept_id
      adds(this.data0).then(() => {
        this.tipover();
       });
    },
    tip1up1() {
      this.forms = 1;
    },
    onLoad(page, params = {}) {
      this.loading = true;
      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
      params["cardid"] = this.userInfo.Id;
      getList(page.currentPage, page.pageSize, params).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        getListre(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(ress => {
          this.data = this.data.concat(ress.data.data.records)
        });
        getListrek(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(resk => {
          this.data = this.data.concat(resk.data.data.records)
        });
        getListrev(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(resv => {
          this.data = this.data.concat(resv.data.data.records)
        });
      });
    },
    rowUpdate(row, index, done, loading) {
      update(row).then(() => {
        this.onLoad(this.page);
        this.$message({
          type: "success",
          message: "操作成功!"
        });
        done();
      }, error => {
        loading();
        console.log(error);
      });
    }
    ,
    rowDel(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return remove(row.id);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
        getListre(page.currentPage, page.pageSize, params).then((ress) => {
          this.data = this.data.concat(ress.data.data.records);
          getListrek(page.currentPage, page.pageSize, params).then((resk) => {
            this.data = this.data.concat(resk.data.data.records);
            getListrev(page.currentPage, page.pageSize, params).then((resv) => {
              this.data = this.data.concat(resv.data.data.records);
              console.log(this.data.length);
              if (this.data.length >= 1) {
                // this.$store.commit("changehandle", false);
              } else {
                // this.$store.commit("changehandle", true);
              }
              this.showCard = true;
              this.data.forEach((item) => {
                for (const key in this.dataCard) {
                  if (this.dataCard[key].type == item.ptype) {
                    console.log(this.dataCard[key].menuName);
                  }
                }
              });
            });
          });
        });
      });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then(res => {
          this.form = res.data.data;
        });
      }
      done();
    cc: function () {
      this.userName = this.userInfo.user_name;
    },
    tipover() {
      this.forms = 0;
      this.obj0 = {
        title0: "保安单位基本信息",
      };
      this.data0 = {};
    openApproval() {
      this.$store.commit("doitApprovalShow", true);
    },
    js_method() {
      this.onit = false;
    ApprovalClose() {
      this.$store.commit("doitApprovalShow", false);
    },
    js_methods() {
      this.onits = false;
    openClose() {
      this.$store.commit("changeuseWhere", "close");
    },
    logout() {
      this.$confirm(this.$t("logoutTip"), this.$t("tip"), {
        confirmButtonText: this.$t("submitText"),
        cancelButtonText: this.$t("cancelText"),
        type: "warning"
        type: "warning",
      }).then(() => {
        this.$store.dispatch("LogOut").then(() => {
          resetRouter();
          this.$router.push({path: "/login"});
          this.$router.push({ path: "/login" });
        });
      });
    }
  }
}
    },
    openMain(val, goon) {
      this.zhezao = true;
      if (goon == "openLook") {
        this.$store.commit("doitApprovalShow", true);
        return;
      }
      if (val == 0) {
        //保安服务公司许可
        console.log(this.dataCard[val].menuName);
        this.$store.commit("changeuseWhere", val);
      } else if (val == 1) {
        //跨区域经营备案
        this.$store.commit("changeuseWhere", val);
        console.log(this.dataCard[val].menuName);
      } else if (val == 2) {
        //自招保安单位备案
        this.$store.commit("changeuseWhere", val);
        console.log(this.dataCard[val].menuName);
      } else if (val == 3) {
        //保安培训公司备案
        this.$store.commit("changeuseWhere", val);
        console.log(this.dataCard[val].menuName);
      } else if (val == 4) {
        //自招保安单位备案撤销
        this.$store.commit("changeuseWhere", val);
        console.log(this.dataCard[val].menuName);
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.dtype {
  width: 80px;
}

.dx {
  position: absolute;
  top: 50%;
  margin-top: -5px;
  margin-left: 6px;
  width: 10px;
  height: 10px;
  border-radius: 30%;
  background: #DFDFDF;
}

.zc {
  position: absolute;
  top: 50%;
  margin-top: -5px;
  margin-left: 6px;
  width: 10px;
  height: 10px;
  border-radius: 30%;
  background: #29C093;
}

.yj {
  position: absolute;
  top: 50%;
  margin-top: -5px;
  margin-left: 6px;
  width: 10px;
  height: 10px;
  border-radius: 30%;
  background: #F34A4A;
}

.gz {
  position: absolute;
  top: 50%;
  margin-top: -5px;
  margin-left: 6px;
  width: 10px;
  height: 10px;
  border-radius: 30%;
  background: #F48F57;
}

.el-tag {
  display: inline-block;
  width: 80px;
  /*padding-right: 40px !important;*/

}

.layui-layer-setwin {
  position: absolute;
  right: 15px;
  right: 0;
  top: 15px;
  font-size: 0;
  line-height: initial;

  .layui-layer-close1 {
    color: #fff;
    background: url(/img/permit/close-btn.png) no-repeat;
    padding-right: 10px;
  }

  a {
    position: relative;
    width: 16px;
    height: 16px;
    margin-left: 10px;
    font-size: 12px;
    _overflow: hidden;
    display: inline-block;
  }
}

.close {
  position: absolute;
  right: 20px;
  top: 5px;
}

.hand-next {
  text-align: center;
  padding: 15px 0;
}

.first-box-outers {
  position: fixed;
  pointer-events: auto;
  z-index: 999;
<style lang="scss">
#examine {
  width: 100%;
  height: 80%;
  top: 120px;
  left: 340px;
  background-color: #fff;
  box-shadow: 1px 1px 50px rgba(0, 0, 0, .3);
  border-radius: 2px;

  max-height: 790px;
  max-width: 1240px;

  .first-box-titles {
    padding: 0 80px 0 20px;
    height: 42px;
    line-height: 42px;
    overflow: hidden;
    border-radius: 2px 2px 0 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0;
  height: 100%;
  overflow: hidden;
  box-sizing: border-box;
  .examine_heard {
    background-color: #25aff3;
    width: 100%;

  }

  .first-box-content {
    height: calc(100% - 42px);
  }

}

.first-box-outer {
  position: fixed;
  pointer-events: auto;
  z-index: 999;
  width: 100%;
  height: 90%;
  top: 30px;
  left: 340px;
  background-color: #fff;
  box-shadow: 1px 1px 50px rgba(0, 0, 0, .3);
  border-radius: 2px;

  max-height: 790px;
  max-width: 1240px;

  .first-box-title {
    padding: 0 80px 0 20px;
    height: 42px;
    line-height: 42px;
    overflow: hidden;
    border-radius: 2px 2px 0 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0;

  }

  .first-box-content {
    height: calc(100% - 42px);
    overflow-y: auto;

    .handling-guideline {
      .hand-title {
        text-align: center;
        font-size: 20px;
    padding-left: 30px;
    box-sizing: border-box;
    height: 50px;
    color: #ffffff;
    font-size: 24px;
    line-height: 50px;
    .e_h_right {
      float: right;
      margin-right: 20px;
      img {
        display: inline-block;
        vertical-align: middle;
      }
      span {
        font-style: normal;
        color: #ffffff;
        font-size: 16px;
        line-height: 50px;
        font-weight: 600;
        display: inline-block;
        margin: 0;
        padding-left: 4px;
      }

      .hand-content {
        width: 1000px;
        padding: 30px;
        margin: 0 auto;
        margin-bottom: 0px;
        background: #f9f9f9;
        margin-bottom: 15px;

        p {
          font-size: 14px;
          line-height: 28px;

          label {
            font-weight: bold;
          }
        }
      div {
        display: inline;
        margin-left: 15px;
        color: #ffffff;
        font-size: 16px;
        line-height: 50px;
      }
    }

  }

}

.layui-layer-setwin {
  position: absolute;
  right: 15px;
  right: 0;
  top: 15px;
  font-size: 0;
  line-height: initial;
}

.detail-box {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 50px;
  margin: auto;
  width: 600px;
  height: 420px;
  background: #fff;

  .radio-custom {
    position: relative;

    input {
      position: absolute;
      top: 4px;
      left: 0px;
    }
  }

}

.radio-custom {
  margin-top: 15px;
}

.layui-layer-title {
  background: #2575eb;
  color: #fff;
  border: none;
  font-size: 16px;
  text-align: center;
}

.radio-custom label {
  min-height: 22px;
  line-height: 22px;
  margin-bottom: 0;
  font-weight: 300;
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  padding-left: 30px;
  margin-left: 25px;
  color: black;
  font-weight: 700;
}

.radio-custom .handling-guideline {
  margin-left: 50px;
  margin-right: 25px;
  margin-top: 5px;
}

//#barcon {
//  position: fixed;
//  top: calc(50% - 200px);
//  left: calc(50% - 200px);
//  z-index: 10;
//  //top: 0;
//  width: 400px;
//  height: 400px;
//  background-color: red;
//}
.main {
  width: 80%;
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  position: absolute;
  top: 20%;
  right: 0;
  left: 0;
  bottom: auto;
  margin: auto;

  .item-box {
    width: calc(25% - 12px);
    height: 280px;
    position: relative;
    margin: 6px;
    background: rgb(255, 255, 255);
    border-radius: 10px;

    .box-top {
      position: absolute;
      top: 0px;
      left: 0px;
      width: calc(100%);
      height: calc(100% - 36px);
      border-radius: 10px 10px 0 0;

      .img-box {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: rgba(17, 17, 17, 0.568);

        img {
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;
          margin: auto;
          width: 24px;
          height: 24px;
        }
      }
    }

    .box-bottom {
      position: absolute;
      bottom: 0;
      left: 0;
  .examine_body {
    width: 100%;
    height: calc(100% - 50px);
    .title {
      width: 100%;
      height: 36px;
      line-height: 36px;
      text-align: center;
      background: white;
      border-radius: 0 0 10px 10px;
      height: 200px;
      // border: 1px solid red;
      display: flex;
      align-items: center;
      padding-bottom: 120px;
      box-sizing: border-box;
      justify-content: center;
      button {
        position: relative;
        left: 30%;
        border: 1px solid rgba($color: #000000, $alpha: 0.3);
        border-radius: 5px;
        height: 25px;
        width: 140px;
        text-align: center;
        background-color: #fff;
      }
    }
    .b_main {
      width: 100%;
      height: calc(100% - 220px);
      // border: 1px solid red;
      padding: 0 10%;
      box-sizing: border-box;
    }
  }
  .zhezhao {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba($color: #000000, $alpha: 0.2);
  }
  .Approval,
  .securityPermit {
    position: absolute;
    top: calc(10%);
    left: calc(50% - 621px);
    width: 1243px;
    // height: 766px;
  }
  .ApprovalClose {
    position: absolute;
    top: 17px;
    font-size: 20px;
    right: 11px;
    z-index: 10;
    &:hover {
      color: red;
    }
  }
}
</style>

//弹窗样式
.heards {
  margin: 0 auto;
  width: calc(100% - 10px);
  height: 40px;
  position: relative;
  top: 10px;
  color: #fff;
  border-radius: 10px 10px 0 0;
  text-align: center;
  line-height: 40px;
  left: 0;
  background-color: #25aff3;
}
.first-box-outer {
  width: 100%;
  max-height: 682px;
  overflow: scroll;
  .f-b-o-in {
    width: 100%;
    height: 620px;
    overflow: scroll;
  }
}
.handling-guideline {
  width: 85%;
  padding: 10px;
  margin: 0 auto;
  background-color: rgba($color: #a1a1a1, $alpha: 0.3);
}
.hand-next {
  margin-top: 15px;
  width: 100%;
  display: flex;
  justify-content: center;
}
</style>