Merge branch 'master' of http://s16s652780.51mypc.cn:49896/r/zhba_regulatory

shuishen

2021-09-03 2d50c51214f0ced8c992a415c72ea33b519fff59

Merge branch 'master' of http://s16s652780.51mypc.cn:49896/r/zhba_regulatory

 public/favicon.png

 public/index.html

@@ -81,6 +81,10 @@
      color: #ABABAB;
      font-size: 12px;
    }
    .el-tooltip__popper.is-dark{
      z-index: 11111111 !important;
      background: #031952;
    }
  </style>
</head>


 src/api/index/index.js

@@ -19,27 +19,28 @@
    method: "get"
  });
};
export const getLiveLocationVoList = (params) => {
export const getLiveLocationVoList = params => {
  return request({
    url: "/api/liveLocation/getLiveLocationVoList",
    method: "get",
    params: params
  });
};
// 获取辖区列表
export const lazyTreeJu = () => {
  return request({
    url: "/api/information/lazyTreeJu",
    method: "post"
  });
};
export const noholderNum = (params) => {
export const noholderNum = params => {
  return request({
    url: "/api/information/selectInCount",
    method: "post",
    params: params
  });
};
export const noSocialSecurity = (params) => {
export const noSocialSecurity = params => {
  return request({
    url: "/api/information/selectCs",
    method: "post",
@@ -49,39 +50,103 @@
export const selectFj = () => {
  return request({
    url: "/api/information/selectFj",
    method: "post",
    method: "post"
  });
};
export const selectBx = (params) => {
export const selectBx = params => {
  return request({
    url: "/api/information/selectBx",
    method: "post",
    params: params
  });
};
export const selectExtype = (params) => {
export const selectExtype = params => {
  return request({
    url: "/api/information/selectExtype",
    method: "post",
    params: params
  });
};
export const seCountUg = (params) => {
export const seCountUg = params => {
  return request({
    url: "/api/information/seCountUg",
    method: "post",
    params: params
  });
};
export const seCountI = (params) => {
export const seCountI = params => {
  return request({
    url: "/api/information/seCountI",
    method: "post",
    params: params
  });
};
export const selectExtypeUser = () => {
  return request({
    url: "/api/information/selectExtypeUser",
    method: "post"
  });
};
// 资格审查异常人员清单
export const qualificationPages = params => {
  return request({
    url: "/api/blade-user/pages",
    method: "get",
    params: params
  });
};
// 监管处罚数量
export const selectCf = params => {
  return request({
    url: "/api/information/selectCf",
    method: "post",
    params: params
  });
};
// 监管处罚公司清单
export const punishList = params => {
  return request({
    url: "/api/punish/page",
    method: "get",
    params: params
  });
};
// 公司材料不全数量
export const selectCl = () => {
  return request({
    url: "/api/information/selectCl",
    method: "post"
  });
};
// 有名无实
export const selectYs = params => {
  return request({
    url: "/api/information/selectYs",
    method: "post",
    params: params
  });
};
// 经营不善
export const selectJy = params => {
  return request({
    url: "/api/information/selectJy",
    method: "post",
    params: params
  });
};
// 违规经营
export const selectWg = params => {
  return request({
    url: "/api/information/selectWg",
    method: "post",
    params: params
  });
};

 



// 获取树形辖区
export const lazyTrees = () => {
  return request({
    url: "/api/jurisdiction/lazy-trees",
    method: "get"
  });
};

 src/api/licenseApproval/permit.js

New file
@@ -0,0 +1,50 @@
import request from '@/router/axios';

export const getList = (current, size, params) => {
  return request({
    url: '/api/permit/list',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}

export const getDetail = (id) => {
  return request({
    url: '/api/permit/detail',
    method: 'get',
    params: {
      id
    }
  })
}

export const remove = (ids) => {
  return request({
    url: '/api/permit/remove',
    method: 'post',
    params: {
      ids,
    }
  })
}

export const add = (row) => {
  return request({
    url: '/api/permit/save',
    method: 'post',
    data: row
  })
}

export const update = (row) => {
  return request({
    url: '/api/permit/update',
    method: 'post',
    data: row
  })
}


 src/api/licenseApproval/record.js

New file
@@ -0,0 +1,50 @@
import request from '@/router/axios';

export const getList = (current, size, params) => {
  return request({
    url: '/api/record/list',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}

export const getDetail = (id) => {
  return request({
    url: '/api/record/detail',
    method: 'get',
    params: {
      id
    }
  })
}

export const remove = (ids) => {
  return request({
    url: '/api/record/remove',
    method: 'post',
    params: {
      ids,
    }
  })
}

export const add = (row) => {
  return request({
    url: '/api/record/submit',
    method: 'post',
    data: row
  })
}

export const update = (row) => {
  return request({
    url: '/api/record/update',
    method: 'post',
    data: row
  })
}


 src/api/licenseApproval/recordk.js

New file
@@ -0,0 +1,50 @@
import request from '@/router/axios';

export const getList = (current, size, params) => {
  return request({
    url: '/api/recordk/list',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}

export const getDetail = (id) => {
  return request({
    url: '/api/recordk/detail',
    method: 'get',
    params: {
      id
    }
  })
}

export const remove = (ids) => {
  return request({
    url: '/api/recordk/remove',
    method: 'post',
    params: {
      ids,
    }
  })
}

export const add = (row) => {
  return request({
    url: '/api/recordk/submit',
    method: 'post',
    data: row
  })
}

export const update = (row) => {
  return request({
    url: '/api/recordk/submit',
    method: 'post',
    data: row
  })
}


 src/api/licenseApproval/revoke.js

New file
@@ -0,0 +1,50 @@
import request from '@/router/axios';

export const getList = (current, size, params) => {
  return request({
    url: '/api/revoke/list',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}

export const getDetail = (id) => {
  return request({
    url: '/api/revoke/detail',
    method: 'get',
    params: {
      id
    }
  })
}

export const remove = (ids) => {
  return request({
    url: '/api/revoke/remove',
    method: 'post',
    params: {
      ids,
    }
  })
}

export const add = (row) => {
  return request({
    url: '/api/revoke/submit',
    method: 'post',
    data: row
  })
}

export const update = (row) => {
  return request({
    url: '/api/revoke/submit',
    method: 'post',
    data: row
  })
}


 src/api/permit/permit.js

@@ -42,7 +42,7 @@

export const update = (row) => {
  return request({
    url: '/api/permit/submit',
    url: '/api/permit/update',
    method: 'post',
    data: row
  })

 src/api/register/honor.js

@@ -70,4 +70,14 @@
            userIds
        }
    })
}

export const getER = (securityNumber) => {
    return request({
        url: '/api//qrCode/getQrCodeBase64',
        method: 'get',
        params: {
            securityNumber
        }
    })
}

 src/api/resource/attachOnce.js

New file
@@ -0,0 +1,53 @@
import request from '@/router/axios';

export const getList = (current, size, params, cardid, type) => {
  return request({
    url: '/api/blade-resource/attach/list',
    method: 'get',
    params: {
      ...params,
      current,
      size,
      cardid,
      type,
    }
  })
}

export const getDetail = (id) => {
  return request({
    url: '/api/blade-resource/attach/detail',
    method: 'get',
    params: {
      id
    }
  })
}

export const remove = (ids) => {
  return request({
    url: '/api/blade-resource/attach/remove',
    method: 'post',
    params: {
      ids,
    }
  })
}


export const add = (row) => {
  return request({
    url: '/api/blade-resource/attach/submit',
    method: 'post',
    data: row
  })
}

export const update = (row) => {
  return request({
    url: '/api/blade-resource/attach/submit',
    method: 'post',
    data: row
  })
}


 src/api/securityCompany/security.js

@@ -2,6 +2,19 @@

export const getList = (current, size, params, stats) => {
  return request({
    url: '/api/information/page',
    method: 'get',
    params: {
      ...params,
      current,
      size,
      stats
    }
  })
}

export const getListold = (current, size, params, stats) => {//2021.8.25因内网公司接口需要同步成外网公司接口 舍弃
  return request({
    url: '/api/information/list',
    method: 'get',
    params: {

 src/api/securityUnitOperation/securityUnitOperation.js

@@ -54,4 +54,32 @@
        method: "get",
        params: params
    });
};
export const queryYearPz = (params) => {
    return request({
        url: "/api/information/queryYearPz",
        method: "get",
        params: params
    });
};
export const selectTb = (params) => {
    return request({
        url: "/api/information/selectTb",
        method: "post",
        params: params
    });
};
export const selectJj = (params) => {
    return request({
        url: "/api/information/selectJj",
        method: "post",
        params: params
    });
};
export const selectAge = (params) => {
    return request({
        url: "/api/information/selectAge",
        method: "post",
        params: params
    });
};

 src/api/statisticalQueryManagement/statisticalQueryManagement.js

New file
@@ -0,0 +1,63 @@
import request from "@/router/axios";
export const selectLi = (params) => {
    return request({
        url: "/api/information/selectLi",
        method: "post",
        params: params
    });
};
export const selectYw = (params) => {
    return request({
        url: "/api/information/selectYw",
        method: "post",
        params: params
    });
};
export const selectUIn = (params) => {
    return request({
        url: "/api/information/selectUIn",
        method: "post",
        params: params
    });
};
export const selectDis = (params) => {
    return request({
        url: "/api/information/selectDis",
        method: "post",
        params: params
    });
};
// 服务单位下拉接口
export const selectFw = (params) => {
    return request({
        url: "/api/information/selectFw",
        method: "post",
        params: params
    });
};
// 查保安员明细
export const pageSecurity = (params) => {
    return request({
        url: "/api/blade-user/page-security",
        method: "get",
        params: params
    });
};

// 服务对象明细
export const fwList = (params) => {
    return request({
        url: "/api/dispatcherUnit/list",
        method: "get",
        params: params
    });
};

// 单位类型
export const dictionaryList = () => {
    return request({
        url: "/api/blade-system/dict-biz/dictionary?code=stats",
        method: "get",
    });
};


 src/api/talk/talk.js

New file
@@ -0,0 +1,50 @@
import request from '@/router/axios';

export const getList = (current, size, params) => {
  return request({
    url: '/api/blade-talk/talk/page',
    method: 'get',
    params: {
      ...params,
      current,
      size,
    }
  })
}

export const getDetail = (id) => {
  return request({
    url: '/api/blade-talk/talk/detail',
    method: 'get',
    params: {
      id
    }
  })
}

export const remove = (ids) => {
  return request({
    url: '/api/blade-talk/talk/remove',
    method: 'post',
    params: {
      ids,
    }
  })
}

export const add = (row) => {
  return request({
    url: '/api/blade-talk/talk/save',
    method: 'post',
    data: row
  })
}

export const update = (row) => {
  return request({
    url: '/api/blade-talk/talk/update',
    method: 'post',
    data: row
  })
}


 src/config/website.js

@@ -30,6 +30,19 @@
    group: [],
    close: false
  },
  //配置权限分别的首页
  jurisdiction: [
    {
      userNames: '管理员',
      label: '本市保安公司',
      value: '/securityCompany/security'
    },
    {
      userNames: '保安',
      label: '保安员查询',
      value: '/securityGuardManagement/register'
    },
  ],
  //配置菜单的属性
  menu: {
    iconDefault: 'iconfont icon-caidan',

 src/lang/zh.js

@@ -1,3 +1,5 @@
import website from '@/config/website';

export default {
  tip: '提示',
  title: '保安监管系统',
@@ -52,7 +54,7 @@
    info: '个人信息',
    website: 'bladex官网',
    avuexwebsite: 'avuex官网',
    dashboard: '保安员查询',
    dashboard: website.fistPage.label,
    more: '更多',
    tags: '标签',
    store: '本地存储',

 src/page/index/tags.vue

@@ -1,186 +1,202 @@
<template>
  <div class="avue-tags"
       v-if="showTag">
  <div class="avue-tags" v-if="showTag">
    <!-- tag盒子 -->
    <div v-if="contextmenuFlag"
         class="avue-tags__contentmenu"
         :style="{left:contentmenuX+'px',top:contentmenuY+'px'}">
      <div class="item"
           @click="clearCacheTags">{{$t('tagsView.clearCache')}}
    <div
      v-if="contextmenuFlag"
      class="avue-tags__contentmenu"
      :style="{ left: contentmenuX + 'px', top: contentmenuY + 'px' }"
    >
      <div class="item" @click="clearCacheTags">
        {{ $t("tagsView.clearCache") }}
      </div>
      <div class="item"
           @click="closeOthersTags">{{$t('tagsView.closeOthers')}}
      <div class="item" @click="closeOthersTags">
        {{ $t("tagsView.closeOthers") }}
      </div>
      <div class="item"
           @click="closeAllTags">{{$t('tagsView.closeAll')}}
      <div class="item" @click="closeAllTags">
        {{ $t("tagsView.closeAll") }}
      </div>
    </div>
    <div class="avue-tags__box"
         :class="{'avue-tags__box--close':!website.isFirstPage}">
      <el-tabs v-model="active"
               type="card"
               @contextmenu.native="handleContextmenu"
               :closable="tagLen!==1"
               @tab-click="openTag"
               @edit="menuTag">
        <el-tab-pane :key="item.value"
                     v-for="item in tagList"
                     :label="generateTitle(item)"
                     :name="item.value">
    <div
      class="avue-tags__box"
      :class="{ 'avue-tags__box--close': !website.isFirstPage }"
    >
      <el-tabs
        v-model="active"
        type="card"
        @contextmenu.native="handleContextmenu"
        :closable="tagLen !== 1"
        @tab-click="openTag"
        @edit="menuTag"
      >
        <el-tab-pane
          :key="item.value"
          v-for="item in tagList"
          :label="generateTitle(item)"
          :name="item.value"
        >
        </el-tab-pane>

      </el-tabs>
      <el-dropdown class="avue-tags__menu">
        <el-button type="primary"
                   size="mini">
          {{$t('tagsView.menu')}}
        <el-button type="primary" size="mini">
          {{ $t("tagsView.menu") }}
          <i class="el-icon-arrow-down el-icon--right"></i>
        </el-button>
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item @click.native="$parent.isSearch=true">{{$t('tagsView.search')}}</el-dropdown-item>
          <el-dropdown-item @click.native="closeOthersTags">{{$t('tagsView.closeOthers')}}</el-dropdown-item>
          <el-dropdown-item @click.native="closeAllTags">{{$t('tagsView.closeAll')}}</el-dropdown-item>
          <el-dropdown-item @click.native="clearCacheTags">{{$t('tagsView.clearCache')}}</el-dropdown-item>
          <el-dropdown-item @click.native="$parent.isSearch = true">{{
            $t("tagsView.search")
          }}</el-dropdown-item>
          <el-dropdown-item @click.native="closeOthersTags">{{
            $t("tagsView.closeOthers")
          }}</el-dropdown-item>
          <el-dropdown-item @click.native="closeAllTags">{{
            $t("tagsView.closeAll")
          }}</el-dropdown-item>
          <el-dropdown-item @click.native="clearCacheTags">{{
            $t("tagsView.clearCache")
          }}</el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
    </div>

  </div>
</template>
<script>
  import {mapGetters, mapState} from "vuex";
  import {clearCache} from "@/api/user";
import { mapGetters, mapState } from "vuex";
import { clearCache } from "@/api/user";

  export default {
    name: "tags",
    data() {
      return {
        active: "",
        contentmenuX: "",
        contentmenuY: "",
        contextmenuFlag: false
      };
    },
    created() {
    },
    mounted() {
export default {
  name: "tags",
  data() {
    return {
      active: "",
      contentmenuX: "",
      contentmenuY: "",
      contextmenuFlag: false,
    };
  },
  created() {},
  mounted() {
    this.setActive();
    // if(this.userInfo.role_name == )
    // console.log(this.website, "website");//改变首页
  },
  watch: {
    tag() {
      this.setActive();
    },
    watch: {
      tag() {
        this.setActive();
      },
      contextmenuFlag() {
        window.addEventListener("mousedown", this.watchContextmenu);
    contextmenuFlag() {
      window.addEventListener("mousedown", this.watchContextmenu);
    },
  },
  computed: {
    ...mapGetters(["tagWel", "tagList", "tag", "website", "userInfo"]),
    ...mapState({
      showTag: (state) => state.common.showTag,
    }),
    tagLen() {
      return this.tagList.length || 0;
    },
  },
  methods: {
    generateTitle(item) {
      return this.$router.$avueRouter.generateTitle(
        item.label,
        (item.meta || {}).i18n
      );
    },
    watchContextmenu(event) {
      if (!this.$el.contains(event.target) || event.button !== 0) {
        this.contextmenuFlag = false;
      }
      window.removeEventListener("mousedown", this.watchContextmenu);
    },
    handleContextmenu(event) {
      let target = event.target;
      // 解决 https://github.com/d2-projects/d2-admin/issues/54
      let flag = false;
      if (target.className.indexOf("el-tabs__item") > -1) flag = true;
      else if (target.parentNode.className.indexOf("el-tabs__item") > -1) {
        target = target.parentNode;
        flag = true;
      }
      if (flag) {
        event.preventDefault();
        event.stopPropagation();
        this.contentmenuX = event.clientX;
        this.contentmenuY = event.clientY;
        this.tagName = target.getAttribute("aria-controls").slice(5);
        this.contextmenuFlag = true;
      }
    },
    computed: {
      ...mapGetters(["tagWel", "tagList", "tag", "website"]),
      ...mapState({
        showTag: state => state.common.showTag
      }),
      tagLen() {
        return this.tagList.length || 0;
    //激活当前选项
    setActive() {
      this.active = this.tag.value;
    },
    menuTag(value, action) {
      if (action === "remove") {
        let { tag, key } = this.findTag(value);
        this.$store.commit("DEL_TAG", tag);
        if (tag.value === this.tag.value) {
          tag = this.tagList[key === 0 ? key : key - 1]; //如果关闭本标签让前推一个
          this.openTag(tag);
        }
      }
    },
    methods: {
      generateTitle(item) {
        return this.$router.$avueRouter.generateTitle(
          item.label,
          (item.meta || {}).i18n
        );
      },
      watchContextmenu(event) {
        if (!this.$el.contains(event.target) || event.button !== 0) {
          this.contextmenuFlag = false;
        }
        window.removeEventListener("mousedown", this.watchContextmenu);
      },
      handleContextmenu(event) {
        let target = event.target;
        // 解决 https://github.com/d2-projects/d2-admin/issues/54
        let flag = false;
        if (target.className.indexOf("el-tabs__item") > -1) flag = true;
        else if (target.parentNode.className.indexOf("el-tabs__item") > -1) {
          target = target.parentNode;
          flag = true;
        }
        if (flag) {
          event.preventDefault();
          event.stopPropagation();
          this.contentmenuX = event.clientX;
          this.contentmenuY = event.clientY;
          this.tagName = target.getAttribute("aria-controls").slice(5);
          this.contextmenuFlag = true;
        }
      },
      //激活当前选项
      setActive() {
        this.active = this.tag.value;
      },
      menuTag(value, action) {
        if (action === "remove") {
          let {tag, key} = this.findTag(value);
          this.$store.commit("DEL_TAG", tag);
          if (tag.value === this.tag.value) {
            tag = this.tagList[key === 0 ? key : key - 1]; //如果关闭本标签让前推一个
            this.openTag(tag);
          }
        }
      },
      openTag(item) {
        let tag;
        if (item.name) {
          tag = this.findTag(item.name).tag;
        } else {
          tag = item;
        }
        this.$router.push({
          path: this.$router.$avueRouter.getPath({
    openTag(item) {
      let tag;
      if (item.name) {
        tag = this.findTag(item.name).tag;
      } else {
        tag = item;
      }
      this.$router.push({
        path: this.$router.$avueRouter.getPath(
          {
            name: tag.label,
            src: tag.value
          }, tag.meta),
          query: tag.query
            src: tag.value,
          },
          tag.meta
        ),
        query: tag.query,
      });
    },
    closeOthersTags() {
      this.contextmenuFlag = false;
      this.$store.commit("DEL_TAG_OTHER");
    },
    findTag(value) {
      let tag, key;
      this.tagList.map((item, index) => {
        if (item.value === value) {
          tag = item;
          key = index;
        }
      });
      return { tag: tag, key: key };
    },
    closeAllTags() {
      this.contextmenuFlag = false;
      this.$store.commit("DEL_ALL_TAG");
      this.$router.push({
        path: this.$router.$avueRouter.getPath({
          src: this.tagWel.value,
        }),
        query: this.tagWel.query,
      });
    },
    clearCacheTags() {
      this.$confirm("是否需要清除缓存?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        clearCache().then(() => {
          this.contextmenuFlag = false;
          this.$message.success("清除完毕");
        });
      },
      closeOthersTags() {
        this.contextmenuFlag = false;
        this.$store.commit("DEL_TAG_OTHER");
      },
      findTag(value) {
        let tag, key;
        this.tagList.map((item, index) => {
          if (item.value === value) {
            tag = item;
            key = index;
          }
        });
        return {tag: tag, key: key};
      },
      closeAllTags() {
        this.contextmenuFlag = false;
        this.$store.commit("DEL_ALL_TAG");
        this.$router.push({
          path: this.$router.$avueRouter.getPath({
            src: this.tagWel.value
          }),
          query: this.tagWel.query
        });
      },
      clearCacheTags() {
        this.$confirm("是否需要清除缓存?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          clearCache().then(() => {
            this.contextmenuFlag = false;
            this.$message.success('清除完毕');
          })
        });
      }
    }
  };
      });
    },
  },
};
</script>



 src/router/views/index.js

@@ -177,6 +177,20 @@
        }]
    },
    {
        path: '/securityGuardManagement',
        redirect: '/securityGuardManagement/registerOnce',
        component: Layout,
        children: [{
            path: 'registerOnce',
            name: '公司保安员详情',
            meta: {
                i18n: 'registerOnce',
            },
            component: () =>
                import( /* webpackChunkName: "views" */ '@/views/securityGuardManagement/registerOnce')
        }]
    },
    {
        path: '/desk',
        component: Layout,
        redirect: '/desk/notice',
@@ -262,7 +276,7 @@
        component: Layout,
        children: [{
            path: 'index',
            name: '保安详细资料',
            name: '保安公司详细资料',
            meta: {
                i18n: 'index',
            },
@@ -327,21 +341,49 @@
            component: () =>
                import( /* webpackChunkName: "views" */ '@/views/securityUnitOperation/operationTable')
        }]
    }, 
    },
    // {
    //     path: '/securityUnitOperation/economicTable',
    //     redirect: '/securityUnitOperation/economicTable/index',
    //     component: Layout,
    //     children: [{
    //         path: 'index',
    //         name: '公司经济情况智能分析详情表',
    //         meta: {
    //             i18n: 'index',
    //         },
    //         component: () =>
    //             import( /* webpackChunkName: "views" */ '@/views/securityUnitOperation/economicTable')
    //     }]
    // },
    {
        path: '/securityUnitOperation/economicTable',
        redirect: '/securityUnitOperation/economicTable/index',
        path: '/statisticalQueryManagement/companyDetails',
        redirect: '/statisticalQueryManagement/companyDetails/index',
        component: Layout,
        children: [{
            path: 'index',
            name: '公司经济情况智能分析详情表',
            name: '保安公司人员详情',
            meta: {
                i18n: 'index',
            },
            component: () =>
                import( /* webpackChunkName: "views" */ '@/views/securityUnitOperation/economicTable')
                import( /* webpackChunkName: "views" */ '@/views/statisticalQueryManagement/companyDetails')
        }]
    },
    // {
    //     path: '/securityUnitOperation/economicTable',
    //     redirect: '/securityUnitOperation/economicTable/index',
    //     component: Layout,
    //     children: [{
    //         path: 'index',
    //         name: '公司经济情况智能分析详情表',
    //         meta: {
    //             i18n: 'index',
    //         },
    //         component: () =>
    //             import( /* webpackChunkName: "views" */ '@/views/securityUnitOperation/economicTable')
    //     }]
    // },
    {
        path: '/statisticalQueryManagement/companyDetails',
        redirect: '/statisticalQueryManagement/companyDetails/index',
@@ -371,31 +413,57 @@
        }]
    },
    {
        path: '/statisticalQueryManagement/companyDetails',
        redirect: '/statisticalQueryManagement/companyDetails/index',
        path: '/statisticalQueryManagement/businessStatisticsDetail',
        redirect: '/statisticalQueryManagement/businessStatisticsDetail/index',
        component: Layout,
        children: [{
            path: 'index',
            name: '保安公司人员详情',
            name: '业务情况明细',
            meta: {
                i18n: 'index',
            },
            component: () =>
                import( /* webpackChunkName: "views" */ '@/views/statisticalQueryManagement/companyDetails')
                import( /* webpackChunkName: "views" */ '@/views/statisticalQueryManagement/businessStatisticsDetail')
        }]
    },
    {
        path: '/securityUnitOperation/economicTable',
        redirect: '/securityUnitOperation/economicTable/index',
        path: '/statisticalQueryManagement/securityGuardDetail',
        redirect: '/statisticalQueryManagement/securityGuardDetail/index',
        component: Layout,
        children: [{
            path: 'index',
            name: '公司经济情况智能分析详情表',
            name: '保安员明细',
            meta: {
                i18n: 'index',
            },
            component: () =>
                import( /* webpackChunkName: "views" */ '@/views/securityUnitOperation/economicTable')
                import( /* webpackChunkName: "views" */ '@/views/statisticalQueryManagement/securityGuardDetail')
        }]
    }, {
        path: '/attachOnce',
        redirect: '/resource/attachOnce',
        component: Layout,
        children: [{
            path: 'index',
            name: '附件查看',
            meta: {
                i18n: 'index',
            },
            component: () =>
                import( /* webpackChunkName: "views" */ '@/views/resource/attachOnce')
        }]
    }, {
        path: '/talk',
        redirect: '/talk/talk',
        component: Layout,
        children: [{
            path: 'index',
            name: '心理咨询',
            meta: {
                i18n: 'index',
            },
            component: () =>
                import( /* webpackChunkName: "views" */ '@/views/talk/talk')
        }]
    }
]

 src/styles/element-ui.scss

@@ -415,7 +415,7 @@
//去除表格底部线
.el-table td,
.el-table th.is-leaf {
  border: 1px solid transparent;
  border: 1px solid rgba($color: #ffffff, $alpha: 0.2);
}
// //顶部搜索栏
// .el-card.is-never-shadow.avue-crud__search {
@@ -587,3 +587,32 @@
.el-range-editor--mini .el-range-input {
  background-color: transparent !important;
}

// 右侧弹窗  表格显影功能  背景
.el-drawer__open .el-drawer.rtl {
  background-color: $mainB !important;
}

// .registersss .avue-form__menu {
//   position: relative;
//   width: 100%;
//   display: flex;
//   flex-direction: row-reverse;
// }

.rowClickSelf {
  // border: 1px solid #2593ee !important;
  &:hover {
    cursor: pointer;
  }
}

//格子
// .el-table th.is-leaf {
//   border: 1px solid #fff;
//   box-sizing: border-box;
// }

.avue-empty__desc {
  color: #fff !important;
}

 src/views/desk/notice.vue

@@ -27,7 +27,7 @@
          size="small"
          icon="el-icon-delete"
          plain
          v-if="deptCategory"
          v-if="permission.notice_delete"
          @click="handleDelete"
          >删 除
        </el-button>
@@ -37,16 +37,13 @@
        <el-tag>{{ row.categoryName }}</el-tag>
      </template>
      <template slot-scope="{ type, size, row }" slot="menu">
        <el-button :size="size" :type="type" @click="handleUploadPage(row)"
        <el-button 
        :size="size" 
        :type="type" 
        @click="handleUploadPage(row)"
        v-if="permission.notice_upload"
          >附件上传
        </el-button>
        <!-- <el-button
          v-if="!deptCategory"
          :size="size"
          :type="type"
          @click="handleUploadPage(row)"
          >附件查看
        </el-button> -->
      </template>
    </avue-crud>
  </basic-container>
@@ -239,6 +236,7 @@
    rowSave(row, done, loading) {
      row.category = 2;
      row.deptId = this.deptId;
      row['type'] = 1;
      add(row).then(
        () => {
          this.onLoad(this.page);
@@ -357,6 +355,7 @@
      if (this.deptId != 1123598813738675201) {
        params["deptId"] = this.deptId;
      }
      params["type"] = 1;
      const { releaseTimeRange } = this.query;

      let values = {

 src/views/home/echarts-auto-tooltip.js

@@ -19,7 +19,7 @@

     echartAutoTools.loopShowTooltip = function (chart, chartOption, options) {
        var defaultOptions = {
            interval: 2000,
            interval: 10000,
            loopSeries: false,
            seriesIndex: 1,
            updateData: null

 src/views/home/index.scss

@@ -222,8 +222,8 @@
        width: 44px;
        height: 56px;
        position: absolute;
        margin-left: -7px;
        margin-top: -9px;
        left: -7px;
        top: -9px;
      }
      .leftbottom {
        background: url("../../../public/img/bajgxt/leftbottom.png") no-repeat;
@@ -231,8 +231,8 @@
        width: 44px;
        height: 56px;
        position: absolute;
        margin-left: -7px;
        margin-top: calc(40% - 66px);
        left: -7px;
        bottom: -7px;
      }
      .righttop {
        background: url("../../../public/img/bajgxt/righttop.png") no-repeat;
@@ -240,8 +240,8 @@
        width: 44px;
        height: 56px;
        position: absolute;
        margin-left: calc(100% - 37px);
        margin-top: -9px;
        left: calc(100% - 37px);
        top: -9px;
      }
      .rightbottom {
        background: url("../../../public/img/bajgxt/rightbottom.png") no-repeat;
@@ -249,39 +249,42 @@
        width: 44px;
        height: 56px;
        position: absolute;
        margin-left: calc(100% - 37px);
        margin-top: calc(40% - 66px);
        left: calc(100% - 37px);
        bottom: -7px;
      }
    }
  }
  .el-table {
    width: calc(100% - 40px);
    height: calc(100% - 65px);
    margin: 0px 20px 15px;
    top: 50px;
  .middle {
    .el-table {
      width: calc(100% - 40px);
      height: calc(100% - 65px);
      margin: 0px 20px 15px;
      top: 50px;
    }
    /deep/ .el-table--striped .el-table__body tr.el-table__row--striped td {
      background: #031d4b !important;
    }
    /deep/ .el-table--enable-row-transition .el-table__body td,
    /deep/ .el-table th,
    .el-table tr {
      background: #03225b !important;
    }
    /deep/ .el-table .cell {
      color: #fff;
      text-align: center;
    }
    /deep/ .el-table td,
    .el-table th.is-leaf {
      border-bottom-color: transparent;
    }
    /deep/ .el-table__header th {
      border-bottom: 1px solid #031a38 !important;
    }
    /deep/.el-table--enable-row-hover .el-table__body tr:hover > td {
      background-color: #b0caf3;
    }
  }
  /deep/ .el-table--striped .el-table__body tr.el-table__row--striped td {
    background: #031d4b !important;
  }
  /deep/ .el-table--enable-row-transition .el-table__body td,
  /deep/ .el-table th,
  .el-table tr {
    background: #03225b !important;
  }
  /deep/ .el-table .cell {
    color: #fff;
    text-align: center;
  }
  /deep/ .el-table td,
  .el-table th.is-leaf {
    border-bottom-color: transparent;
  }
  /deep/ .el-table__header th{
    border-bottom: 1px solid #031a38 !important;
  }
  /deep/.el-table--enable-row-hover .el-table__body tr:hover > td {
    background-color: #b0caf3;
  }

  /deep/ .el-input__inner {
    height: 27px;
    color: #fff !important;
@@ -339,7 +342,7 @@
    padding: 15px;
  }
  .card-list {
    margin: 15px 60px 10px 90px;
    margin: 15px 60px 10px 50px;
    display: flex;
    height: 55px;
    line-height: 55px;
@@ -424,190 +427,285 @@
    height: 100%;
  }
}
.left2-btn{
.left2-btn {
  height: 21px;
  width: 69px;
  background-color: #0445b5;
  background-color: #4478d0;
  color: #fff;
  font-size: 13px !important;
  font-weight: 700;
  color: #fff !important;

  line-height: 21px !important;
  text-align: center;
  position: absolute;
  cursor: pointer;
}
.left2-btn.btn1{
.left2-btn.btn1 {
  right: 106px;
  margin-top: 25px;
}
.left2-btn.btn2{
.left2-btn.btn2 {
  right: 25px;
  margin-top: 25px;
}
.left2-btn.date{
  margin-left: 74px;
.left2-btn.date {
  right: 47px;
  margin-top: 27px;
}
.left2-btn.mounce{
  margin-left: 208px;
.left2-btn.mounce {
  right: 47px;
  margin-top: 71px;
}
.left2-btn.all{
  right: 100px;
.left2-btn.all {
  right: 47px;
  margin-top: 114px;
}

.rightData{
    position: relative;
    color: #fff;
    background: #010945;
    border-radius: 11px;
    height: 52px;
    display: inline-flex;
    width: 174px;
    cursor: pointer;
    font-weight: 700;
    img {
      margin: 12px;
      height: 28px;
      width: 30px;
    }
    .text {
      width: 100px;
      text-align: center;
      // margin: 3px;
      line-height: 25px;
      span:nth-child(1) {
        width: 100%;
        display: block;
        font-size: 14px;
      }
      span:nth-child(2) {
        width: 100%;
        display: block;
        color: #00CCFF;
        font-size: 15px;
      }
    }
.rightData {
  position: relative;
  color: #fff;
  background: #010945;
  border-radius: 11px;
  height: 52px;
  display: inline-flex;
  width: 174px;
  cursor: pointer;
  font-weight: 700;
  img {
    margin: 12px;
    height: 28px;
    width: 30px;
  }
  .rightData1{
    margin-left: 42px;
    margin-top: 23px;
  }
  .rightData2{
    margin-left: 58px;
    margin-top: 23px;
  }
  .rightData3{
    margin-top: 21px;
    margin-left: 42px;
  }
  .rightData4{
    margin-top: 21px;
    margin-left: 58px;
  }
  .rightData5{
    margin-top: 8px;
    margin-left: 42px;
  }

  .textBox {
    width: 70%;
    height: 58px;
    // margin: 0 auto;
    overflow: hidden;
    position: absolute;
    text-align: left;
    color: #09b560;
    left: 20px;
    top: 20px;
    font-size: 15px;
    .text {
  .text {
    width: 100px;
    text-align: center;
    // margin: 3px;
    line-height: 25px;
    span:nth-child(1) {
      width: 100%;
      position: absolute;
      bottom: 0;
      display: block;
      font-size: 14px;
    }
    .slide-enter-active, .slide-leave-active {
      transition: all 0.5s linear;
    }
    .slide-enter{
      transform: translateY(20px) scale(1);
      opacity: 1;
    }
    .slide-leave-to {
      transform: translateY(-20px) scale(0.8);
      opacity: 0;
    span:nth-child(2) {
      width: 100%;
      display: block;
      color: #00ccff;
      font-size: 15px;
    }
  }
  .leftEchartTitle{
    height: 30px;
    display: flex;
    line-height: 30px;
    margin-top: 10px;
    margin-left: 28px;
}
.rightData1 {
  margin-left: 42px;
  margin-top: 23px;
}
.rightData2 {
  margin-left: 58px;
  margin-top: 23px;
}
.rightData3 {
  margin-top: 21px;
  margin-left: 42px;
}
.rightData4 {
  margin-top: 21px;
  margin-left: 58px;
}
.rightData5 {
  margin-top: 8px;
  margin-left: 42px;
}

.textBox {
  width: 70%;
  height: 58px;
  // margin: 0 auto;
  overflow: hidden;
  position: absolute;
  text-align: left;
  color: #09b560;
  left: 20px;
  top: 20px;
  font-size: 15px;
  .text {
    width: 100%;
    position: absolute;
    .block1{
      width: 23px;
      height: 13px;
      background: #2ec7c9;
      border-radius: 3px;
      margin-top: 9px;
    }
    span:nth-child(2){
      color: #fff;
      font-size: 13px;
      margin: 0px 10px 0px 3px;
    }
    span:nth-child(3){
      color: #2ec7c9;
    bottom: 0;
  }
  .slide-enter-active,
  .slide-leave-active {
    transition: all 0.5s linear;
  }
  .slide-enter {
    transform: translateY(20px) scale(1);
    opacity: 1;
  }
  .slide-leave-to {
    transform: translateY(-20px) scale(0.8);
    opacity: 0;
  }
}
.leftEchartTitle {
  height: 30px;
  display: flex;
  line-height: 30px;
  margin-top: 10px;
  margin-left: 28px;
  position: absolute;
  .block1 {
    width: 23px;
    height: 13px;
    background: #2ec7c9;
    border-radius: 3px;
    margin-top: 9px;
  }
  span:nth-child(2) {
    color: #fff;
    font-size: 13px;
    margin: 0px 10px 0px 3px;
  }
  span:nth-child(3) {
    color: #2ec7c9;
    font-size: 17px;
    font-weight: 700;
    display: block;
    width: 65px;
    text-align: center;
    }
    span:nth-child(4){
      font-size: 13px;
      color: #2ec7c9;
    }
  }
  .leftEchartTitle2{
    right: 35px;
    .block1{
      background: #b6a2de;
    }
    span:nth-child(3){
      color: #b6a2de;
  span:nth-child(4) {
    font-size: 13px;
    color: #2ec7c9;
  }
}
.leftEchartTitle2 {
  right: 35px;
  .block1 {
    background: #b6a2de;
  }
  span:nth-child(3) {
    color: #b6a2de;
    font-size: 15px;
    }
  }
  .leftEchartTitle3{
    margin-top: 37px;
    .block1{
      background: #5ab1ef;
    }
    span:nth-child(3){
      color: #5ab1ef;
}
.leftEchartTitle3 {
  margin-top: 37px;
  .block1 {
    background: #5ab1ef;
  }
  span:nth-child(3) {
    color: #5ab1ef;
    font-size: 15px;
    }
  }
  .leftEchartTitle4{
    margin-top: 37px;
    right: 22px;
    .block1{
      background: #ffb980;
    }
    span:nth-child(3){
      color: #ffb980;
}
.leftEchartTitle4 {
  margin-top: 37px;
  right: 36px;
  .block1 {
    background: #ffb980;
  }
  span:nth-child(2) {
    width: 77px;
  }
  span:nth-child(3) {
    color: #ffb980;
    font-size: 15px;
    }
  }
  .leftEchartTitle5{
    margin-top: 64px;
    .block1{
      background: #fc8452;
    }
    span:nth-child(3){
      color: #fc8452;
}
.leftEchartTitle5 {
  margin-top: 64px;
  .block1 {
    background: #fc8452;
  }
  span:nth-child(3) {
    color: #fc8452;
    font-size: 15px;
  }
}
.bayHover {
  background-color: #0445b5;
  color: #fff !important;
}
.leftEchartTitle.xbNan {
  right: 47px;
  margin-top: 76px;
  .block1 {
    width: 30px;
    height: 15px;
    background: #008dec;
    margin-top: 7px;
  }
  span:nth-child(2) {
    color: #fff;
    font-size: 13px;
  }
  span:nth-child(3) {
    color: #008dec;
    font-size: 17px;
  }
  span:nth-child(4) {
    font-size: 13px;
    color: #008dec;
  }
}
.leftEchartTitle.xbNv {
  right: 47px;
  margin-top: 135px;
  .block1 {
    width: 30px;
    height: 15px;
    background: #886eff;
    margin-top: 7px;
  }
  span:nth-child(2) {
    color: #fff;
    font-size: 13px;
  }
  span:nth-child(3) {
    color: #886eff;
    font-size: 17px;
  }
  span:nth-child(4) {
    font-size: 13px;
    color: #886eff;
  }
}
.showDialog:hover {
  cursor: pointer;
}
.bajgxt-home {
  /deep/.dialog {
    z-index: 10000000 !important;
    .el-table {
      top: 0px !important;
      margin: 0px !important;
      width: 100% !important;
      height: calc(100% - 50px) !important;
      .el-table__header {
        background-color: #2d5cc8 !important;
      }
      .el-table__body-wrapper {
        height: calc(100% - 50px);
        overflow-x: hidden;
        overflow-y: auto;
      }
    }
    .el-pagination {
      color: #a2a5a5;
    }
    .btn-prev,
    .btn-next {
      background: transparent !important;
    }
    .el-dialog__body {
      padding: 10px 20px;
      height: calc(100% - 60px);
      .el-input {
        width: 50px !important;
        border-bottom: 1px solid #8a7b7b !important;
      }
    }
  }


  /deep/ .el-dialog {
    width: 80% !important;
    height: 77%;
  }
}

 src/views/home/index.vue

@@ -26,7 +26,7 @@
          </div>
          <div class="leftEchartTitle leftEchartTitle3">
            <div class="block1"></div>
            <span>保安服务公司</span>
            <span>本市保安公司</span>
            <span>{{ leftData.fw }}</span>
            <span>个</span>
          </div>
@@ -38,7 +38,7 @@
          </div> -->
          <div class="leftEchartTitle leftEchartTitle4">
            <div class="block1"></div>
            <span>跨区域保安公司</span>
            <span>分公司</span>
            <span>{{ leftData.kqy }}</span>
            <span>个</span>
          </div>
@@ -48,12 +48,31 @@
          <div class="title-pane2">
            <img src="../../../public/img/bajgxt/icon1.png" />
            <span>保安员持证情况</span>
            <span class="left2-btn btn1" @click="getHolderNum(0)"
            <span
              class="left2-btn btn1"
              :class="[left2EchartType === 0 ? 'bayHover' : '']"
              @click="getHolderNum(0)"
              >辖区统计</span
            >
            <span class="left2-btn btn2" @click="getHolderNum(1)"
            <span
              class="left2-btn btn2"
              :class="[left2EchartType === 1 ? 'bayHover' : '']"
              @click="getHolderNum(1)"
              >男女结构</span
            >
          </div>

          <div v-if="left2EchartType === 1" class="leftEchartTitle xbNan">
            <div class="block1"></div>
            <span>男</span>
            <span>{{ leftData.nan }}</span>
            <span>人</span>
          </div>
          <div v-if="left2EchartType === 1" class="leftEchartTitle xbNv">
            <div class="block1"></div>
            <span>女</span>
            <span>{{ leftData.nv }}</span>
            <span>人</span>
          </div>
          <div id="left2Echart" v-loading="left2loading"></div>
        </div>
@@ -216,26 +235,51 @@
          <div class="title-pane1">
            <img src="../../../public/img/bajgxt/icon2.png" />
            <span>保安员预警统计</span>
            <el-select v-model="value1" @change="companyWarning">
            <!-- <el-select v-model="value1" @change="companyWarning">
              <el-option
                v-for="item in options1"
                :key="item.id"
                :label="item.title"
                :value="item.value"
              ></el-option>
            </el-select> -->
            <el-select
              ref="treeForm1"
              v-model="node1.title"
              placeholder="请选择"
            >
              <el-option style="height: auto" :value="node1">
                <el-tree
                  :data="options1"
                  default-expand-all
                  node-key="id"
                  @node-click="handleNodeClick1"
                  :props="props"
                >
                </el-tree>
              </el-option>
            </el-select>
          </div>
          <div class="right-content" v-loading="right1loading">
            <span class="left2-btn date" @click="getPoorPerformance(0)"
            <span
              class="left2-btn date"
              :class="[poorPerformanceType === 1 ? 'bayHover' : '']"
              @click="getPoorPerformance(1)"
              >当日</span
            >
            <span class="left2-btn mounce" @click="getPoorPerformance(1)"
            <span
              class="left2-btn mounce"
              :class="[poorPerformanceType === 2 ? 'bayHover' : '']"
              @click="getPoorPerformance(2)"
              >当月</span
            >
            <span class="left2-btn all" @click="getPoorPerformance(2)"
            <span
              class="left2-btn all"
              :class="[poorPerformanceType === 3 ? 'bayHover' : '']"
              @click="getPoorPerformance(3)"
              >全部</span
            >
            <div class="card-list" style="margin-top: 38px">
            <div class="card-list" style="margin-top: 21px">
              <img src="../../../public/img/bajgxt/u4.png" />
              <img src="../../../public/img/bajgxt/u256.png" />
              <img src="../../../public/img/bajgxt/u1.png" />
@@ -246,8 +290,12 @@
              <img src="../../../public/img/bajgxt/u4.png" />
              <img src="../../../public/img/bajgxt/u230.png" />
              <img src="../../../public/img/bajgxt/u1.png" />
              <span>{{ rightData.qualification }}</span>
              <span>资格审查异常</span>
              <span class="showDialog" @click="shoeDialog('zg')">{{
                rightData.qualification
              }}</span>
              <span class="showDialog" @click="shoeDialog('zg')"
                >资格审查异常</span
              >
            </div>
          </div>
          <!-- <div class="card-text"> -->
@@ -260,7 +308,7 @@
          <div class="title-pane1">
            <img src="../../../public/img/bajgxt/icon2.png" />
            <span>保安公司预警统计</span>
            <el-select
            <!-- <el-select
              v-model="value2"
              placeholder="请选择"
              @change="peoWarning"
@@ -271,35 +319,51 @@
                :label="item.title"
                :value="item.value"
              ></el-option>
            </el-select> -->
            <el-select
              ref="treeForm2"
              v-model="node2.title"
              placeholder="请选择"
            >
              <el-option style="height: auto" :value="node2">
                <el-tree
                  :data="options2"
                  default-expand-all
                  node-key="id"
                  @node-click="handleNodeClick2"
                  :props="props"
                >
                </el-tree>
              </el-option>
            </el-select>
          </div>
          <div class="right-content" v-loading="right2loading">
            <div class="rightData rightData1">
            <div class="rightData rightData1" @click="shoeDialog('wg')">
              <img src="../../../public/img/bajgxt/u231.png" alt />
              <div class="text">
                <span>数据未更新</span>
                <span>45条</span>
                <span>违规经营</span>
                <span>{{ rightData.wgNum }}个</span>
              </div>
            </div>
            <div class="rightData rightData2">
            <div class="rightData rightData2" @click="shoeDialog('jy')">
              <img src="../../../public/img/bajgxt/u232.png" alt />
              <div class="text">
                <span>资质不全</span>
                <span>23个</span>
                <span>经营不善</span>
                <span>{{ rightData.materialNum }}个</span>
              </div>
            </div>
            <div class="rightData rightData3">
            <div class="rightData rightData3" @click="shoeDialog('ym')">
              <img src="../../../public/img/bajgxt/u233.png" alt />
              <div class="text">
                <span>没开展业务</span>
                <span>12个</span>
                <span>有名无实</span>
                <span>{{ rightData.ymwsNum }}个</span>
              </div>
            </div>
            <div class="rightData rightData4">
            <div class="rightData rightData4" @click="shoeDialog('jg')">
              <img src="../../../public/img/bajgxt/111.png" alt />
              <div class="text">
                <span>被公安查处</span>
                <span>6个</span>
                <span>监管处罚</span>
                <span>{{ rightData.punishNum }}个</span>
              </div>
            </div>
            <!-- <div class="card-list">
@@ -332,11 +396,272 @@
        </div>
      </div>
    </div>

    <!-- 弹框表格 -->
    <el-dialog
      class="dialog"
      :title="gridData.title"
      v-loading="dialogloading"
      element-loading-text="数据加载中"
      :visible.sync="dialogTableVisible"
    >
      <el-table :data="gridData.data">
        <template v-if="gridData.type === 'zg'">
          <el-table-column :key="gridData.type" type="index"> </el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="realName"
            label="保安姓名"
            :show-overflow-tooltip="true"
            width="100"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="deptName"
            label="保安公司"
            :show-overflow-tooltip="true"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="sex"
            label="性别"
            :formatter="sexFormatter"
            :show-overflow-tooltip="true"
            width="100"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="cardid"
            label="身份证号"
            :show-overflow-tooltip="true"
            width="180"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="age"
            label="年龄"
            :show-overflow-tooltip="true"
            width="100"
          ></el-table-column>
          <!-- <el-table-column
          prop="birthday"
          label="出生日期"
          :show-overflow-tooltip="true"
        ></el-table-column> -->
          <el-table-column
            :key="gridData.type"
            prop="securitynumber"
            label="保安员证编号"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="phone"
            label="联系方式"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="examinationType"
            label="审查状态"
            :formatter="examinationFormatter"
            :show-overflow-tooltip="true"
            width="100"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="examinationMx"
            label="审查明细"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
        </template>
        <template v-if="gridData.type === 'wg'">
          <el-table-column :key="gridData.type" type="index"> </el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="enterpriseName"
            label="公司名称"
            :show-overflow-tooltip="true"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="znum"
            label="保安员数量"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="cznum"
            label="持证保安"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="czl"
            label="持证率"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="sbnum"
            label="缴纳社保人数"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="sbl"
            label="缴纳社保比例"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
        </template>
        <template v-if="gridData.type === 'jy'">
          <el-table-column :key="gridData.type" type="index"> </el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="enterpriseName"
            label="公司名称"
            :show-overflow-tooltip="true"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="znum"
            label="保安员数量"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="cznum"
            label="持证保安"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="painum"
            label="派遣人数"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="fwnum"
            label="服务对象数量"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="pql"
            label="派遣率"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="pjpqrs"
            label="平均派遣人数"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
        </template>
        <template v-if="gridData.type === 'ym'">
          <el-table-column :key="gridData.type" type="index"> </el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="enterpriseName"
            label="公司名称"
            :show-overflow-tooltip="true"
            width="450"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="znum"
            label="保安员数量"
            :show-overflow-tooltip="true"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="cznum"
            label="持证保安"
            :show-overflow-tooltip="true"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="painum"
            label="派遣人数"
            :show-overflow-tooltip="true"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="fwnum"
            label="服务对象数量"
            :show-overflow-tooltip="true"
          ></el-table-column
          >gridData
        </template>
        <template v-if="gridData.type === 'jg'">
          <el-table-column :key="gridData.type" type="index"> </el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="enterpriseName"
            label="公司名称"
            :show-overflow-tooltip="true"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="punishtype"
            label="处罚类别"
            :formatter="punishType"
            :show-overflow-tooltip="true"
            width="150"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="punishreason"
            label="处罚原因"
            :show-overflow-tooltip="true"
            width="200"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="penalty"
            label="处罚单位"
            :show-overflow-tooltip="true"
            width="200"
          ></el-table-column>
          <el-table-column
            :key="gridData.type"
            prop="punishtime"
            label="处罚时间"
            :show-overflow-tooltip="true"
            width="100"
          ></el-table-column>
        </template>
      </el-table>
      <el-pagination
        @current-change="changePage"
        @size-change="changePage"
        :current-page.sync="gridData.current"
        :page-size="10"
        layout="total, prev, pager, next, jumper"
        :total="gridData.total"
      >
      </el-pagination>
    </el-dialog>
  </div>
</template>

<script>
import './echarts-auto-tooltip'
import "./echarts-auto-tooltip";
// import "ol/ol.css";
import * as echarts from "echarts";
import optionJs from "./indexEchart";
@@ -366,11 +691,22 @@
  selectExtype,
  seCountUg,
  seCountI,
  selectExtypeUser,
  qualificationPages,
  selectCf,
  selectCl,
  selectYs,
  selectJy,
  selectWg,
  punishList,
  lazyTrees,
} from "../../api/index/index";

import car from "@/assets/img/car.png";
import peo from "@/assets/img/people.png";
import gun from "@/assets/img/gun.png";

import website from "@/config/website";

export default {
  data() {
@@ -389,8 +725,10 @@
      rightData: {
        poorPerformance: 0,
        qualification: 0,
        socialSecurity: 0,
        noholder: 0,
        materialNum: 0,
        punishNum: 0,
        wgNum: 0,
        ymwsNum: 0,
      },
      carNum: 0,
      peoNum: 0,
@@ -415,8 +753,32 @@
        px: 0,
        fw: 0,
        wz: 0,
        kqy:0
        kqy: 0,
        nan: 0,
        nv: 0,
      },
      left2EchartType: 0,
      poorPerformanceType: 3,
      dialogTableVisible: false,
      gridData: {
        data: [],
        total: 0,
        current: 1,
        type: "zg",
        title: "资格异常人员清单",
      },
      dialogTable: {
        wgTable: [],
        jyTable: [],
        ymTable: [],
      },
      props: {
        children: "children",
        label: "title",
        value: "id",
      },
      node1: {}, //选中的记录
      node2: {},
    };
  },
  computed: {
@@ -428,17 +790,55 @@
    },
  },
  methods: {
    startMove() {
      // eslint-disable-next-line
      let timer = setTimeout(() => {
        if (this.number === 2) {
          this.number = 0;
        } else {
          this.number += 1;
        }
        this.startMove();
      }, 2000); // 滚动不需要停顿则将2000改成动画持续时间
    //点击节点
    handleNodeClick1(data) {
      this.node1 = data;
      this.value1 = data.id;
      this.$refs.treeForm1.blur();
      this.right1loading = true;
      this.getPoorPerformance(3);
    },
    //点击节点
    handleNodeClick2(data) {
      this.node2 = data;
      this.value2 = data.id;
      this.$refs.treeForm2.blur();
      this.peoWarning();
    },
    sexFormatter(row, column) {
      if (row.sex === 1) {
        return "男";
      } else if (row.sex === 2) {
        return "女";
      }
    },
    examinationFormatter(row) {
      if (row.examinationType === "1") {
        return "异常";
      } else if (row.examinationType === "0") {
        return "正常";
      }
    },
    punishType(row) {
      if (row.punishtype === "0") {
        return "警告";
      } else if (row.punishtype === "1") {
        return "罚款";
      } else if (row.punishtype === "2") {
        return "没收违法所得";
      } else if (row.punishtype === "3") {
        return "没收非法财物";
      } else if (row.punishtype === "4") {
        return "责令停止施工";
      } else if (row.punishtype === "5") {
        return "责令停止使用";
      } else if (row.punishtype === "6") {
        return "责令停止违法行为";
      } else if (row.punishtype === "7") {
        return "责令停业";
      }
    },

    // 左侧表的接口返回数据
    initEchart() {
      securityTotal().then((res) => {
@@ -497,6 +897,7 @@
    },

    getHolderNum(type) {
      this.left2EchartType = type;
      this.left2loading = true;
      if (this.echarts.left2Echart) {
        this.echarts.left2Echart.clear();
@@ -523,6 +924,8 @@
            this.echarts.left2Echart.setOption(
              optionJs.left3Data(res.data.data, true)
            );
            this.leftData.nan = res.data.data[0].mnum;
            this.leftData.nv = res.data.data[0].gnum;
          }
          this.left2loading = false;
        });
@@ -533,7 +936,11 @@
        this.echarts.mapEchart = echarts.init(document.getElementById("map"));
      }
      this.echarts.mapEchart.setOption(optionJs.middleData(data, type));
      echartAutoTools.loopShowTooltip(this.echarts.mapEchart, optionJs.middleData(data, type), {loopSeries: true});
      echartAutoTools.loopShowTooltip(
        this.echarts.mapEchart,
        optionJs.middleData(data, type),
        { loopSeries: true }
      );
    },
    setMapData(type) {
      this.middleloading = true;
@@ -586,47 +993,6 @@
          this.textArr.push(obj);
        });
      }
      // let curLayer = null;
      // let imgUrl = null;
      // this.carVectorLayer.getSource().clear();
      // this.peoVectorLayer.getSource().clear();
      // this.gunVectorLayer.getSource().clear();
      // if (type === 2) {
      //   curLayer = this.carVectorLayer;
      //   imgUrl = car;
      // } else if (type === 1) {
      //   curLayer = this.peoVectorLayer;
      //   imgUrl = peo;
      // } else if (type === 3) {
      //   curLayer = this.gunVectorLayer;
      //   imgUrl = gun;
      // }
      // let features = [];
      // let style = new Style({
      //   image: new Icon({
      //     src: imgUrl,
      //     opacity: 1,
      //     scale: 0.5,
      //   }),
      // });
      // this.mapData[type]["geoData"].forEach((item) => {
      //   let carFeature = new Feature({
      //     geometry: new Point(item),
      //   });
      //   carFeature.setStyle(style);
      //   features.push(carFeature);
      // });
      // curLayer.getSource().addFeatures(features);
      // if (this.mapData[type]["geoData"].length > 1) {
      //   let extent = curLayer.getSource().getExtent();
      //   this.map.getView().fit(extent, this.map.getSize());
      //   this.$nextTick(() => {
      //     this.$refs.indexTable.doLayout();
      //   });
      // } else {
      //   this.map.getView().setCenter(this.mapData[type]["geoData"][0]);
      //   this.map.getView().setZoom(11);
      // }
    },
    // 获取表格及地图上的数据
    getTableData(type) {
@@ -729,38 +1095,198 @@
    },
    // 获取辖区列表
    getOfficeData() {
      lazyTreeJu().then((res) => {
      lazyTrees().then((res) => {
        if (res.data.code === 200) {
          this.options1 = res.data.data;
          this.options2 = res.data.data;
          this.value1 = this.options1[0].value || "";
          this.value2 = this.options2[0].value || "";
          this.node1 = this.options1[0];
          this.node2 = this.options1[0];
          // 获取完辖区列表之后再获取具体数据
          this.getNoholderNum();
          this.getNoSocialSecurity();
          this.getQualification();
          this.getPoorPerformance();
          this.peoWarning();
          // this.getQualification();
          this.getPoorPerformance(3);
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    // 未持证
    getNoholderNum() {
      noholderNum({ jurisdiction: this.value2 }).then((res) => {
    // 资格审查异常名单
    shoeDialog(type) {
      this.gridData.title = "";
      this.gridData.type = type;
      this.gridData.current = 1;
      this.gridData.total = 0;
      this.dialogTableVisible = true;
      if (type === "zg") {
        this.gridData.title = "资格异常人员清单";
        this.getQualificationPages(1);
      } else if (type === "wg") {
        this.gridData.title = "违规经营公司清单";
        this.getWgTable();
      } else if (type === "jy") {
        this.gridData.title = "经营不善公司清单";
        this.getJyTable();
      } else if (type === "ym") {
        this.gridData.title = "有名无实公司清单";
        this.getYmTable();
      } else if (type === "jg") {
        this.gridData.title = "受监管处罚公司清单";
        this.getPunishList(1);
      }
    },
    getWgTable() {
      this.dialogTable.wgTable.forEach((item) => {
        let czl = 0;
        if (Number(item.cznum) !== 0 && Number(item.znum) !== 0) {
          czl =
            ((Number(item.cznum) / Number(item.znum)) * 100).toFixed(4) + "%";
        }
        item["czl"] = czl;
        let sbl = 0;
        if (Number(item.sbnum) !== 0 && Number(item.znum) !== 0) {
          czl =
            ((Number(item.sbnum) / Number(item.znum)) * 100).toFixed(4) + "%";
        }
        item["sbl"] = sbl;
      });
      this.gridData.data = this.dialogTable.wgTable.slice(0, 10);
      this.gridData.total = this.dialogTable.wgTable.length;
    },
    getJyTable() {
      this.dialogTable.jyTable.forEach((item) => {
        let pql = 0;
        if (Number(item.painum) !== 0 && Number(item.znum) !== 0) {
          pql =
            ((Number(item.painum) / Number(item.znum)) * 100).toFixed(4) + "%";
        }
        item["pql"] = pql;
        let pjpqrs = 0;
        if (Number(item.painum) !== 0 && Number(item.fwnum) !== 0) {
          pjpqrs =
            ((Number(item.painum) / Number(item.fwnum)) * 100).toFixed(4) + "%";
        }
        item["pjpqrs"] = pjpqrs;
      });
      this.gridData.data = this.dialogTable.jyTable.slice(0, 10);
      this.gridData.total = this.dialogTable.jyTable.length;
    },
    getYmTable() {
      this.gridData.data = this.dialogTable.ymTable.slice(0, 10);
      this.gridData.total = this.dialogTable.ymTable.length;
    },
    getPunishList(page) {
      this.gridData.current = page;
      this.dialogloading = true;
      this.gridData.data = [];
      let params = {
        current: this.gridData.current,
        size: 10,
        jurisdiction: this.value2,
      };
      punishList(params).then((res) => {
        if (res.data.code === 200) {
          this.rightData.noholder = res.data.data[0].Count;
          this.gridData.data = res.data.data.records;
          this.gridData.total = res.data.data.total;
        }
        this.dialogloading = false;
      });
    },
    changePage(page) {
      if (this.gridData.type === "zg") {
        this.getQualificationPages(page);
      } else if (this.gridData.type === "wg") {
        this.gridData.data = this.dialogTable.wgTable.slice(
          10 * (page - 1),
          10 * page
        );
      } else if (this.gridData.type === "jy") {
        this.gridData.data = this.dialogTable.jyTable.slice(
          10 * (page - 1),
          10 * page
        );
      } else if (this.gridData.type === "ym") {
        this.gridData.data = this.dialogTable.jyTable.slice(
          10 * (page - 1),
          10 * page
        );
      } else if (this.gridData.type === "jg") {
        this.getPunishList(page);
      }
    },
    getQualificationPages(page) {
      this.gridData.current = page;
      this.dialogloading = true;
      this.gridData.data = [];
      let params = {
        current: this.gridData.current,
        size: 10,
        examinationType: 1,
        jurisdiction: this.value1,
      };
      qualificationPages(params).then((res) => {
        if (res.data.code === 200) {
          this.gridData.data = res.data.data.records;
          this.gridData.total = res.data.data.total;
        }
        this.dialogloading = false;
      });
    },
    // 公司受处罚数量
    getPunishNum() {
      // selectCf({ jurisdiction: this.value2 }).then(res => {
      //   if (res.data.code === 200) {
      //     this.rightData.punishNum = res.data.data.count;
      //   } else {
      //     this.$message.error(res.msg);
      //   }
      //   this.right2loading = false;
      // });
      let params = {
        current: this.gridData.current,
        size: 10,
        jurisdiction: this.value2,
      };
      punishList(params).then((res) => {
        if (res.data.code === 200) {
          this.gridData.data = res.data.data.records;
          this.gridData.total = res.data.data.total;
          this.rightData.punishNum = res.data.data.total;
        }
        this.dialogloading = false;
      });
    },
    // 经营不善
    getMaterial() {
      selectJy({ jurisdiction: this.value2 }).then((res) => {
        if (res.data.code === 200) {
          this.rightData.materialNum = res.data.data.count;
          this.dialogTable.jyTable = res.data.data.List;
        } else {
          this.$message.error(res.msg);
        }
        this.right2loading = false;
      });
    },
    // 未缴纳社保
    getNoSocialSecurity() {
      noSocialSecurity({ jurisdiction: this.value2 }).then((res) => {
    // 有名无实
    getselectYs() {
      selectYs({ jurisdiction: this.value2 }).then((res) => {
        if (res.data.code === 200) {
          this.rightData.socialSecurity = res.data.data[0].Count;
          this.rightData.ymwsNum = res.data.data.count;
          this.dialogTable.ymTable = res.data.data.List;
        } else {
          this.$message.error(res.msg);
        }
        this.right2loading = false;
      });
    },
    // 违规经营
    getselectWg() {
      selectWg({ jurisdiction: this.value2 }).then((res) => {
        if (res.data.code === 200) {
          this.rightData.wgNum = res.data.data.count;
          this.dialogTable.wgTable = res.data.data.list;
        } else {
          this.$message.error(res.msg);
        }
@@ -768,61 +1294,82 @@
      });
    },
    // 现实表现差
    // getPoorPerformance() {
    //   selectBx({ jurisdiction: this.value1 }).then((res) => {
    //     if (res.data.code === 200) {
    //       this.rightData.poorPerformance = res.data.data[0].count;
    //     } else {
    //       this.$message.error(res.msg);
    //     }
    //     this.right1loading = false;
    //   });
    // },
    // 资格审查异常
    getQualification() {
      selectExtype({ jurisdiction: this.value1 }).then((res) => {
    getPoorPerformance(type) {
      this.right1loading = true;
      this.poorPerformanceType = type;
      this.rightData.poorPerformance = 0;
      this.rightData.qualification = 0;

      // if (type === 1) {
      //   this.rightData.poorPerformance = 2;
      //   this.rightData.qualification = 3;
      //   this.right1loading = false;
      // } else if (type === 2) {
      //   this.rightData.poorPerformance = 11;
      //   this.rightData.qualification = 14;
      //   this.right1loading = false;
      // } else if (type === 3) {
      // this.rightData.poorPerformance = 32;
      // this.rightData.qualification = 45;
      selectBx({
        jurisdiction: this.value1,
        type: this.poorPerformanceType,
      }).then((res) => {
        if (res.data.code === 200) {
          this.rightData.qualification = res.data.data[0].count;
          this.rightData.poorPerformance = res.data.data[0].count;
        } else {
          this.$message.error(res.msg);
        }
        this.right1loading = false;
      });
      selectExtype({
        jurisdiction: this.value1,
        type: this.poorPerformanceType,
      }).then((res) => {
        if (res.data.code === 200) {
          this.rightData.qualification = res.data.data[0].count;
        } else {
          this.$message.error(res.msg);
        }
      });
      // selectExtypeUser().then(res => {
      //   if (res.status === 200) {
      //     this.rightData.qualification = res.data;
      //   } else {
      //     this.$message.error(res.msg);
      //   }
      // });
      // }
      // this.right1loading = false;
    },
    peoWarning() {
      this.rightData.materialNum = 0;
      this.rightData.punishNum = 0;
      this.rightData.wgNum = 0;
      this.rightData.ymwsNum = 0;
      this.right2loading = true;
      this.getNoholderNum();
      this.getNoSocialSecurity();
      this.getPunishNum();
      this.getMaterial();
      this.getselectWg();
      this.getselectYs();
    },

    companyWarning() {
      this.right1loading = true;
      this.getPoorPerformance();
      this.getQualification();
      this.getPoorPerformance(3);
      // this.getQualification();
    },

    goSystemHome() {
      // this.$router.push({ path: "/register/index" });
      this.$router.push({ path: "/securityGuardManagement/register" });
    },
    getPoorPerformance(type) {
      if (type === 0) {
        this.rightData.poorPerformance = 2;
        this.rightData.qualification = 3;
      } else if (type === 1) {
        this.rightData.poorPerformance = 11;
        this.rightData.qualification = 14;
      } else if (type === 2) {
        this.rightData.poorPerformance = 32;
        this.rightData.qualification = 45;
      }
      // this.$router.push({ path: "/securityGuardManagement/register" });
      this.$router.push({ path: website.fistPage.value });
    },
  },
  mounted() {
    this.startMove();
    this.initEchart();
    this.getHolderNum(0);
    this.getPoorPerformance(0);
    // this.getPoorPerformance(3);
    // this.getTableData("car");
    // this.initMap();
    this.getTableData(0);
@@ -845,4 +1392,7 @@
/deep/ .el-loading-mask {
  background-color: transparent !important;
}
/deep/ .el-table .cell {
  text-align: center;
}
</style>

 src/views/home/indexEchart.js

@@ -1,5 +1,5 @@
import * as echarts from "echarts";
import nc from '../../../public/nc.json';
import nc from "../../../public/nc.json";
function left1Data(allData) {
  let nameArr = [];
  let data1 = [];
@@ -10,12 +10,18 @@
  // let legend = ["自招保安单位", "保安培训公司", "保安服务公司", "武装守押公司"];
  allData.forEach(item => {
    nameArr.push(item.name);
    data1.push(item.server.confess);
    data2.push(item.server.staff);
    data3.push(item.server.security);
    data4.push(item.server.armed);
    data5.push(item.server.region);
    data1.push(item.server.confess || 0);
    data2.push(item.server.staff || 0);
    data3.push(item.server.security || 0);
    data4.push(item.server.armed || 0);
    data5.push(item.server.region || 0);
  });
  nameArr.reverse();
  data1.reverse();
  data2.reverse();
  data3.reverse();
  data4.reverse();
  data5.reverse();
  let option = {
    tooltip: {
      trigger: "axis",
@@ -28,13 +34,13 @@
      // borderColor: "gray", //设置边框颜色
      textStyle: {
        color: "#fff" //设置文字颜色
      },
      }
    },
    color: [
      '#2ec7c9',
      '#b6a2de',
      '#5ab1ef',
      '#ffb980',
      "#2ec7c9",
      "#b6a2de",
      "#5ab1ef",
      "#ffb980",

      // "#fac858",
      // "#73c0de",
@@ -43,10 +49,10 @@
      "#9a60b4",
      "#3fb1e3",
      "#6be6c1",
      '#626c91',
      '#a0a7e6',
      '#c4ebad',
      '#96dee8'
      "#626c91",
      "#a0a7e6",
      "#c4ebad",
      "#96dee8"
    ],
    // legend: {
    //   data: ["自招保安单位", "保安培训公司", "保安服务公司", "武装守押公司"],
@@ -60,9 +66,9 @@
    //   // }
    // },
    grid: {
      top: '5%',
      top: "5%",
      left: "5%",
      right: "8%",
      right: "10%",
      bottom: "5%",
      containLabel: true
    },
@@ -90,7 +96,7 @@
        name: "自招保安单位",
        type: "bar",
        stack: "total",
        barWidth: 20,
        barWidth: 17,
        emphasis: {
          focus: "series"
        },
@@ -106,7 +112,7 @@
        data: data2
      },
      {
        name: "保安服务公司",
        name: "本市保安公司",
        type: "bar",
        stack: "total",
        emphasis: {
@@ -124,7 +130,7 @@
        data: data4
      },
      {
        name: "跨区域保安公司",
        name: "分公司",
        type: "bar",
        stack: "total",
        emphasis: {
@@ -157,7 +163,7 @@
      // borderColor: "gray", //设置边框颜色
      textStyle: {
        color: "#fff" //设置文字颜色
      },
      }
    },
    color: [
      "#3fb1e3",
@@ -168,27 +174,36 @@
      "#9a60b4",
      "#3fb1e3",
      "#6be6c1",
      '#626c91',
      '#a0a7e6',
      '#c4ebad',
      '#96dee8'
      "#626c91",
      "#a0a7e6",
      "#c4ebad",
      "#96dee8"
    ],
    legend: {
      data: ["持证人数", "未持证人数"],
      bottom: "1%",
      left: "13%",
      itemWidth: 20,
      textStyle: {
        color: "#fff"
      }
    },
    grid: {
      top: '5%',
      top: "10%",
      left: "5%",
      right: "6%",
      bottom: "15%",
      bottom: "4%",
      containLabel: true
    },
    xAxis: {
      type: "category",
      axisLabel: {
        color: "#fff",
        rotate: 40
      },
      data: nameArr
    },
    yAxis: {
      type: "value",
      axisLabel: {
        color: "#fff"
@@ -200,13 +215,6 @@
      splitLine: {
        show: false
      }
    },
    yAxis: {
      type: "category",
      axisLabel: {
        color: "#fff"
      },
      data: nameArr
    },
    series: [
      {
@@ -236,12 +244,12 @@

function left3Data(allData) {
  let data = [
    { value: allData[0].mnum ? Number(allData[0].mnum) : 0, name: '男' },
    { value: allData[0].gnum ? Number(allData[0].gnum) : 0, name: '女' }
  ]
    { value: allData[0].mnum ? Number(allData[0].mnum) : 0, name: "男" },
    { value: allData[0].gnum ? Number(allData[0].gnum) : 0, name: "女" }
  ];
  let option = {
    tooltip: {
      trigger: 'item',
      trigger: "item",
      formatter: "{a}<br>{b}:{c}({d}%)",
      axisPointer: {
        type: "shadow"
@@ -252,42 +260,42 @@
      // borderColor: "gray", //设置边框颜色
      textStyle: {
        color: "#fff" //设置文字颜色
      },
      }
    },
    color: [
      '#008DEC',
      '#886EFF',
    ],
    legend: {
      right: "8%",
      bottom: "10%",
      itemHeight: 10,
      show: true,
      selectedMode: false,
      textStyle: {
        color: "#fff"
      },
      data: ['男', '女'],
      orient: "vertical"
    color: ["#008DEC", "#886EFF"],
    // legend: {
    //   right: "8%",
    //   bottom: "10%",
    //   itemHeight: 10,
    //   show: true,
    //   selectedMode: false,
    //   textStyle: {
    //     color: "#fff"
    //   },
    //   data: ['男', '女'],
    //   orient: "vertical"
    // },
    grid: {
      top: "10%",
      left: "5%",
      right: "30%",
      bottom: "4%",
      containLabel: true
    },
    series: [
      {
        name: '性别比例',
        type: 'pie',
        center: ['43%', '50%'],
        radius: '70%',
        name: "性别比例",
        type: "pie",
        center: ["33%", "50%"],
        radius: "70%",
        data: data,
        emphasis: {
          itemStyle: {
            shadowBlur: 10,
            shadowOffsetX: 0,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
          }
        },
        label: {
          color: "#fff"
        }
      }
    ]
  };
  return option
  return option;
}

function right1Data(allData) {
@@ -325,10 +333,10 @@
      "#9a60b4",
      "#3fb1e3",
      "#6be6c1",
      '#626c91',
      '#a0a7e6',
      '#c4ebad',
      '#96dee8'
      "#626c91",
      "#a0a7e6",
      "#c4ebad",
      "#96dee8"
    ],

    legend: {
@@ -390,10 +398,10 @@
      "#9a60b4",
      "#3fb1e3",
      "#6be6c1",
      '#626c91',
      '#a0a7e6',
      '#c4ebad',
      '#96dee8'
      "#626c91",
      "#a0a7e6",
      "#c4ebad",
      "#96dee8"
    ],

    legend: {
@@ -446,17 +454,17 @@
  let data = [];
  let legendData = [];
  let datas = allData.sort((a, b) => {
    return b.Count - a.Count
  })
    return b.Count - a.Count;
  });
  datas.forEach(item => {
    let obj = {
      name: item.jurname,
      value: item.Count
    }
    legendData.push(item.jurname)
    };
    legendData.push(item.jurname);
    // sumValue += Number(item.Count)
    data.push(obj)
  })
    data.push(obj);
  });
  // let arrName = getArrayValue(data, "name");
  // let arrValue = getArrayValue(data, "value");
  // let sumValue = 1000;
@@ -624,16 +632,18 @@
      // borderColor: "gray", //设置边框颜色
      textStyle: {
        color: "#fff" //设置文字颜色
      },
      }
    },
    legend: {
      right: "2%",
      top: "10%",
      right: "5%",
      top: "5%",
      itemHeight: 10,
      show: true,
      itemGap: 8,
      selectedMode: false,
      textStyle: {
        color: "#fff"
        color: "#fff",
        fontSize: 9
      },
      data: legendData,
      orient: "vertical"
@@ -647,18 +657,18 @@
      "#9a60b4",
      "#3fb1e3",
      "#6be6c1",
      '#626c91',
      '#a0a7e6',
      '#c4ebad',
      '#96dee8'
      "#626c91",
      "#a0a7e6",
      "#c4ebad",
      "#96dee8"
    ],
    series: [
      {
        name: '分局预警占比',
        type: 'pie',
        radius: '75%',
        center: ['30%', '50%'],
        roseType: 'radius',
        name: "分局预警占比",
        type: "pie",
        radius: "75%",
        center: ["35%", "55%"],
        roseType: "radius",
        itemStyle: {
          borderRadius: 0
        },
@@ -671,7 +681,7 @@
          }
        },
        data: data
      },
      }
      // {
      //     name: '面积模式',
      //     type: 'pie',
@@ -711,15 +721,16 @@
  //   }
  //   return res;
  // };
  let name = '';
  let label = '';
  let symbolUrl = '';
  let geoData = []
  allData['table'].forEach((item, i) => {
  let name = "";
  let label = "";
  let symbolUrl = "";
  let geoData = [];
  allData["table"].forEach((item, i) => {
    let obj = {};
    if (type === 1) {
      name = '保安员名称';
      label = "押运人员：" +
      name = "保安员名称";
      label =
        "押运人员：" +
        item.name +
        "<br />当前位置：" +
        item.location +
@@ -727,13 +738,13 @@
        item.linkman +
        "<br />联系电话：" +
        item.tel;
      symbolUrl = require('@/assets/img/people.png')
      symbolUrl = require("@/assets/img/people.png");
      obj = {
        name: label,
        value: allData['geoData'][i]
      }
        value: allData["geoData"][i]
      };
    } else if (type === 2) {
      name = '押运车辆';
      name = "押运车辆";
      label =
        "押运车辆车牌号：" +
        item.carNum +
@@ -745,14 +756,15 @@
        item.linkman +
        "<br />联系电话：" +
        item.tel;
      symbolUrl = require('@/assets/img/car.png')
      symbolUrl = require("@/assets/img/car.png");
      obj = {
        name: label,
        value: allData['geoData'][i],
      }
        value: allData["geoData"][i]
      };
    } else if (type === 3) {
      name = '枪支';
      label = "枪支编号：" +
      name = "枪支";
      label =
        "枪支编号：" +
        item.number +
        "<br />当前位置：" +
        item.location +
@@ -762,17 +774,16 @@
        item.linkman +
        "<br />联系电话：" +
        item.tel;
      symbolUrl = require('@/assets/img/gun.png')
      symbolUrl = require("@/assets/img/gun.png");
      obj = {
        name: label,
        value: allData['geoData'][i]
      }
        value: allData["geoData"][i]
      };
    }
    geoData.push(obj)
  })
    geoData.push(obj);
  });


  echarts.registerMap('ncMap', ncMap);
  echarts.registerMap("ncMap", ncMap);
  // echarts.registerMap('chinaMapOutline', chinaMapOutline);
  let option = {
    // backgroundColor: '#181F4E',
@@ -780,12 +791,11 @@
    //   trigger: 'item',
    // },
    tooltip: {
      trigger: 'item',
      formatter: function (params) {
        if (typeof (params.value)[1] == "undefined") {
      trigger: "item",
      formatter: function(params) {
        if (typeof params.value[1] == "undefined") {
          return params.name;
        } else {
          debugger
          return params.name;
        }
      },
@@ -793,104 +803,102 @@
      color: "#fff",
      borderWidth: "0", //边框宽度设置1
      borderColor: "gray", //设置边框颜色
      extraCssText: 'box-shadow: 0 0 3px rgba(    211,211,211, 0.5);',
      extraCssText: "box-shadow: 0 0 3px rgba(    211,211,211, 0.5);",
      textStyle: {
        color: "#fff" //设置文字颜色
      },
      }
    },
    geo: {
      // silent: true,
      map: 'ncMap',
      map: "ncMap",
      show: true,
      zoom: 1.04,
      top: '8%',
      top: "8%",
      label: {
        show: false,
        color: '#fff',
        color: "#fff",
        emphasis: {
          textStyle: {
            color: '#fff'
            color: "#fff"
          }
        }
      },

      roam: true,
      itemStyle: {
        areaColor: 'rgba(0,255,255,.02)',
        borderColor: '#00ffff',
        areaColor: "rgba(0,255,255,.02)",
        borderColor: "#00ffff",
        borderWidth: 1.5,
        shadowColor: '#00ffff',
        shadowColor: "#00ffff",
        shadowOffsetX: 0,
        shadowOffsetY: 4,
        shadowBlur: 10,

        shadowBlur: 10
      },
      emphasis: {
        itemStyle: {
          color: 'transparent', //悬浮背景
          color: "transparent", //悬浮背景
          textStyle: {
            color: '#fff'
            color: "#fff"
          }
        }
      }
    },
    series: [
      {
        map: 'ncMap',
        map: "ncMap",
        // silent: true,
        type: 'map',
        type: "map",
        geoIndex: 0,
        // aspectScale: 0.75, //长宽比
        zoom: 1.14,
        label: {
          show: false,
          color: '#fff'
          color: "#fff"
        },
        emphasis: {
          label: {
            color: '#fff'
            color: "#fff"
          }
        },
        top: '10%',
        top: "10%",
        roam: true,
        itemStyle: {
          areaColor: 'rgba(0,255,255,.02)',
          borderColor: '#00ffff',
          areaColor: "rgba(0,255,255,.02)",
          borderColor: "#00ffff",
          borderWidth: 1.5,
          shadowColor: '#00ffff',
          shadowColor: "#00ffff",
          shadowOffsetX: 0,
          shadowOffsetY: 4,
          shadowBlur: 10,

          shadowBlur: 10
        },
        emphasis: {
          itemStyle: {
            areaColor: 'transparent', //悬浮背景
            areaColor: "transparent", //悬浮背景
            textStyle: {
              color: '#fff'
              color: "#fff"
            }
          }
        }
      },
      {
        name: name,
        type: 'scatter',
        coordinateSystem: 'geo',
        type: "scatter",
        coordinateSystem: "geo",
        // roam: false,
        symbol: 'image://' + symbolUrl,
        symbol: "image://" + symbolUrl,
        symbolSize: [30, 30],
        label: {
          show: false,
          color: '#fff',
          fontSize: 9,
          color: "#fff",
          fontSize: 9
        },
        itemStyle: {
          color: '#FF0000', //标志颜色
          color: "#FF0000" //标志颜色
        },
        data: geoData,
        showEffectOn: 'render',
        showEffectOn: "render",
        rippleEffect: {
          brushType: 'stroke'
          brushType: "stroke"
        },
        hoverAnimation: true,
        emphasis: {
@@ -899,8 +907,8 @@
        zlevel: 1
      }
    ]
  }
  return option
  };
  return option;
}
export default {
  left1Data,

 src/views/licenseApproval/branchOffice.vue

New file
@@ -0,0 +1,897 @@
/*
 * @Author: liu
 * @Date: 2021-08-26 17:00:55 
 * @Last Modified by: liu
 * @Last Modified time: 2021-08-28 10:28:39
 */


<template>
  <div>
    <basic-container class="permit">
      <avue-crud
        :option="option"
        :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 slot="menuLeft">
          <el-button
            type="danger"
            size="small"
            icon="el-icon-delete"
            plain
            v-if="permission.permit_delete"
            @click="handleDelete"
            >删 除
          </el-button>
        </template>
        <template slot-scope="{ type, size, row }" slot="menu">
          <el-button
            icon="icon-zhengjian"
            :size="size"
            :type="type"
            class="zhengJian-icon"
            @click.stop="handleCredentials(row)"
            >附件审查</el-button
          >
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            v-if="row.type == '2'"
            @click.stop="rowDel(row)"
            >备案审批
          </el-button>
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            @click.stop="viewLicense(row)"
            v-if="row.type == '0'"
            >打印备案证
          </el-button>
        </template>
        <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>
    </basic-container>

    <div
      v-if="dialogVisible"
      class="dialogVisibles"
      :class="classStyle == 'print' ? 'printstyle' : ''"
    >
      <div
        id="licence_box"
        :class="classStyle == 'print' ? 'printstyle' : ''"
        ref="licence"
      >
        <div class="licence" id="licence" v-if="dialogVisible">
          <div class="licence-head">备案证</div>
          <div class="head-tid">
            洪公保服务
            <span class="fontStyle">{{
              licenceData.row.organizationcode
            }}</span>
            号
          </div>
          <div class="licence-main">
            <div
              class="l-m-once"
              v-for="(item, index, key) in licenceData.chiden"
              :key="key"
            >
              <span class="l-m-o-title"> {{ index }}: </span>
              <span class="l-m-r-once">{{ item }}</span>
            </div>
          </div>
          <div class="licence-bottom">发证机关（南昌市公安局）</div>
          <div class="l-bottom">
            发证日期
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(0, 4)
            }}</span
            >年
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(5, 7)
            }}</span>
            月
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(8, 10)
            }}</span>
            日
          </div>
        </div>
        <span slot="footer" class="dialog-footer no-print PrintBut">
          <el-button type="primary" @click="Print">打 印</el-button>
          <el-button type="primary" @click="closePrint"> 取 消 </el-button>
        </span>
      </div>
    </div>

    <el-dialog
      title=""
      :visible.sync="dialogVisiblecc"
      width="30%"
      :modal-append-to-body="false"
    >
      <div class="flots">
        <span class="f_title">是否通过备案审批？</span>
        <span class="f_body">请输入修改意见：</span>
        <textarea
          name="reworkmes"
          cols="40"
          rows="4"
          style="overflow: hidden"
          v-model="textareaShenpi"
        ></textarea>
        <div class="but">
          <el-button type="danger" @click="subcc">不通过</el-button>
          <el-button type="primary" @click="closecc">通过</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  getList,
  getDetail,
  add,
  update,
  remove,
} from "@/api/licenseApproval/record";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      classStyle: "print", //打印样式

      dialogVisiblecc: false, //许可证审核抽屉
      xukezData: {},

      dialogVisible: false, //许可证抽屉
      licenceData: {
        row: {},
        chiden: {},
      },
      textareaShenpi: "",

      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      selectionList: [],
      option: {
        height: "auto",
        calcHeight: 30,
        excelBtn: true,
        tip: false,
        searchShowBtn: false,
        searchShow: true,
        searchMenuSpan: 8,
        border: true,
        menuWidth: 300,
        labelWidth: 130,
        headerAlign: "center",
        align: "center",
        // border: false,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "企业名称",
            search: true,
            prop: "enterprisename",
            searchLabelWidth: 80,
            searchSpan: 4,
            overHidden: true,
            width: 250,
            rules: [
              {
                required: true,
                message: "请输入企业名称",
                trigger: "blur",
              },
            ],
          },
          {
            label: "社会信用代码",
            prop: "creditcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入统一社会信用代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人",
            prop: "representative",
            searchLabelWidth: 90,
            search: true,
            width: 82,
            rules: [
              {
                required: true,
                message: "请输入法定代表人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人电话",
            width: 106,
            prop: "representativecell",
            rules: [
              {
                required: true,
                message: "请输入法定代表人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人",
            prop: "contacts",
            width: 58,
            rules: [
              {
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人电话",
            width: 96,
            prop: "contactscell",
            rules: [
              {
                required: true,
                message: "请输入联系人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "单位许可证编号",
            prop: "perid",
            // labelWidth: 160,
            // span: 12,
            hide: true,
            rules: [
              {
                required: true,
                message: "单位许可证编号",
                trigger: "blur",
              },
            ],
          },
          {
            label: "许可证发证机关",
            prop: "offices",
            // labelWidth: 160,
            // span: 12,
            hide: true,
            rules: [
              {
                required: true,
                message: "许可证发证机关",
                trigger: "blur",
              },
            ],
          },
          {
            label: "发证时间",
            prop: "officetime",
            // labelWidth: 160,
            // span: 12,
            hide: true,
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
          },
          {
            label: "注册时间",
            hide: true,
            prop: "establishtime",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            rules: [
              {
                required: true,
                message: "请输入注册时间",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册资本",
            prop: "registeredcapital",
            rules: [
              {
                required: true,
                message: "请输入注册资本",
                trigger: "blur",
              },
            ],
          },
          {
            label: "组织机构代码",
            prop: "organizationcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入组织机构代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "工商注册号",
            hide: true,
            prop: "registrationnumber",
            rules: [
              {
                required: true,
                message: "请输入工商注册号",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "纳税人识别号",
          //   prop: "identificationnumber",
          //   hide: true,
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入纳税人识别号",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          // {
          //   label: "企业类型",
          //   hide: true,
          //   prop: "enterprises",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入企业类型",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "注册地址",
            prop: "address",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入注册地址",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属地区",
          //   hide: true,
          //   prop: "region",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入所属地区",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "登记机关",
            prop: "registration",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入登记机关",
                trigger: "blur",
              },
            ],
          },
          {
            label: "所属行业",
            hide: true,
            prop: "industry",
            rules: [
              {
                required: true,
                message: "请输入所属行业",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属机构",
          //   prop: "deptid",
          //   addDisplay: false,
          //   type: "select",
          //   hide: true,
          //   dicUrl: "/api/blade-system/dept/selectIn",
          //   props: {
          //     label: "deptname",
          //     value: "deptid",
          //   },
          // },
          {
            label: "所属辖区",
            prop: "jurisdiction",
            type: "tree",
            dicUrl: "/api/jurisdiction/lazy-trees",
            props: {
              label: "title",
              value: "id",
            },
            // labelWidth: 160,
            // span: 12,
          },
          {
            label: "许可类型",
            // search: true,
            hide: true,
            prop: "ptype",
            type: "select",
            searchSpan: 4,
            dicData: [
              {
                label: "设立分公司备案",
                value: "2",
              },
            ],
          },
          {
            label: "提交时间",
            prop: "permitime",
            overHidden: true,
            addDisplay: false,
            width: 132,
            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",
              },
            ],
          },
          {
            label: "经营范围",
            prop: "business",
            component: "AvueUeditor",
            hide: true,
            minRows: 6,
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入经营范围",
                trigger: "blur",
              },
            ],
          },
        ],
      },
      data: [],
    };
  },
  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.permit_add, false),
        viewBtn: this.vaildData(this.permission.permit_view, true),
        delBtn: this.vaildData(this.permission.permit_delete, false),
        editBtn: this.vaildData(this.permission.permit_edit, false),
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  // mounted() {
  //     console.log(this.userInfo.dept_id);
  // },
  methods: {
    Print() {
      this.$Print(this.$refs.licence);
    },

    handleCredentials(row) {
      // console.log(row, "21354");
      this.$router.push({
        path: "/attachOnce/index",
        // redirect: { name: "foo" },
        // query: { row: row },
        query: { deptid: row.cardid, type: "0" },
        // params: { row: row.identificationnumber },
      });
    },
    rowSave(row, done, loading) {
      row.deptid = this.userInfo.dept_id;
      add(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          loading();
          window.console.log(error);
        }
      );
    },
    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.dialogVisiblecc = true;
      this.xukezData = row;
    },
    closecc() {
      this.xukezData.type = "0";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      console.log(this.xukezData);
      update(this.xukezData);
      this.textareaShenpi = "";
      this.$message({
        type: "success",
        message: "审核通过!",
      });
    },
    subcc() {
      this.xukezData.type = "1";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      update(this.xukezData);
      this.textareaShenpi = "";
      this.$message({
        type: "success",
        message: "审核不通过!",
      });
    },

    viewLicense(row) {
      //查看许可证
      this.licenceData.row = row;
      this.licenceData.chiden = {};
      this.licenceData.chiden["名称"] = row.enterprisename;
      this.licenceData.chiden["住所"] = row.address;
      this.licenceData.chiden["法定代表人"] = row.representative;
      this.licenceData.chiden["服务范围"] = row.industry;
      this.licenceData.chiden["注册资本"] = row.registeredcapital;
      this.licenceData.chiden["批准文号"] = row.registrationnumber;

      console.log(this.licenceData);
      this.dialogVisible = true;
    },
    closePrint() {
      this.dialogVisible = false;
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then((res) => {
          this.form = res.data.data;
        });
      }
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      params["ptype"] = 2;
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },
    rowStyle({ row }) {
      if (row.dtype != null && row.dtype != "") {
        if (row.dtype == "2") {
          return {
            color: "#F34A4A",
          };
        }
        if (row.dtype == "1") {
          return {
            color: "#F48F57",
          };
        }
      }
    },
  },
};
</script>

<style scoped lang="scss">
.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;*/
}
#licence_box {
  position: relative;
  top: 15px;
  width: 1080px;
  height: 780px;
  background-color: #004ca7;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.licence {
  width: 960px;
  height: 648px;
  background-color: #fff !important;
  background-image: url("/img/permit/服务许可背景图.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-sizing: border-box;
  padding: 10%;
  color: #000;
}
.licence-head {
  width: 100%;
  height: 1.8rem;
  font-size: 1.8rem;
  text-align: center;
}
.head-tid {
  position: relative;
  left: 70%;
}
.head-tid span {
  margin: 0 1rem;
}
.licence-main {
  width: 80%;
}
.l-m-once {
  width: 100%;
  height: 2rem;
  margin-top: 1rem;
}
.l-m-o-title {
  font-size: 1.3rem;
  width: 22%;
  text-align: justify;
  display: inline-block;
}
.l-m-r-once {
  font-size: 1.1rem;
  /* border: 1px solid #000; */
  display: inline-block;
  width: 77%;
}
.licence-bottom,
.l-bottom {
  position: relative;
  left: 60%;
  font-size: 1.5rem;
  margin-top: 0.5rem;
}
.dialogVisibles {
  position: fixed;
  top: 0;
  left: -10%;
  height: 0;
  width: 120%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.printstyle {
  background-color: #fff !important;
}
.PrintBut {
  margin-top: 15px;
}

.flots {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  span {
    display: inline-block;
  }
  .f_title {
    position: absolute;
    top: 15px;
    font-size: 18px;
  }
}
.but {
  margin-top: 20px;
  width: 100%;
  display: flex;
  align-content: center;
  justify-content: center;
}
</style>

 src/views/licenseApproval/cancellationOfFiling.vue

New file
@@ -0,0 +1,801 @@
/*
 * @Author: liu
 * @Date: 2021-08-26 17:00:04 
 * @Last Modified by: liu
 * @Last Modified time: 2021-08-28 10:28:44
 */


<template>
  <div>
    <basic-container class="permit">
      <avue-crud
        :option="option"
        :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 slot="menuLeft">
          <el-button
            type="danger"
            size="small"
            icon="el-icon-delete"
            plain
            v-if="permission.permit_delete"
            @click="handleDelete"
            >删 除
          </el-button>
        </template>
        <template slot-scope="{ type, size, row }" slot="menu">
          <el-button
            icon="icon-zhengjian"
            :size="size"
            :type="type"
            class="zhengJian-icon"
            @click.stop="handleCredentials(row)"
            >附件查阅
          </el-button>
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            @click.stop="rowDel(row)"
            v-if="row.type == '2'"
            >撤销备案审批
          </el-button>
        </template>
        <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>
    </basic-container>

    <el-dialog
      title=""
      :visible.sync="dialogVisiblecc"
      width="30%"
      :modal-append-to-body="false"
    >
      <div class="flots">
        <span class="f_title">是否通过撤销备案审批？</span>
        <span class="f_body">请输入修改意见：</span>
        <textarea
          name="reworkmes"
          cols="40"
          rows="4"
          style="overflow: hidden"
          v-model="textareaShenpi"
        ></textarea>
        <div class="but">
          <el-button type="danger" @click="subcc">不通过</el-button>
          <el-button type="primary" @click="closecc">通过</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  getList,
  getDetail,
  add,
  update,
  remove,
} from "@/api/licenseApproval/revoke";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      classStyle: "print", //打印样式

      dialogVisiblecc: false, //许可证审核抽屉
      xukezData: {},

      dialogVisible: false, //许可证抽屉
      licenceData: {
        row: {},
        chiden: {},
      },
      textareaShenpi: "",

      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      selectionList: [],
      option: {
        height: "auto",
        calcHeight: 30,
        excelBtn: true,
        tip: false,
        searchShowBtn: false,
        searchShow: true,
        searchMenuSpan: 8,
        border: true,
        menuWidth: 300,
        labelWidth: 130,
        headerAlign: "center",
        align: "center",
        // border: false,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "企业名称",
            search: true,
            prop: "enterprisename",
            searchLabelWidth: 80,
            searchSpan: 4,
            overHidden: true,
            width: 250,
            rules: [
              {
                required: true,
                message: "请输入企业名称",
                trigger: "blur",
              },
            ],
          },
          {
            label: "社会信用代码",
            prop: "creditcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入统一社会信用代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人",
            prop: "representative",
            searchLabelWidth: 90,
            search: true,
            width: 82,
            rules: [
              {
                required: true,
                message: "请输入法定代表人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人电话",
            width: 106,
            prop: "representativecell",
            rules: [
              {
                required: true,
                message: "请输入法定代表人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人",
            prop: "contacts",
            width: 58,
            rules: [
              {
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人电话",
            width: 96,
            prop: "contactscell",
            rules: [
              {
                required: true,
                message: "请输入联系人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册时间",
            hide: true,
            prop: "establishtime",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            rules: [
              {
                required: true,
                message: "请输入注册时间",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册资本",
            prop: "registeredcapital",
            rules: [
              {
                required: true,
                message: "请输入注册资本",
                trigger: "blur",
              },
            ],
          },
          {
            label: "组织机构代码",
            prop: "organizationcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入组织机构代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "工商注册号",
            hide: true,
            prop: "registrationnumber",
            rules: [
              {
                required: true,
                message: "请输入工商注册号",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "纳税人识别号",
          //   prop: "identificationnumber",
          //   hide: true,
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入纳税人识别号",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          // {
          //   label: "企业类型",
          //   hide: true,
          //   prop: "enterprises",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入企业类型",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "注册地址",
            prop: "address",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入注册地址",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属地区",
          //   hide: true,
          //   prop: "region",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入所属地区",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "登记机关",
            prop: "registration",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入登记机关",
                trigger: "blur",
              },
            ],
          },
          {
            label: "所属行业",
            hide: true,
            prop: "industry",
            rules: [
              {
                required: true,
                message: "请输入所属行业",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属机构",
          //   prop: "deptid",
          //   addDisplay: false,
          //   type: "select",
          //   hide: true,
          //   dicUrl: "/api/blade-system/dept/selectIn",
          //   props: {
          //     label: "deptname",
          //     value: "deptid",
          //   },
          // },
          {
            label: "所属辖区",
            prop: "jurisdiction",
            type: "tree",
            dicUrl: "/api/jurisdiction/lazy-trees",
            props: {
              label: "title",
              value: "id",
            },
            // labelWidth: 160,
            // span: 12,
          },
          {
            label: "许可类型",
            // search: true,
            hide: true,
            prop: "ptype",
            type: "select",
            searchSpan: 4,
            dicData: [
              {
                label: "保安服务许可",
                value: "0",
              },
            ],
          },
          {
            label: "提交时间",
            prop: "permitime",
            overHidden: true,
            addDisplay: false,
            width: 132,
            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",
              },
            ],
          },
          {
            label: "经营范围",
            prop: "business",
            component: "AvueUeditor",
            hide: true,
            minRows: 6,
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入经营范围",
                trigger: "blur",
              },
            ],
          },
          {
            label: "撤销原因",
            prop: "reason",
            // labelWidth: 160,
            // span: 24,
            hide: true,
            type: "textarea",
            rules: [
              {
                required: true,
                message: "请输入撤销原因",
                trigger: "blur",
              },
            ],
          },
        ],
      },
      data: [],
    };
  },
  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.permit_add, false),
        viewBtn: this.vaildData(this.permission.permit_view, true),
        delBtn: this.vaildData(this.permission.permit_delete, false),
        editBtn: this.vaildData(this.permission.permit_edit, false),
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  // mounted() {
  //     console.log(this.userInfo.dept_id);
  // },
  methods: {
    Print() {
      this.$Print(this.$refs.licence);
    },

    handleCredentials(row) {
      this.$router.push({
        path: "/attachOnce/index",
        // redirect: { name: "foo" },
        // query: { row: row },
        query: { deptid: row.cardid, type: "0" },
        // params: { row: row.identificationnumber },
      });
    },
    rowSave(row, done, loading) {
      row.deptid = this.userInfo.dept_id;
      add(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          loading();
          window.console.log(error);
        }
      );
    },
    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.dialogVisiblecc = true;
      this.xukezData = row;
    },
    closecc() {
      this.xukezData.type = "0";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      console.log(this.xukezData);
      update(this.xukezData);
      this.textareaShenpi = "";
    },
    subcc() {
      this.xukezData.type = "1";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      update(this.xukezData);
      this.textareaShenpi = "";
    },

    viewLicense(row) {
      //查看许可证
      this.licenceData.row = row;
      this.licenceData.chiden = {};
      this.licenceData.chiden["名称"] = row.enterprisename;
      this.licenceData.chiden["住所"] = row.address;
      this.licenceData.chiden["法定代表人"] = row.representative;
      this.licenceData.chiden["服务范围"] = row.industry;
      this.licenceData.chiden["注册资本"] = row.registeredcapital;
      this.licenceData.chiden["批准文号"] = row.registrationnumber;

      console.log(this.licenceData);
      this.dialogVisible = true;
    },
    closePrint() {
      this.dialogVisible = false;
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then((res) => {
          this.form = res.data.data;
        });
      }
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      params["ptype"] = 4;
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },
    rowStyle({ row }) {
      if (row.dtype != null && row.dtype != "") {
        if (row.dtype == "2") {
          return {
            color: "#F34A4A",
          };
        }
        if (row.dtype == "1") {
          return {
            color: "#F48F57",
          };
        }
      }
    },
  },
};
</script>

<style scoped lang="scss">
.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;*/
}
#licence_box {
  position: relative;
  top: 15px;
  width: 1080px;
  height: 780px;
  background-color: #004ca7;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.licence {
  width: 960px;
  height: 648px;
  background-color: #fff !important;
  background-image: url("/img/permit/服务许可背景图.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-sizing: border-box;
  padding: 10%;
  color: #000;
}
.licence-head {
  width: 100%;
  height: 1.8rem;
  font-size: 1.8rem;
  text-align: center;
}
.head-tid {
  position: relative;
  left: 70%;
}
.head-tid span {
  margin: 0 1rem;
}
.licence-main {
  width: 80%;
}
.l-m-once {
  width: 100%;
  height: 2rem;
  margin-top: 1rem;
}
.l-m-o-title {
  font-size: 1.3rem;
  width: 22%;
  text-align: justify;
  display: inline-block;
}
.l-m-r-once {
  font-size: 1.1rem;
  /* border: 1px solid #000; */
  display: inline-block;
  width: 77%;
}
.licence-bottom,
.l-bottom {
  position: relative;
  left: 60%;
  font-size: 1.5rem;
  margin-top: 0.5rem;
}
.dialogVisibles {
  position: fixed;
  top: 0;
  left: -10%;
  height: 0;
  width: 120%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.printstyle {
  background-color: #fff !important;
}
.PrintBut {
  margin-top: 15px;
}

.flots {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  .f_title {
    position: absolute;
    top: 15px;
    font-size: 18px;
  }
}
.but {
  margin-top: 20px;
  width: 100%;
  display: flex;
  align-content: center;
  justify-content: center;
}
</style>

 src/views/licenseApproval/crossRegion.vue

New file
@@ -0,0 +1,883 @@
/*
 * @Author:liu
 * @Date: 2021-08-26 16:59:35 
 * @Last Modified by: liu
 * @Last Modified time: 2021-08-28 10:28:50
 */


<template>
  <div>
    <basic-container class="permit">
      <avue-crud
        :option="option"
        :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 slot="menuLeft">
          <el-button
            type="danger"
            size="small"
            icon="el-icon-delete"
            plain
            v-if="permission.permit_delete"
            @click="handleDelete"
            >删 除
          </el-button>
        </template>
        <template slot-scope="{ type, size, row }" slot="menu">
          <el-button
            icon="icon-zhengjian"
            :size="size"
            :type="type"
            class="zhengJian-icon"
            @click.stop="handleCredentials(row)"
            >附件查阅
          </el-button>
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            @click.stop="rowDel(row)"
            v-if="row.type == '2'"
            >备案审批
          </el-button>
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            @click.stop="viewLicense(row)"
            v-if="row.type == '0'"
            >打印备案证
          </el-button>
        </template>
        <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>
    </basic-container>
    <div
      v-if="dialogVisible"
      class="dialogVisibles"
      :class="classStyle == 'print' ? 'printstyle' : ''"
    >
      <div
        id="licence_box"
        :class="classStyle == 'print' ? 'printstyle' : ''"
        ref="licence"
      >
        <div class="licence" id="licence" v-if="dialogVisible">
          <div class="licence-head">备案证</div>
          <div class="head-tid">
            洪公保服务
            <span class="fontStyle">{{
              licenceData.row.organizationcode
            }}</span>
            号
          </div>
          <div class="licence-main">
            <div
              class="l-m-once"
              v-for="(item, index, key) in licenceData.chiden"
              :key="key"
            >
              <span class="l-m-o-title"> {{ index }}: </span>
              <span class="l-m-r-once">{{ item }}</span>
            </div>
          </div>
          <div class="licence-bottom">发证机关（南昌市公安局）</div>
          <div class="l-bottom">
            发证日期
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(0, 4)
            }}</span
            >年
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(5, 7)
            }}</span>
            月
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(8, 10)
            }}</span>
            日
          </div>
        </div>
        <span slot="footer" class="dialog-footer no-print PrintBut">
          <el-button type="primary" @click="Print">打 印</el-button>
          <el-button type="primary" @click="closePrint"> 取 消 </el-button>
        </span>
      </div>
    </div>
    <el-dialog
      title=""
      :visible.sync="dialogVisiblecc"
      width="30%"
      :modal-append-to-body="false"
    >
      <div class="flots">
        <span class="f_title">是否通过备案审批？</span>
        <span class="f_body">请输入修改意见：</span>
        <textarea
          name="reworkmes"
          cols="40"
          rows="4"
          style="overflow: hidden"
          v-model="textareaShenpi"
        ></textarea>
        <div class="but">
          <el-button type="danger" @click="subcc">不通过</el-button>
          <el-button type="primary" @click="closecc">通过</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  getList,
  getDetail,
  add,
  update,
  remove,
} from "@/api/licenseApproval/recordk";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      classStyle: "print", //打印样式

      dialogVisiblecc: false, //许可证审核抽屉
      xukezData: {},

      dialogVisible: false, //许可证抽屉
      licenceData: {
        row: {},
        chiden: {},
      },
      textareaShenpi: "",

      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      selectionList: [],
      option: {
        height: "auto",
        calcHeight: 30,
        excelBtn: true,
        tip: false,
        searchShowBtn: false,
        searchShow: true,
        searchMenuSpan: 8,
        border: true,
        menuWidth: 300,
        labelWidth: 130,
        headerAlign: "center",
        align: "center",
        // border: false,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "企业名称",
            search: true,
            prop: "enterprisename",
            searchLabelWidth: 80,
            searchSpan: 4,
            overHidden: true,
            width: 250,
            rules: [
              {
                required: true,
                message: "请输入企业名称",
                trigger: "blur",
              },
            ],
          },
          {
            label: "社会信用代码",
            prop: "creditcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入统一社会信用代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人",
            prop: "representative",
            search: true,
            searchLabelWidth: 90,
            width: 82,
            rules: [
              {
                required: true,
                message: "请输入法定代表人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人电话",
            width: 106,
            prop: "representativecell",
            rules: [
              {
                required: true,
                message: "请输入法定代表人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人",
            prop: "contacts",
            width: 58,
            rules: [
              {
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人电话",
            width: 96,
            prop: "contactscell",
            rules: [
              {
                required: true,
                message: "请输入联系人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "单位许可证编号",
            prop: "perid",
            // labelWidth: 160,
            // span: 12,
            hide: true,
            rules: [
              {
                required: true,
                message: "单位许可证编号",
                trigger: "blur",
              },
            ],
          },
          {
            label: "许可证发证机关",
            prop: "offices",
            // labelWidth: 160,
            // span: 12,
            hide: true,
            rules: [
              {
                required: true,
                message: "许可证发证机关",
                trigger: "blur",
              },
            ],
          },
          {
            label: "发证时间",
            prop: "officetime",
            // labelWidth: 160,
            // span: 12,
            hide: true,
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
          },
          {
            label: "注册时间",
            hide: true,
            prop: "establishtime",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            rules: [
              {
                required: true,
                message: "请输入注册时间",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册资本",
            prop: "registeredcapital",
            rules: [
              {
                required: true,
                message: "请输入注册资本",
                trigger: "blur",
              },
            ],
          },
          {
            label: "组织机构代码",
            prop: "organizationcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入组织机构代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "工商注册号",
            hide: true,
            prop: "registrationnumber",
            rules: [
              {
                required: true,
                message: "请输入工商注册号",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "纳税人识别号",
          //   prop: "identificationnumber",
          //   hide: true,
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入纳税人识别号",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          // {
          //   label: "企业类型",
          //   hide: true,
          //   prop: "enterprises",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入企业类型",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "注册地址",
            prop: "address",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入注册地址",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属地区",
          //   hide: true,
          //   prop: "region",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入所属地区",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "登记机关",
            prop: "registration",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入登记机关",
                trigger: "blur",
              },
            ],
          },
          {
            label: "所属行业",
            hide: true,
            prop: "industry",
            rules: [
              {
                required: true,
                message: "请输入所属行业",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属机构",
          //   prop: "deptid",
          //   addDisplay: false,
          //   type: "select",
          //   hide: true,
          //   dicUrl: "/api/blade-system/dept/selectIn",
          //   props: {
          //     label: "deptname",
          //     value: "deptid",
          //   },
          // },
          // {
          //   label: "所属辖区",
          //   prop: "jurisdiction",
          //   type: "tree",
          //   dicUrl: "/api/jurisdiction/lazy-trees",
          //   props: {
          //     label: "title",
          //     value: "id",
          //   },
          //   // labelWidth: 160,
          //   // span: 12,
          // },
          {
            label: "许可类型",
            // search: true,
            hide: true,
            prop: "ptype",
            type: "select",
            searchSpan: 4,
            dicData: [
              {
                label: "设立分公司备案",
                value: "2",
              },
            ],
          },
          {
            label: "提交时间",
            prop: "permitime",
            overHidden: true,
            addDisplay: false,
            width: 132,
            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",
              },
            ],
          },
          {
            label: "经营范围",
            prop: "business",
            component: "AvueUeditor",
            hide: true,
            minRows: 6,
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入经营范围",
                trigger: "blur",
              },
            ],
          },
        ],
      },
      data: [],
    };
  },
  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.permit_add, false),
        viewBtn: this.vaildData(this.permission.permit_view, true),
        delBtn: this.vaildData(this.permission.permit_delete, false),
        editBtn: this.vaildData(this.permission.permit_edit, false),
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  // mounted() {
  //     console.log(this.userInfo.dept_id);
  // },
  methods: {
    Print() {
      this.$Print(this.$refs.licence);
    },

    handleCredentials(row) {
      this.$router.push({
        path: "/attachOnce/index",
        // redirect: { name: "foo" },
        // query: { row: row },
        query: { deptid: row.cardid, type: "0" },
        // params: { row: row.identificationnumber },
      });
    },
    rowSave(row, done, loading) {
      row.deptid = this.userInfo.dept_id;
      add(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          loading();
          window.console.log(error);
        }
      );
    },
    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.dialogVisiblecc = true;
      this.xukezData = row;
    },
    closecc() {
      this.xukezData.type = "0";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      console.log(this.xukezData);
      update(this.xukezData);
      this.textareaShenpi = "";
    },
    subcc() {
      this.xukezData.type = "1";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      update(this.xukezData);
      this.textareaShenpi = "";
    },

    viewLicense(row) {
      //查看许可证
      this.licenceData.row = row;
      this.licenceData.chiden = {};
      this.licenceData.chiden["名称"] = row.enterprisename;
      this.licenceData.chiden["住所"] = row.address;
      this.licenceData.chiden["法定代表人"] = row.representative;
      this.licenceData.chiden["服务范围"] = row.industry;
      this.licenceData.chiden["注册资本"] = row.registeredcapital;
      this.licenceData.chiden["批准文号"] = row.registrationnumber;

      console.log(this.licenceData);
      this.dialogVisible = true;
    },
    closePrint() {
      this.dialogVisible = false;
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then((res) => {
          this.form = res.data.data;
        });
      }
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      params["ptype"] = 5;
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },
    rowStyle({ row }) {
      if (row.dtype != null && row.dtype != "") {
        if (row.dtype == "2") {
          return {
            color: "#F34A4A",
          };
        }
        if (row.dtype == "1") {
          return {
            color: "#F48F57",
          };
        }
      }
    },
  },
};
</script>

<style scoped lang="scss">
.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;*/
}
#licence_box {
  position: relative;
  top: 15px;
  width: 1080px;
  height: 780px;
  background-color: #004ca7;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.licence {
  width: 960px;
  height: 648px;
  background-color: #fff !important;
  background-image: url("/img/permit/服务许可背景图.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-sizing: border-box;
  padding: 10%;
  color: #000;
}
.licence-head {
  width: 100%;
  height: 1.8rem;
  font-size: 1.8rem;
  text-align: center;
}
.head-tid {
  position: relative;
  left: 70%;
}
.head-tid span {
  margin: 0 1rem;
}
.licence-main {
  width: 80%;
}
.l-m-once {
  width: 100%;
  height: 2rem;
  margin-top: 1rem;
}
.l-m-o-title {
  font-size: 1.3rem;
  width: 22%;
  text-align: justify;
  display: inline-block;
}
.l-m-r-once {
  font-size: 1.1rem;
  /* border: 1px solid #000; */
  display: inline-block;
  width: 77%;
}
.licence-bottom,
.l-bottom {
  position: relative;
  left: 60%;
  font-size: 1.5rem;
  margin-top: 0.5rem;
}
.dialogVisibles {
  position: fixed;
  top: 0;
  left: -10%;
  height: 0;
  width: 120%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.printstyle {
  background-color: #fff !important;
}
.PrintBut {
  margin-top: 15px;
}

.flots {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  .f_title {
    position: absolute;
    top: 15px;
    font-size: 18px;
  }
}
.but {
  margin-top: 20px;
  width: 100%;
  display: flex;
  align-content: center;
  justify-content: center;
}
</style>

 src/views/licenseApproval/securityGuard.vue

New file
@@ -0,0 +1,1000 @@
/*
 * @Author: liu
 * @Date: 2021-08-26 16:57:58 
 * @Last Modified by: liu
 * @Last Modified time: 2021-08-28 10:42:08
 */


<template>
  <div>
    <basic-container class="permit">
      <avue-crud
        :option="option"
        :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 slot="menuLeft">
          <el-button
            type="danger"
            size="small"
            icon="el-icon-delete"
            plain
            v-if="permission.permit_delete"
            @click="handleDelete"
            >删 除
          </el-button>
        </template>
        <template slot-scope="{ type, size, row }" slot="menu">
          <el-button
            icon="icon-zhengjian"
            :size="size"
            :type="type"
            class="zhengJian-icon"
            @click.stop="handleCredentials(row)"
            >附件审查</el-button
          >
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            v-if="row.type == '2'"
            @click.stop="rowDel(row)"
            >备案审批
          </el-button>
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            @click.stop="viewLicense(row)"
            v-if="row.type == '0'"
            >打印备案证
          </el-button>
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            v-show="row.type == 0"
            @click.stop="viewLicensehuizhi(row)"
            >回执打印
          </el-button>
        </template>
        <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>
    </basic-container>
    <div
      v-if="dialogVisible"
      class="dialogVisibles"
      :class="classStyle == 'print' ? 'printstyle' : ''"
    >
      <div
        id="licence_box"
        :class="classStyle == 'print' ? 'printstyle' : ''"
        ref="licence"
      >
        <div class="licence" id="licence" v-if="dialogVisible">
          <div class="licence-head">备案证</div>
          <div class="head-tid">
            洪公保服务
            <span class="fontStyle">{{
              licenceData.row.organizationcode
            }}</span>
            号
          </div>
          <div class="licence-main">
            <div
              class="l-m-once"
              v-for="(item, index, key) in licenceData.chiden"
              :key="key"
            >
              <span class="l-m-o-title"> {{ index }}: </span>
              <span class="l-m-r-once">{{ item }}</span>
            </div>
          </div>
          <div class="licence-bottom">发证机关（南昌市公安局）</div>
          <div class="l-bottom">
            发证日期
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(0, 4)
            }}</span
            >年
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(5, 7)
            }}</span>
            月
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(8, 10)
            }}</span>
            日
          </div>
        </div>
        <span slot="footer" class="dialog-footer no-print PrintBut">
          <el-button type="primary" @click="Print">打 印</el-button>
          <el-button type="primary" @click="closePrint"> 取 消 </el-button>
        </span>
      </div>
    </div>

    <div
      v-if="dialogVisiblehuizhi"
      class="dialogVisibles"
      :class="classStyle == 'print' ? 'printstyle' : ''"
    >
      <div
        id="licence_box"
        :class="classStyle == 'print' ? 'printstyle' : ''"
        ref="licencelicencehuizhi"
      >
        <div
          class="licencehuizhi exam-box"
          id="licencehuizhi"
          v-if="dialogVisiblehuizhi"
        >
          <h3>回执单</h3>
          <p>
            南昌市公安局已收到
            <span>{{ rowData == null ? "" : rowData.enterprisename }}</span>
            的相关备案申请！
          </p>

          <div class="examine-bottom">
            <ul>
              <li>审批单位：<span>南昌市公安局</span></li>
              <li>
                日期：<span>{{
                  rowData == null ? "" : rowData.examinetime
                }}</span>
              </li>
            </ul>
          </div>
        </div>
        <span slot="footer" class="dialog-footer no-print PrintBut">
          <el-button type="primary" @click="Printhuizhi">打 印</el-button>
          <el-button type="primary" @click="closePrinthuizhi">
            取 消
          </el-button>
        </span>
      </div>
    </div>

    <el-dialog
      title=""
      :visible.sync="dialogVisiblecc"
      width="30%"
      :modal-append-to-body="false"
    >
      <div class="flots">
        <span class="f_title">是否通过备案审批？</span>
        <span class="f_body">请输入修改意见：</span>
        <textarea
          name="reworkmes"
          cols="40"
          rows="4"
          style="overflow: hidden"
          v-model="textareaShenpi"
        ></textarea>
        <div class="but">
          <el-button type="danger" @click="subcc">不通过</el-button>
          <el-button type="primary" @click="closecc">通过</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  getList,
  getDetail,
  add,
  update,
  remove,
} from "@/api/licenseApproval/record";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      classStyle: "print", //打印样式

      dialogVisiblecc: false, //许可证审核抽屉
      xukezData: {},

      dialogVisiblehuizhi: false, //回执

      dialogVisible: false, //许可证抽屉
      licenceData: {
        row: {},
        chiden: {},
      },
      textareaShenpi: "",

      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      selectionList: [],
      option: {
        height: "auto",
        calcHeight: 30,
        excelBtn: true,
        tip: false,
        searchShowBtn: false,
        searchShow: true,
        searchMenuSpan: 8,
        border: true,
        menuWidth: 378,
        labelWidth: 130,
        headerAlign: "center",
        align: "center",
        // border: false,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "企业名称",
            search: true,
            prop: "enterprisename",
            searchLabelWidth: 80,
            searchSpan: 4,
            overHidden: true,
            width: 200,
            rules: [
              {
                required: true,
                message: "请输入企业名称",
                trigger: "blur",
              },
            ],
          },
          {
            label: "社会信用代码",
            prop: "creditcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入统一社会信用代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人",
            prop: "representative",
            search: true,
            width: 82,
            searchLabelWidth: 90,
            rules: [
              {
                required: true,
                message: "请输入法定代表人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人电话",
            width: 106,
            prop: "representativecell",
            rules: [
              {
                required: true,
                message: "请输入法定代表人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人",
            prop: "contacts",
            width: 58,
            rules: [
              {
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人电话",
            width: 96,
            prop: "contactscell",
            rules: [
              {
                required: true,
                message: "请输入联系人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "单位许可证编号",
            prop: "perid",
            // labelWidth: 160,
            // span: 12,
            hide: true,
            rules: [
              {
                required: true,
                message: "单位许可证编号",
                trigger: "blur",
              },
            ],
          },
          {
            label: "许可证发证机关",
            prop: "offices",
            // labelWidth: 160,
            // span: 12,
            hide: true,
            rules: [
              {
                required: true,
                message: "许可证发证机关",
                trigger: "blur",
              },
            ],
          },
          {
            label: "发证时间",
            prop: "officetime",
            // labelWidth: 160,
            // span: 12,
            hide: true,
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
          },
          {
            label: "注册时间",
            hide: true,
            prop: "establishtime",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            rules: [
              {
                required: true,
                message: "请输入注册时间",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册资本",
            prop: "registeredcapital",
            rules: [
              {
                required: true,
                message: "请输入注册资本",
                trigger: "blur",
              },
            ],
          },
          {
            label: "组织机构代码",
            prop: "organizationcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入组织机构代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "工商注册号",
            hide: true,
            prop: "registrationnumber",
            rules: [
              {
                required: true,
                message: "请输入工商注册号",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "纳税人识别号",
          //   prop: "identificationnumber",
          //   hide: true,
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入纳税人识别号",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          // {
          //   label: "企业类型",
          //   hide: true,
          //   prop: "enterprises",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入企业类型",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "注册地址",
            prop: "address",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入注册地址",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属地区",
          //   hide: true,
          //   prop: "region",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入所属地区",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "登记机关",
            prop: "registration",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入登记机关",
                trigger: "blur",
              },
            ],
          },
          {
            label: "所属行业",
            hide: true,
            prop: "industry",
            rules: [
              {
                required: true,
                message: "请输入所属行业",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属机构",
          //   prop: "deptid",
          //   addDisplay: false,
          //   type: "select",
          //   hide: true,
          //   dicUrl: "/api/blade-system/dept/selectIn",
          //   props: {
          //     label: "deptname",
          //     value: "deptid",
          //   },
          // },
          {
            label: "所属辖区",
            prop: "jurisdiction",
            type: "tree",
            dicUrl: "/api/jurisdiction/lazy-trees",
            props: {
              label: "title",
              value: "id",
            },
            // labelWidth: 160,
            // span: 12,
          },
          {
            label: "许可类型",
            // search: true,
            hide: true,
            prop: "ptype",
            type: "select",
            searchSpan: 4,
            dicData: [
              {
                label: "自招保安单位备案",
                value: "3",
              },
            ],
          },
          {
            label: "提交时间",
            prop: "permitime",
            overHidden: true,
            addDisplay: false,
            width: 132,
            type: "date",
            format: "yyyy-MM-dd HH:mm:ss",
            valueFormat: "yyyy-MM-dd HH:mm:ss",
          },
          {
            label: "审核状态",
            prop: "type",
            addDisplay: false,
            type: "select",
            width: 80,
            dicData: [
              {
                label: "通过",
                value: "0",
              },
              {
                label: "不通过",
                value: "1",
              },
              {
                label: "待审核",
                value: "2",
              },
            ],
          },
          {
            label: "经营范围",
            prop: "business",
            component: "AvueUeditor",
            hide: true,
            minRows: 6,
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入经营范围",
                trigger: "blur",
              },
            ],
          },
        ],
      },
      data: [],
    };
  },
  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.permit_add, false),
        viewBtn: this.vaildData(this.permission.permit_view, true),
        delBtn: this.vaildData(this.permission.permit_delete, false),
        editBtn: this.vaildData(this.permission.permit_edit, false),
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  // mounted() {
  //     console.log(this.userInfo.dept_id);
  // },
  methods: {
    Printhuizhi() {
      this.$Print(this.$refs.licencehuizhi);
    },
    Print() {
      this.$Print(this.$refs.licence);
    },

    handleCredentials(row) {
      this.$router.push({
        path: "/attachOnce/index",
        // redirect: { name: "foo" },
        // query: { row: row },
        query: { deptid: row.cardid, type: "0" },
        // params: { row: row.identificationnumber },
      });
    },
    rowSave(row, done, loading) {
      row.deptid = this.userInfo.dept_id;
      add(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          loading();
          window.console.log(error);
        }
      );
    },
    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.dialogVisiblecc = true;
      this.xukezData = row;
    },
    closecc() {
      this.xukezData.type = "0";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      console.log(this.xukezData);
      update(this.xukezData);
      this.textareaShenpi = "";
    },
    subcc() {
      this.xukezData.type = "1";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      update(this.xukezData);
      this.textareaShenpi = "";
    },

    viewLicensehuizhi() {
      this.dialogVisiblehuizhi = true;
    },
    closePrinthuizhi() {
      this.dialogVisiblehuizhi = false;
    },
    viewLicense(row) {
      //查看许可证
      this.licenceData.row = row;
      this.licenceData.chiden = {};
      this.licenceData.chiden["名称"] = row.enterprisename;
      this.licenceData.chiden["住所"] = row.address;
      this.licenceData.chiden["法定代表人"] = row.representative;
      this.licenceData.chiden["服务范围"] = row.industry;
      this.licenceData.chiden["注册资本"] = row.registeredcapital;
      this.licenceData.chiden["批准文号"] = row.registrationnumber;

      console.log(this.licenceData);
      this.dialogVisible = true;
    },
    closePrint() {
      this.dialogVisible = false;
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then((res) => {
          this.form = res.data.data;
        });
      }
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      params["ptype"] = 3;
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },
    rowStyle({ row }) {
      if (row.dtype != null && row.dtype != "") {
        if (row.dtype == "2") {
          return {
            color: "#F34A4A",
          };
        }
        if (row.dtype == "1") {
          return {
            color: "#F48F57",
          };
        }
      }
    },
  },
};
</script>

<style scoped lang="scss">
.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;*/
}
#licence_box {
  position: relative;
  top: 15px;
  width: 1080px;
  height: 780px;
  background-color: #004ca7;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.licence {
  width: 960px;
  height: 648px;
  background-color: #fff !important;
  background-image: url("/img/permit/服务许可背景图.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-sizing: border-box;
  padding: 10%;
  color: #000;
}
.licencehuizhi {
  width: 800px;
  height: 348px;
  background-color: #fff !important;
  // background-image: url("../../static/img/permit/服务许可背景图.png");
  border: 1px solid rgba(#a3a3a3, 0.5);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-sizing: border-box;
  padding: 10%;
  color: #000;
}
.licence-head {
  width: 100%;
  height: 1.8rem;
  font-size: 1.8rem;
  text-align: center;
}
.head-tid {
  position: relative;
  left: 70%;
}
.head-tid span {
  margin: 0 1rem;
}
.licence-main {
  width: 80%;
}
.l-m-once {
  width: 100%;
  height: 2rem;
  margin-top: 1rem;
}
.l-m-o-title {
  font-size: 1.3rem;
  width: 22%;
  text-align: justify;
  display: inline-block;
}
.l-m-r-once {
  font-size: 1.1rem;
  /* border: 1px solid #000; */
  display: inline-block;
  width: 77%;
}
.licence-bottom,
.l-bottom {
  position: relative;
  left: 60%;
  font-size: 1.5rem;
  margin-top: 0.5rem;
}
.dialogVisibles {
  position: fixed;
  top: 0;
  left: -10%;
  height: 0;
  width: 120%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.printstyle {
  background-color: #fff !important;
}
.PrintBut {
  margin-top: 15px;
}

.flots {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  span {
    display: inline-block;
  }
  .f_title {
    position: absolute;
    top: 15px;
    font-size: 18px;
  }
}
.but {
  margin-top: 20px;
  width: 100%;
  display: flex;
  align-content: center;
  justify-content: center;
}
.exam-box {
  width: 100%;
  height: 360px;

  position: relative;
  padding: 10px;
  background: #fff !important;
  color: #000;

  box-sizing: border-box;
}
.exam-box h3 {
  margin: 0;
  text-align: center;
  font-size: 28px;
  letter-spacing: 10px;
  line-height: 46px;
}

.exam-box p {
  text-indent: 2em;
  font-size: 18px;
}

.exam-box .examine-bottom {
  position: absolute;
  bottom: 10px;
  right: 10px;
}

.exam-box li {
  list-style: none;
  font-size: 18px;
  line-height: 32px;
}

.exam-box span {
  text-decoration: underline;
}
</style>

 src/views/licenseApproval/securityPermit.vue

New file
@@ -0,0 +1,899 @@

/*
 * @Author: liu
 * @Date: 2021-08-26 16:22:20 
 * @Last Modified by: liu
 * @Last Modified time: 2021-08-28 10:29:07
 */

<template>
  <div>
    <basic-container class="permit">
      <avue-crud
        :option="option"
        :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 slot="menuLeft">
          <el-button
            type="danger"
            size="small"
            icon="el-icon-delete"
            plain
            v-if="permission.permit_delete"
            @click="handleDelete"
            >删 除
          </el-button>
        </template>
        <template slot-scope="{ type, size, row }" slot="menu">
          <el-button
            icon="icon-zhengjian"
            :size="size"
            :type="type"
            class="zhengJian-icon"
            @click.stop="handleCredentials(row)"
            >附件查阅
          </el-button>
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            @click.stop="rowDel(row)"
            v-if="row.type == '2'"
            >许可审批
          </el-button>
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            @click.stop="viewLicense(row)"
            v-if="row.type == '0'"
            >打印许可证
          </el-button>
        </template>
        <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>
    </basic-container>

    <!-- <el-dialog
      :visible.sync="dialogVisible"
      :before-close="handleClose"
      :modal-append-to-body="false"
      width="1005px"
      top="10vh"
      class="printstyle"
    >
      <div id="licence_box">
        <div class="licence" id="licence" v-if="dialogVisible">
          <div class="licence-head">保安服务许可证</div>
          <div class="head-tid">
            洪公保服务
            <span class="fontStyle">{{
              licenceData.row.organizationcode
            }}</span>
            号
          </div>
          <div class="licence-main">
            <div
              class="l-m-once"
              v-for="(item, index, key) in licenceData.chiden"
              :key="key"
            >
              <span class="l-m-o-title"> {{ index }}: </span>
              <span class="l-m-r-once">{{ item }}</span>
            </div>
          </div>
          <div class="licence-bottom">发证机关（南昌市公安局）</div>
          <div class="l-bottom">
            发证日期
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(0, 4)
            }}</span
            >年
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(5, 7)
            }}</span>
            月
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(8, 10)
            }}</span>
            日
          </div>
        </div>
      </div>

      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="Print">打 印</el-button>
      </span>
    </el-dialog> -->
    <div
      v-if="dialogVisible"
      class="dialogVisibles"
      :class="classStyle == 'print' ? 'printstyle' : ''"
    >
      <div
        id="licence_box"
        :class="classStyle == 'print' ? 'printstyle' : ''"
        ref="licence"
      >
        <div class="licence" id="licence" v-if="dialogVisible">
          <div class="licence-head">保安服务许可证</div>
          <div class="head-tid">
            洪公保服务
            <span class="fontStyle">{{
              licenceData.row.organizationcode
            }}</span>
            号
          </div>
          <div class="licence-main">
            <div
              class="l-m-once"
              v-for="(item, index, key) in licenceData.chiden"
              :key="key"
            >
              <span class="l-m-o-title"> {{ index }}: </span>
              <span class="l-m-r-once">{{ item }}</span>
            </div>
          </div>
          <div class="licence-bottom">发证机关（南昌市公安局）</div>
          <div class="l-bottom">
            发证日期
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(0, 4)
            }}</span
            >年
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(5, 7)
            }}</span>
            月
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(8, 10)
            }}</span>
            日
          </div>
        </div>
        <span slot="footer" class="dialog-footer no-print PrintBut">
          <el-button type="primary" @click="Print">打 印</el-button>
          <el-button type="primary" @click="closePrint"> 取 消 </el-button>
        </span>
      </div>
    </div>

    <el-dialog
      title=""
      :visible.sync="dialogVisiblecc"
      width="30%"
      :modal-append-to-body="false"
    >
      <div class="flots">
        <span class="f_title">是否通过审核？</span>
        <span class="f_body">请输入修改意见：</span>
        <textarea
          name="reworkmes"
          cols="40"
          rows="4"
          style="overflow: hidden"
          v-model="textareaShenpi"
        ></textarea>
        <div class="but">
          <el-button type="danger" @click="subcc">不通过</el-button>
          <el-button type="primary" @click="closecc">通过</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  getList,
  getDetail,
  add,
  update,
  remove,
} from "@/api/licenseApproval/permit";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      classStyle: "print", //打印样式

      dialogVisiblecc: false, //许可证审核抽屉
      xukezData: {},

      dialogVisible: false, //许可证抽屉
      licenceData: {
        row: {},
        chiden: {},
      },
      textareaShenpi: "",

      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      selectionList: [],
      option: {
        height: "auto",
        calcHeight: 30,
        excelBtn: true,
        tip: false,
        searchShowBtn: false,
        searchShow: true,
        searchMenuSpan: 8,
        border: true,
        menuWidth: 300,
        labelWidth: 130,
        headerAlign: "center",
        align: "center",
        // border: false,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "企业名称",
            search: true,
            prop: "enterprisename",
            searchLabelWidth: 80,
            searchSpan: 4,
            overHidden: true,
            width: 250,
            rules: [
              {
                required: true,
                message: "请输入企业名称",
                trigger: "blur",
              },
            ],
          },
          {
            label: "社会信用代码",
            prop: "creditcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入统一社会信用代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人",
            prop: "representative",
            search: true,
            searchLabelWidth: 90,
            width: 82,
            rules: [
              {
                required: true,
                message: "请输入法定代表人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人电话",
            width: 106,
            prop: "representativecell",
            rules: [
              {
                required: true,
                message: "请输入法定代表人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人",
            prop: "contacts",
            width: 58,
            rules: [
              {
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人电话",
            width: 96,
            prop: "contactscell",
            rules: [
              {
                required: true,
                message: "请输入联系人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册时间",
            hide: true,
            prop: "establishtime",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            rules: [
              {
                required: true,
                message: "请输入注册时间",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册资本",
            prop: "registeredcapital",
            rules: [
              {
                required: true,
                message: "请输入注册资本",
                trigger: "blur",
              },
            ],
          },
          {
            label: "组织机构代码",
            prop: "organizationcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入组织机构代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "工商注册号",
            hide: true,
            prop: "registrationnumber",
            rules: [
              {
                required: true,
                message: "请输入工商注册号",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "纳税人识别号",
          //   prop: "identificationnumber",
          //   hide: true,
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入纳税人识别号",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          // {
          //   label: "企业类型",
          //   hide: true,
          //   prop: "enterprises",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入企业类型",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "注册地址",
            prop: "address",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入注册地址",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属地区",
          //   hide: true,
          //   prop: "region",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入所属地区",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "登记机关",
            prop: "registration",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入登记机关",
                trigger: "blur",
              },
            ],
          },
          {
            label: "所属行业",
            hide: true,
            prop: "industry",
            rules: [
              {
                required: true,
                message: "请输入所属行业",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属机构",
          //   prop: "deptid",
          //   addDisplay: false,
          //   type: "select",
          //   hide: true,
          //   dicUrl: "/api/blade-system/dept/selectIn",
          //   props: {
          //     label: "deptname",
          //     value: "deptid",
          //   },
          // },
          {
            label: "所属辖区",
            prop: "jurisdiction",
            type: "tree",
            dicUrl: "/api/jurisdiction/lazy-trees",
            props: {
              label: "title",
              value: "id",
            },
            // labelWidth: 160,
            // span: 12,
          },
          {
            label: "许可类型",
            // search: true,
            hide: true,
            prop: "ptype",
            type: "select",
            searchSpan: 4,
            dicData: [
              {
                label: "保安服务许可",
                value: "0",
              },
            ],
          },
          {
            label: "提交时间",
            prop: "permitime",
            overHidden: true,
            addDisplay: false,
            width: 132,
            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",
              },
            ],
          },
          {
            label: "经营范围",
            prop: "business",
            component: "AvueUeditor",
            hide: true,
            minRows: 6,
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入经营范围",
                trigger: "blur",
              },
            ],
          },
        ],
      },
      data: [],
    };
  },
  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.permit_add, false),
        viewBtn: this.vaildData(this.permission.permit_view, true),
        delBtn: this.vaildData(this.permission.permit_delete, false),
        editBtn: this.vaildData(this.permission.permit_edit, false),
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  // mounted() {
  //     console.log(this.userInfo.dept_id);
  // },
  methods: {
    Print() {
      this.$Print(this.$refs.licence);
    },

    handleCredentials(row) {
      console.log(row, "21354");
      this.$router.push({
        path: "/attachOnce/index",
        // redirect: { name: "foo" },
        // query: { row: row },
        query: { deptid: row.cardid, type: "0" },
        // params: { row: row.identificationnumber },
      });
    },
    rowSave(row, done, loading) {
      row.deptid = this.userInfo.dept_id;
      add(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          loading();
          window.console.log(error);
        }
      );
    },
    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.dialogVisiblecc = true;
      this.xukezData = row;
    },
    closecc() {
      this.xukezData.type = "0";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      console.log(this.xukezData);
      update(this.xukezData);
      this.textareaShenpi = "";
    },
    subcc() {
      this.xukezData.type = "1";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      update(this.xukezData);
      this.textareaShenpi = "";
    },

    viewLicense(row) {
      //查看许可证
      this.licenceData.row = row;
      this.licenceData.chiden = {};
      this.licenceData.chiden["名称"] = row.enterprisename;
      this.licenceData.chiden["住所"] = row.address;
      this.licenceData.chiden["法定代表人"] = row.representative;
      this.licenceData.chiden["服务范围"] = row.industry;
      this.licenceData.chiden["注册资本"] = row.registeredcapital;
      this.licenceData.chiden["批准文号"] = row.registrationnumber;

      console.log(this.licenceData);
      this.dialogVisible = true;
    },
    closePrint() {
      this.dialogVisible = false;
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then((res) => {
          this.form = res.data.data;
        });
      }
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      params["ptype"] = 0;
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },
    rowStyle({ row }) {
      if (row.dtype != null && row.dtype != "") {
        if (row.dtype == "2") {
          return {
            color: "#F34A4A",
          };
        }
        if (row.dtype == "1") {
          return {
            color: "#F48F57",
          };
        }
      }
    },
  },
};
</script>

<style scoped lang="scss">
.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;*/
}
#licence_box {
  position: relative;
  top: 15px;
  width: 1080px;
  height: 780px;
  background-color: #004ca7;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.licence {
  width: 960px;
  height: 648px;
  background-color: #fff !important;
  background-image: url("/img/permit/服务许可背景图.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-sizing: border-box;
  padding: 10%;
  color: #000;
}
.licence-head {
  width: 100%;
  height: 1.8rem;
  font-size: 1.8rem;
  text-align: center;
}
.head-tid {
  position: relative;
  left: 70%;
}
.head-tid span {
  margin: 0 1rem;
}
.licence-main {
  width: 80%;
}
.l-m-once {
  width: 100%;
  height: 2rem;
  margin-top: 1rem;
}
.l-m-o-title {
  font-size: 1.3rem;
  width: 22%;
  text-align: justify;
  display: inline-block;
}
.l-m-r-once {
  font-size: 1.1rem;
  /* border: 1px solid #000; */
  display: inline-block;
  width: 77%;
}
.licence-bottom,
.l-bottom {
  position: relative;
  left: 60%;
  font-size: 1.5rem;
  margin-top: 0.5rem;
}
.dialogVisibles {
  position: fixed;
  top: 0;
  left: -10%;
  height: 0;
  width: 120%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.printstyle {
  background-color: #fff !important;
}
.PrintBut {
  margin-top: 15px;
}

.flots {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  .f_title {
    position: absolute;
    top: 15px;
    font-size: 18px;
  }
}
.but {
  margin-top: 20px;
  width: 100%;
  display: flex;
  align-content: center;
  justify-content: center;
}
</style>

 src/views/licenseApproval/securityTraining.vue

New file
@@ -0,0 +1,898 @@
/*
 * @Author: liu
 * @Date: 2021-08-26 16:55:25 
 * @Last Modified by: liu
 * @Last Modified time: 2021-08-28 10:29:12
 */


<template>
  <div>
    <basic-container class="permit">
      <avue-crud
        :option="option"
        :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 slot="menuLeft">
          <el-button
            type="danger"
            size="small"
            icon="el-icon-delete"
            plain
            v-if="permission.permit_delete"
            @click="handleDelete"
            >删 除
          </el-button>
        </template>
        <template slot-scope="{ type, size, row }" slot="menu">
          <el-button
            icon="icon-zhengjian"
            :size="size"
            :type="type"
            class="zhengJian-icon"
            @click.stop="handleCredentials(row)"
            >附件查阅
          </el-button>
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            @click.stop="rowDel(row)"
            v-if="row.type == '2'"
            >许可审批
          </el-button>
          <el-button
            icon="el-icon-edit"
            :size="size"
            :type="type"
            @click.stop="viewLicense(row)"
            v-if="row.type == '0'"
            >打印许可证
          </el-button>
        </template>
        <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>
    </basic-container>

    <!-- <el-dialog
      :visible.sync="dialogVisible"
      :before-close="handleClose"
      :modal-append-to-body="false"
      width="1005px"
      top="10vh"
      class="printstyle"
    >
      <div id="licence_box">
        <div class="licence" id="licence" v-if="dialogVisible">
          <div class="licence-head">保安服务许可证</div>
          <div class="head-tid">
            洪公保服务
            <span class="fontStyle">{{
              licenceData.row.organizationcode
            }}</span>
            号
          </div>
          <div class="licence-main">
            <div
              class="l-m-once"
              v-for="(item, index, key) in licenceData.chiden"
              :key="key"
            >
              <span class="l-m-o-title"> {{ index }}: </span>
              <span class="l-m-r-once">{{ item }}</span>
            </div>
          </div>
          <div class="licence-bottom">发证机关（南昌市公安局）</div>
          <div class="l-bottom">
            发证日期
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(0, 4)
            }}</span
            >年
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(5, 7)
            }}</span>
            月
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(8, 10)
            }}</span>
            日
          </div>
        </div>
      </div>

      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="Print">打 印</el-button>
      </span>
    </el-dialog> -->
    <div
      v-if="dialogVisible"
      class="dialogVisibles"
      :class="classStyle == 'print' ? 'printstyle' : ''"
    >
      <div
        id="licence_box"
        :class="classStyle == 'print' ? 'printstyle' : ''"
        ref="licence"
      >
        <div class="licence" id="licence" v-if="dialogVisible">
          <div class="licence-head">保安服务许可证</div>
          <div class="head-tid">
            洪公保服务
            <span class="fontStyle">{{
              licenceData.row.organizationcode
            }}</span>
            号
          </div>
          <div class="licence-main">
            <div
              class="l-m-once"
              v-for="(item, index, key) in licenceData.chiden"
              :key="key"
            >
              <span class="l-m-o-title"> {{ index }}: </span>
              <span class="l-m-r-once">{{ item }}</span>
            </div>
          </div>
          <div class="licence-bottom">发证机关（南昌市公安局）</div>
          <div class="l-bottom">
            发证日期
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(0, 4)
            }}</span
            >年
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(5, 7)
            }}</span>
            月
            <span class="l-b-t">{{
              licenceData.row.permitime.slice(8, 10)
            }}</span>
            日
          </div>
        </div>
        <span slot="footer" class="dialog-footer no-print PrintBut">
          <el-button type="primary" @click="Print">打 印</el-button>
          <el-button type="primary" @click="closePrint"> 取 消 </el-button>
        </span>
      </div>
    </div>

    <el-dialog
      title=""
      :visible.sync="dialogVisiblecc"
      width="30%"
      :modal-append-to-body="false"
    >
      <div class="flots">
        <span class="f_title">是否通过审核？</span>
        <span class="f_body">请输入修改意见：</span>
        <textarea
          name="reworkmes"
          cols="40"
          rows="4"
          style="overflow: hidden"
          v-model="textareaShenpi"
        ></textarea>
        <div class="but">
          <el-button type="danger" @click="subcc">不通过</el-button>
          <el-button type="primary" @click="closecc">通过</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  getList,
  getDetail,
  add,
  update,
  remove,
} from "@/api/licenseApproval/permit";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      classStyle: "print", //打印样式

      dialogVisiblecc: false, //许可证审核抽屉
      xukezData: {},

      dialogVisible: false, //许可证抽屉
      licenceData: {
        row: {},
        chiden: {},
      },
      textareaShenpi: "",

      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      selectionList: [],
      option: {
        height: "auto",
        calcHeight: 30,
        excelBtn: true,
        tip: false,
        searchShowBtn: false,
        searchShow: true,
        searchMenuSpan: 8,
        border: true,
        menuWidth: 300,
        labelWidth: 130,
        headerAlign: "center",
        align: "center",
        // border: false,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "企业名称",
            search: true,
            prop: "enterprisename",
            searchLabelWidth: 80,
            searchSpan: 4,
            overHidden: true,
            width: 250,
            rules: [
              {
                required: true,
                message: "请输入企业名称",
                trigger: "blur",
              },
            ],
          },
          {
            label: "社会信用代码",
            prop: "creditcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入统一社会信用代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人",
            prop: "representative",
            search: true,
            width: 82,
            searchLabelWidth: 90,
            rules: [
              {
                required: true,
                message: "请输入法定代表人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "法定代表人电话",
            width: 106,
            prop: "representativecell",
            rules: [
              {
                required: true,
                message: "请输入法定代表人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人",
            prop: "contacts",
            width: 58,
            rules: [
              {
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人电话",
            width: 96,
            prop: "contactscell",
            rules: [
              {
                required: true,
                message: "请输入联系人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册时间",
            hide: true,
            prop: "establishtime",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            rules: [
              {
                required: true,
                message: "请输入注册时间",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册资本",
            prop: "registeredcapital",
            rules: [
              {
                required: true,
                message: "请输入注册资本",
                trigger: "blur",
              },
            ],
          },
          {
            label: "组织机构代码",
            prop: "organizationcode",
            hide: true,
            rules: [
              {
                required: true,
                message: "请输入组织机构代码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "工商注册号",
            hide: true,
            prop: "registrationnumber",
            rules: [
              {
                required: true,
                message: "请输入工商注册号",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "纳税人识别号",
          //   prop: "identificationnumber",
          //   hide: true,
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入纳税人识别号",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          // {
          //   label: "企业类型",
          //   hide: true,
          //   prop: "enterprises",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入企业类型",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "注册地址",
            prop: "address",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入注册地址",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属地区",
          //   hide: true,
          //   prop: "region",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入所属地区",
          //       trigger: "blur",
          //     },
          //   ],
          // },
          {
            label: "登记机关",
            prop: "registration",
            overHidden: true,
            rules: [
              {
                required: true,
                message: "请输入登记机关",
                trigger: "blur",
              },
            ],
          },
          {
            label: "所属行业",
            hide: true,
            prop: "industry",
            rules: [
              {
                required: true,
                message: "请输入所属行业",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "所属机构",
          //   prop: "deptid",
          //   addDisplay: false,
          //   type: "select",
          //   hide: true,
          //   dicUrl: "/api/blade-system/dept/selectIn",
          //   props: {
          //     label: "deptname",
          //     value: "deptid",
          //   },
          // },
          {
            label: "所属辖区",
            prop: "jurisdiction",
            type: "tree",
            dicUrl: "/api/jurisdiction/lazy-trees",
            props: {
              label: "title",
              value: "id",
            },
            // labelWidth: 160,
            // span: 12,
          },
          {
            label: "许可类型",
            // search: true,
            hide: true,
            prop: "ptype",
            type: "select",
            searchSpan: 4,
            dicData: [
              {
                label: "保安培训许可",
                value: "1",
              },
            ],
          },
          {
            label: "提交时间",
            prop: "permitime",
            overHidden: true,
            addDisplay: false,
            width: 132,
            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",
              },
            ],
          },
          {
            label: "经营范围",
            prop: "business",
            component: "AvueUeditor",
            hide: true,
            minRows: 6,
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入经营范围",
                trigger: "blur",
              },
            ],
          },
        ],
      },
      data: [],
    };
  },
  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.permit_add, false),
        viewBtn: this.vaildData(this.permission.permit_view, true),
        delBtn: this.vaildData(this.permission.permit_delete, false),
        editBtn: this.vaildData(this.permission.permit_edit, false),
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  // mounted() {
  //     console.log(this.userInfo.dept_id);
  // },
  methods: {
    Print() {
      this.$Print(this.$refs.licence);
    },

    handleCredentials(row) {
      this.$router.push({
        path: "/attachOnce/index",
        // redirect: { name: "foo" },
        // query: { row: row },
        query: { deptid: row.cardid, type: "0" },
        // params: { row: row.identificationnumber },
      });
    },
    rowSave(row, done, loading) {
      row.deptid = this.userInfo.dept_id;
      add(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          loading();
          window.console.log(error);
        }
      );
    },
    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.dialogVisiblecc = true;
      this.xukezData = row;
    },
    closecc() {
      this.xukezData.type = "0";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      console.log(this.xukezData);
      update(this.xukezData);
      this.textareaShenpi = "";
    },
    subcc() {
      this.xukezData.type = "1";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      update(this.xukezData);
      this.textareaShenpi = "";
    },

    viewLicense(row) {
      //查看许可证
      this.licenceData.row = row;
      this.licenceData.chiden = {};
      this.licenceData.chiden["名称"] = row.enterprisename;
      this.licenceData.chiden["住所"] = row.address;
      this.licenceData.chiden["法定代表人"] = row.representative;
      this.licenceData.chiden["服务范围"] = row.industry;
      this.licenceData.chiden["注册资本"] = row.registeredcapital;
      this.licenceData.chiden["批准文号"] = row.registrationnumber;

      console.log(this.licenceData);
      this.dialogVisible = true;
    },
    closePrint() {
      this.dialogVisible = false;
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then((res) => {
          this.form = res.data.data;
        });
      }
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      params["ptype"] = 1;
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },
    rowStyle({ row }) {
      if (row.dtype != null && row.dtype != "") {
        if (row.dtype == "2") {
          return {
            color: "#F34A4A",
          };
        }
        if (row.dtype == "1") {
          return {
            color: "#F48F57",
          };
        }
      }
    },
  },
};
</script>

<style scoped lang="scss">
.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;*/
}
#licence_box {
  position: relative;
  top: 15px;
  width: 1080px;
  height: 780px;
  background-color: #004ca7;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.licence {
  width: 960px;
  height: 648px;
  background-color: #fff !important;
  background-image: url("/img/permit/服务许可背景图.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-sizing: border-box;
  padding: 10%;
  color: #000;
}
.licence-head {
  width: 100%;
  height: 1.8rem;
  font-size: 1.8rem;
  text-align: center;
}
.head-tid {
  position: relative;
  left: 70%;
}
.head-tid span {
  margin: 0 1rem;
}
.licence-main {
  width: 80%;
}
.l-m-once {
  width: 100%;
  height: 2rem;
  margin-top: 1rem;
}
.l-m-o-title {
  font-size: 1.3rem;
  width: 22%;
  text-align: justify;
  display: inline-block;
}
.l-m-r-once {
  font-size: 1.1rem;
  /* border: 1px solid #000; */
  display: inline-block;
  width: 77%;
}
.licence-bottom,
.l-bottom {
  position: relative;
  left: 60%;
  font-size: 1.5rem;
  margin-top: 0.5rem;
}
.dialogVisibles {
  position: fixed;
  top: 0;
  left: -10%;
  height: 0;
  width: 120%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.printstyle {
  background-color: #fff !important;
}
.PrintBut {
  margin-top: 15px;
}

.flots {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  .f_title {
    position: absolute;
    top: 15px;
    font-size: 18px;
  }
}
.but {
  margin-top: 20px;
  width: 100%;
  display: flex;
  align-content: center;
  justify-content: center;
}
</style>

 src/views/management/peopleDetails.vue

@@ -399,6 +399,21 @@
  },
  mounted() {
    // this.$store.state.tags.tag.label = '保安详细资料'
    var flag = false,
      i = 0,
      ind = null;
    this.$store.state.tags.tagList.forEach((item, index) => {
      if (item.label == "保安详细资料") {
        if (flag == false) {
          ind = index;
          flag = true;
        }
        i++;
      }
    });
    if (i > 1) {
      this.$store.state.tags.tagList.splice(ind, 1);
    }
  },
  methods: {
    handleClick(tab) {

 src/views/permit/permit.vue

@@ -182,11 +182,21 @@
      width="30%"
      :modal-append-to-body="false"
    >
      <span>是否通过审核？</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closecc">通过</el-button>
        <el-button type="primary" @click="subcc">不通过</el-button>
      </span>
      <div class="flots">
        <span class="f_title">是否通过审核？</span>
        <span class="f_body">请输入修改意见：</span>
        <textarea
          name="reworkmes"
          cols="40"
          rows="4"
          style="overflow: hidden"
          v-model="textareaShenpi"
        ></textarea>
        <div class="but">
          <el-button @click="closecc">通过</el-button>
          <el-button type="primary" @click="subcc">不通过</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>
@@ -208,6 +218,7 @@
        row: {},
        chiden: {},
      },
      textareaShenpi: "",

      form: {},
      query: {},
@@ -276,7 +287,43 @@
            ],
          },
          {
            label: "法定代表人电话",
            width: 150,
            prop: "representativecell",
            rules: [
              {
                required: true,
                message: "请输入法定代表人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人",
            prop: "contacts",
            rules: [
              {
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人电话",
            width: 150,
            prop: "contactscell",
            rules: [
              {
                required: true,
                message: "请输入联系人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册时间",
            hide: true,
            prop: "establishtime",
            type: "date",
            format: "yyyy-MM-dd",
@@ -547,11 +594,14 @@
    closecc() {
      this.xukezData.type = "0";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      console.log(this.xukezData);
      return update(this.xukezData);
    },
    subcc() {
      this.xukezData.type = "1";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      return update(this.xukezData);
    },

@@ -660,7 +710,7 @@
};
</script>

<style scoped>
<style scoped lang="scss">
.dtype {
  width: 80px;
}
@@ -793,4 +843,22 @@
.PrintBut {
  margin-top: 15px;
}

.flots {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  .f_title {
    position: absolute;
    top: 15px;
    font-size: 18px;
  }
}
.but {
  margin-top: 20px;
  width: 100%;
  display: flex;
  align-content: center;
  justify-content: center;
}
</style>

 src/views/qualificationExamination/qualificationExamination.vue

@@ -25,6 +25,7 @@
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
      @sort-change="sortChange"
    >
    </avue-crud>
  </basic-container>
@@ -46,6 +47,7 @@
export default {
  data() {
    return {
      sort: {},
      form: {},
      query: {},
      loading: true,
@@ -77,56 +79,6 @@

        column: [
          {
            label: "保安公司",
            prop: "deptName",
            minWidth: 110,
            overHidden: true,
            // labelWidth: 120,
            // searchLabelWidth: 120,
            // searchSpan: 4,
            // dicUrl:
            //   "/api/blade-system/dept/security_lazy-tree?parentId=1413470343230877697",
            // props: {
            //   label: "title",
            //   value: "id",
            // },
            // search: true,
            // overHidden: true,
            // type: "select",
            // rules: [
            //   {
            //     required: true,
            //     message: "请输入保安公司",
            //     trigger: "blur",
            //   },
            // ],
          },
          // {
          //   label: "deptId",
          //   prop: "deptId",
          //   overHidden: true,
          //   // labelWidth: 120,
          //   // searchLabelWidth: 120,
          //   searchSpan: 4,
          //   dicUrl:
          //     "/api/blade-system/dept/security_lazy-tree?parentId=1413470343230877697",
          //   props: {
          //     label: "title",
          //     value: "id",
          //   },
          //   // hide: true,
          //   search: true,
          //   // overHidden: true,
          //   type: "select",
          //   // rules: [
          //   //   {
          //   //     required: true,
          //   //     message: "请输入保安公司",
          //   //     trigger: "blur",
          //   //   },
          //   // ],
          // },
          {
            label: "保安姓名",
            prop: "realName",
            search: true,
@@ -134,6 +86,12 @@
            //     hide: true,
            //     editDisplay: false,
            //     addDisplay: false
          },
          {
            label: "保安公司",
            prop: "deptName",
            minWidth: 110,
            overHidden: true,
          },

          {
@@ -219,6 +177,7 @@
            label: "审查状态",
            prop: "examinationType",
            // overHidden: true,
            sortable: true,
            // type: "date",
            // format: "yyyy-MM-dd",
            // valueFormat: "yyyy-MM-dd",
@@ -236,6 +195,7 @@
          {
            label: "审查明细",
            prop: "examinationMx",
            sortable: true,
            // labelWidth: 120,
            // display: false,
          },
@@ -405,8 +365,17 @@
      var d = new Date();
      return d.getFullYear();
    },
    sortChange(val) {
      // console.log(val);
      this.sort = {
        sort: val.order == "descending" ? "asc" : "desc",
        useName: val.prop,
      };
      this.onLoad(this.page, this.sort);
    },
    onLoad(page, params = {}) {
      // this.loading = false;
      params = Object.assign(params, this.sort);
      this.loading = true;
      params["status"] = 1;
      getListSecurity(
@@ -422,6 +391,7 @@
            d[k]["examinationMx"] = "正常";
            d[k]["examinationType"] = "正常";
          } else {
            console.log(d[k]);
            d[k]["examinationType"] = "异常";
          }
          // if (d[k]["examinationType"] == "") {

 src/views/qualificationExamination/registrationTrainingQuery.vue

@@ -286,9 +286,32 @@
            // search: true,
            // searchSpan: 4,
          },
          // {
          //   label: "保安公司",
          //   prop: "deptId",
          //   // width: 70,
          //   // search: true,
          //   // searchSpan: 4,
          //   dicUrl:
          //     "/api/blade-system/dept/security_lazy-tree?parentId=1413470343230877697",
          //   props: {
          //     label: "title",
          //     value: "id",
          //   },
          //   // search: true,
          //   // type: "tree",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请输入组织机构",
          //       trigger: "blur",
          //     },
          //   ],
          //   overHidden: true,
          // },
          {
            label: "保安公司",
            prop: "deptId",
            prop: "deptName",
            // width: 70,
            // search: true,
            // searchSpan: 4,

 src/views/qualificationExamination/signQualificationExamination.vue

@@ -70,7 +70,7 @@
        column: [
          {
            label: "保安姓名",
            prop: "name",
            prop: "realName",
          },
          {
            label: "保安公司",

 src/views/record/record.vue

@@ -47,6 +47,7 @@
          @click.stop="rowDel(row)"
          v-show="row.type == 2"
          >审批
          <!--  v-show="row.type == 2" -->
        </el-button>
        <el-button
          icon="el-icon-edit"
@@ -105,15 +106,25 @@
      width="30%"
      :modal-append-to-body="false"
    >
      <span>是否通过审核？</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closecc">通过</el-button>
        <el-button type="primary" @click="subcc">不通过</el-button>
      </span>
      <div class="flots">
        <span class="f_title">是否通过审核？</span>
        <span class="f_body">请输入修改意见：</span>
        <textarea
          name="reworkmes"
          cols="40"
          rows="4"
          style="overflow: hidden"
          v-model="textareaShenpi"
        ></textarea>
        <div class="but">
          <el-button @click="closecc">通过</el-button>
          <el-button type="primary" @click="subcc">不通过</el-button>
        </div>
      </div>
    </el-dialog>
  </basic-container>
</template>
 

<script>
import { getList, getDetail, add, update, remove } from "@/api/record/record";
import { mapGetters } from "vuex";
@@ -123,6 +134,8 @@
    return {
      dialogVisiblecc: false, //许可证审核抽屉
      xukezData: {},

      textareaShenpi: "",

      dialogVisible: false, // 备案审批打印的
      form: {},
@@ -187,7 +200,43 @@
            ],
          },
          {
            label: "法定代表人电话",
            width: 150,
            prop: "representativecell",
            rules: [
              {
                required: true,
                message: "请输入法定代表人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人",
            prop: "contacts",
            rules: [
              {
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人电话",
            width: 150,
            prop: "contactscell",
            rules: [
              {
                required: true,
                message: "请输入联系人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册时间",
            hide: true,
            prop: "establishtime",
            type: "date",
            format: "yyyy-MM-dd",
@@ -491,11 +540,13 @@
    closecc() {
      this.xukezData.type = "0";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      return update(this.xukezData);
    },
    subcc() {
      this.xukezData.type = "1";
      this.dialogVisiblecc = false;
      this.xukezData["approve"] = this.textareaShenpi;
      return update(this.xukezData);
    },
    // 审批打印
@@ -622,8 +673,8 @@
  },
};
</script>
 
<style scoped>

<style scoped lang="scss">
.dtype {
  width: 80px;
}
@@ -715,4 +766,22 @@
.exam-box span {
  text-decoration: underline;
}
</style>

.flots {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  .f_title {
    position: absolute;
    top: 15px;
    font-size: 18px;
  }
}
.but {
  margin-top: 20px;
  width: 100%;
  display: flex;
  align-content: center;
  justify-content: center;
}
</style>

 src/views/recordk/recordk.vue

@@ -131,7 +131,43 @@
            ],
          },
          {
            label: "法定代表人电话",
            width: 150,
            prop: "representativecell",
            rules: [
              {
                required: true,
                message: "请输入法定代表人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人",
            prop: "contacts",
            rules: [
              {
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人电话",
            width: 150,
            prop: "contactscell",
            rules: [
              {
                required: true,
                message: "请输入联系人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册时间",
            hide: true,
            prop: "establishtime",
            overHidden: true,
            type: "date",

 src/views/resource/attachOnce.vue

New file
@@ -0,0 +1,418 @@
<template>
  <basic-container>
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      :page.sync="page"
      :permission="permissionList"
      :before-open="beforeOpen"
      v-model="form"
      ref="crud"
      @row-del="rowDel"
      @search-change="searchChange"
      @search-reset="searchReset"
      @selection-change="selectionChange"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
    >
      <template slot="menuLeft">
        <!--        <el-button type="primary"-->
        <!--                   size="small"-->
        <!--                   plain-->
        <!--                   icon="el-icon-upload2"-->
        <!--                   @click="handleUpload">上 传-->
        <!--        </el-button>-->
        <!--        <el-button type="danger"-->
        <!--                   size="small"-->
        <!--                   icon="el-icon-delete"-->
        <!--                   plain-->
        <!--                   @click="handleDelete">删 除-->
        <!--        </el-button>-->
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button
          type="text"
          icon="el-icon-download"
          size="small"
          @click="handleDownload(scope.row)"
          >下载
        </el-button>
        <el-button
          type="text"
          icon="el-icon-picture-outline-round"
          size="small"
          v-show="!fileFormat(scope.row)"
          @click="seeImages(scope.row)"
          >预览
        </el-button>
      </template>
      <template slot-scope="{ row }" slot="attachSize">
        <el-tag>{{ `${row.attachSize} KB` }}</el-tag>
      </template>
    </avue-crud>
    <el-dialog
      title="附件管理"
      append-to-body
      :visible.sync="attachBox"
      width="555px"
    >
      <avue-form
        ref="form"
        :option="attachOption"
        v-model="attachForm"
        :upload-after="uploadAfter"
      >
      </avue-form>
    </el-dialog>

    <el-dialog
      title="预览"
      append-to-body
      :visible.sync="imgSee"
      class="see-img-box"
    >
      <div class="img" :style="{ background: imgUrl }"></div>
    </el-dialog>
  </basic-container>
</template>

<script>
import { getList, getDetail, remove } from "@/api/resource/attachOnce";
import { mapGetters } from "vuex";
import ElImageViewer from "element-ui/packages/image/src/image-viewer";

export default {
  components: { ElImageViewer },
  data() {
    return {
      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      attachBox: false,
      selectionList: [],
      option: {
        height: "auto",
        calcHeight: 30,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        searchShowBtn: false,
        headerAlign: "center",
        border: true,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "附件地址",
            prop: "link",
            rules: [
              {
                required: true,
                message: "请输入附件地址",
                trigger: "blur",
              },
            ],
          },
          {
            label: "附件域名",
            prop: "domain",
            search: true,
            rules: [
              {
                required: true,
                message: "请输入附件域名",
                trigger: "blur",
              },
            ],
          },
          {
            label: "附件名称",
            prop: "name",
            search: true,
            rules: [
              {
                required: true,
                message: "请输入附件名称",
                trigger: "blur",
              },
            ],
          },
          {
            label: "附件原名",
            prop: "originalName",
            search: true,
            rules: [
              {
                required: true,
                message: "请输入附件原名",
                trigger: "blur",
              },
            ],
          },
          {
            label: "附件拓展名",
            prop: "extension",
            rules: [
              {
                required: true,
                message: "请输入附件拓展名",
                trigger: "blur",
              },
            ],
          },
          {
            label: "附件大小",
            prop: "attachSize",
            slot: true,
            rules: [
              {
                required: true,
                message: "请输入附件大小",
                trigger: "blur",
              },
            ],
          },
          {
            label: "所属机构",
            prop: "deptid",
            type: "select",
            dicUrl: "/api/blade-system/dept/selectIn",
            props: {
              label: "deptname",
              value: "deptid",
            },
          },
          {
            label: "类型",
            prop: "type",
            addDisplay: false,
            width: 80,
            type: "select",
            dicData: [
              {
                label: "许可审批",
                value: "0",
              },
              {
                label: "备案",
                value: "1",
              },
              {
                label: "撤销",
                value: "2",
              },
              {
                label: "跨区备案",
                value: "3",
              },
            ],
          },
        ],
      },
      data: [],
      attachForm: {},
      attachOption: {
        submitBtn: false,
        emptyBtn: false,
        column: [
          {
            label: "附件上传",
            prop: "attachFile",
            type: "upload",
            drag: true,
            loadText: "模板上传中，请稍等",
            span: 24,
            propsHttp: {
              res: "data",
            },
            action: "/api/blade-resource/oss/endpoint/put-file-attach?deptid=",
          },
        ],
      },

      imgSee: false,
      imgUrl: "",
    };
  },
  created() {
    var flag = false,
      i = 0,
      ind = null;
    this.$store.state.tags.tagList.forEach((item, index) => {
      if (item.label == "附件上传") {
        if (flag == false) {
          ind = index;
          flag = true;
        }
        i++;
      }
    });
    if (i > 1) {
      this.$store.state.tags.tagList.splice(ind, 1);
    }
    var deptid = this.$route.query.deptid;
    var type = this.$route.query.type;
    this.attachOption.column[0].action += deptid + "&type=" + type;
  },
  computed: {
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        addBtn: false,
        editBtn: false,
        viewBtn: false,
        delBtn: this.vaildData(this.permission.attach_delete, false),
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  methods: {
    handleUpload() {
      this.attachBox = true;
    },
    uploadAfter(res, done, loading, column) {
      window.console.log(column);
      this.attachBox = false;
      this.refreshChange();
      done();
    },
    handleDownload(row) {
      window.open(`${row.link}`);
    },
    rowDel(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(row.id);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
        });
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then((res) => {
          this.form = res.data.data;
        });
      }
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query),
        this.$route.query.deptid,
        this.$route.query.type
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },

    seeImages(row) {
      this.imgUrl = "";
      this.imgUrl = "url(" + row.link + ") center center / contain no-repeat";

      this.imgSee = true;
    },

    fileFormat(row) {
      var index = row.link.lastIndexOf(".");
      var ext = row.link.substr(index + 1);

      return (
        [
          "png",
          "jpg",
          "jpeg",
          "bmp",
          "gif",
          "webp",
          "psd",
          "svg",
          "tiff",
        ].indexOf(ext.toLowerCase()) == -1
      );
    },
  },
};
</script>

<style>
</style>

 src/views/revoke/revoke.vue

@@ -131,7 +131,43 @@
            ],
          },
          {
            label: "法定代表人电话",
            width: 150,
            prop: "representativecell",
            rules: [
              {
                required: true,
                message: "请输入法定代表人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人",
            prop: "contacts",
            rules: [
              {
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系人电话",
            width: 150,
            prop: "contactscell",
            rules: [
              {
                required: true,
                message: "请输入联系人电话",
                trigger: "blur",
              },
            ],
          },
          {
            label: "注册时间",
            hide: true,
            prop: "establishtime",
            type: "date",
            format: "yyyy-MM-dd",

 src/views/securityCompany/armed.vue

@@ -1,9 +1,9 @@
/*
 * @Author: Morpheus
 * @Date: 2021-07-07 17:30:05
 * @Last Modified by: Morpheus
 * @Last Modified time: 2021-07-10 16:05:44
 * menu-name 武装守押公司查询
 * @Last Modified by: liu
 * @Last Modified time: 2021-08-30 15:14:22
 * menu-name 保安服务公司查询
 */
<template>
  <basic-container>
@@ -25,10 +25,67 @@
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @row-click="handleRowClick"
      @on-load="onLoad"
    >
      <!-- @row-click="handleRowClick" -->
      <template slot-scope="{ row }" slot="znum">
        <el-tag
          class="rowClickSelf"
          @click="rowClickSelf(row)"
          title="点击查看保安人员情况"
          >{{ row.znum }}</el-tag
        >
      </template>
      <template slot-scope="{ type, size, row }" slot="menu">
        <el-button
          icon="el-icon-s-custom"
          :size="size"
          :type="type"
          @click.stop="handleRowClick(row)"
          >查看
        </el-button>
        <el-button
          :size="size"
          :type="type"
          icon="el-icon-warning"
          class="zhengJian-icon"
          @click.stop="punish(row)"
          >处罚</el-button
        >
      </template>
    </avue-crud>
    <el-dialog
      title="处罚"
      :visible.sync="dialogVisible"
      width="60%"
      :before-close="handleClose"
      :modal-append-to-body="false"
      center
    >
      <!-- <span>这是一段信息</span> -->
      <avue-form
        :option="optionf"
        v-model="objf"
        @submit="submitf"
        @error="errorf"
      >
        <template slot-scope="{ type, size, row }" slot="menuForm">
          <el-button
            :size="size"
            icon="el-icon-error"
            :type="type"
            @click="close(row)"
            >关闭</el-button
          >
        </template>
      </avue-form>
      <!-- <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible = false"
          >确 定</el-button
        >
      </span> -->
    </el-dialog>
  </basic-container>
</template>

@@ -39,12 +96,77 @@
  add,
  update,
  remove,
} from "@/api/securityCompany/armed";
  savePunish,
} from "@/api/securityCompany/security";
import { mapGetters } from "vuex";
import { companyColimn } from "./column";

export default {
  data() {
    return {
      objf: {},
      optionf: {
        column: [
          {
            label: "公司名称",
            prop: "enterprisename",
            span: 24,
            labelWidth: 110,
            rules: [
              {
                required: true,
                message: "请输入身份证号码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "处罚原因",
            prop: "punishreason",
            span: 24,
            labelWidth: 110,
            rules: [
              {
                required: true,
                message: "请输入荣誉名称",
                trigger: "blur",
              },
            ],
          },
          {
            label: "处罚结果",
            prop: "punishresult",
            span: 24,
            // type: "textarea",
            labelWidth: 110,
          },
          {
            label: "处罚日期",
            prop: "punishtime",
            span: 24,
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            // type: "textarea",
            labelWidth: 110,
          },
          {
            label: "处罚批准文号",
            prop: "punisnum",
            span: 24,
            // type: "textarea",
            labelWidth: 110,
          },
          //   {
          //     label: "授予单位名称",
          //     prop: "sex2",
          //     span: 24,
          //     labelWidth: 110,
          //   },
        ],
      },
      dialogVisible: false,

      form: {},
      query: {},
      loading: true,
@@ -60,73 +182,21 @@
        editBtn: false,
        addBtn: false,
        selection: true,
        menu: false,
        selection: true,

        searchShowBtn: false,
        // menu: false,
        border: true,
        align: "center",
        height: "auto",
        calcHeight: 30,
        tip: false,
        searchShowBtn: false,
        searchShow: true,
        menuWidth: 160,
        searchMenuSpan: 6,
        index: true,
        viewBtn: true,
        dialogClickModal: false,

        column: [
          {
            label: "公司名称",
            prop: "enterprisename",
            search: true,
            searchSpan: 4,
            display: false,
          },
          {
            label: "法定代表人",
            prop: "representative",
            display: false,
            width: 120,
          },
          {
            label: "注册时间",
            prop: "establishtime",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            mock: {
              type: "datetime",
              format: "yyyy-MM-dd",
            },
            search: true,
            searchSpan: 4,
            display: false,
            width: 180,
          },
          {
            label: "注册资金",
            prop: "registeredcapital",
            display: false,
            width: 130,
          },
          {
            label: "实缴资金",
            prop: "capital",
            display: false,
            width: 130,
          },
          {
            label: "公司类型",
            prop: "enterprises",
            display: false,
          },
          {
            label: "注册地址",
            prop: "address",
            display: false,
            width: 280,
          },
        ],
        column: companyColimn,
        group: [
          {
            label: "详细信息",
@@ -176,6 +246,67 @@
    },
  },
  methods: {
    rowClickSelf(val) {
      console.log(val.departmentid);
      this.$router.push({
        path: "/securityGuardManagement/registerOnce",
        query: { departmentid: val.departmentid },
      });
    },
    close(row) {
      this.dialogVisible = false;
      this.objf = {
        enterprisename: "",
        punishreason: "",
        punishresult: "",
        punishtime: "",
        punisnum: "",
      };
    },
    submitf(form, done) {
      console.log(form);
      var that = this;
      savePunish(form).then((res) => {
        this.$message({
          type: "success",
          message: "操作成功!",
        });
        that.objf = {
          enterprisename: "",
          punishreason: "",
          punishresult: "",
          punishtime: "",
          punisnum: "",
        };
      });
      // this.$message.success(JSON.stringify(form));
      done();
      this.dialogVisible = false;
      this.objf = {};
    },
    errorf(err) {
      this.$message.success("请查看控制台");
      console.log(err);
    },
    handleClose(done) {
      this.objf = {
        enterprisename: "",
        punishreason: "",
        punishresult: "",
        punishtime: "",
        punisnum: "",
      };
      done();
    },
    punish(row) {
      //打开处罚
      // console.log(row);
      this.objf = {
        deptid: row.departmentid,
        enterprisename: row.enterprisename,
      };
      this.dialogVisible = true;
    },
    rowSave(row, done, loading) {
      add(row).then(
        () => {
@@ -265,11 +396,12 @@
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query),
        3
        7
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        console.log(this.data);
        this.loading = false;
        this.selectionClear();
      });
@@ -279,7 +411,8 @@
    handleRowClick(row) {
      // delete (row["name"]);
      var obj = row;
      obj["name"] = "保安公司详细资料";
      obj["name"] = "保安公司详细信息";
      console.log(obj, "obj");
      this.$router.push({
        path: `/securityCompany/index`,
        query: obj,
@@ -289,5 +422,5 @@
};
</script>

<style>
<style lang="scss">
</style>

 src/views/securityCompany/column.js

@@ -1,79 +1,164 @@
export var companyColimn = [
    {
        label: "公司名称",
        label: "统一社会信用代码",
        prop: "creditcode",
        width: 140,
        hide: true,

        labelWidth: 160,
        // hide: true,
        // editDisplay: false,
        // addDisplay: false
    },

    {
        label: "企业名称",
        prop: "enterprisename",
        search: true,
        width: 260,
        searchSpan: 4,
        // width: 300,
        minWidth: 120,
        overHidden: true,
        display: false,
        labelWidth: 160,
        // width: 130,
        overHidden: true
    },

    {
        label: "企业类型",
        prop: "stats",
        type: "tree",
        hide: true,
        labelWidth: 160,
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=stats",
        props: {
            label: "dictValue",
            value: "dictKey"
        },
        width: 130,
        rules: [
            {
                required: true,
                message: "请选择企业类型",
                trigger: "click",
            },
        ],
    },
    {
        label: "法定代表人",
        labelWidth: 160,
        prop: "representative",
        display: false,
        width: 86,
        width: 110,
        search: true,
        searchSpan: 4,
        searchLabelWidth: 100
    },
    {
        label: "法人电话",
        label: "法定代表人电话",
        labelWidth: 160,
        prop: "representativecell",
        display: false,
        width: 95,
        width: 120,
        // search: true,
        searchSpan: 4,
        searchLabelWidth: 100
    },

    {
        label: "保安人数",
        labelWidth: 160,
        prop: "znum",
        width: 73,
        // search: true,
        searchSpan: 4,
        searchLabelWidth: 100
    },
    {
        label: "派遣人数",
        labelWidth: 160,
        prop: "pnum",
        width: 73,
        // search: true,
        searchSpan: 4,
        searchLabelWidth: 100
    },
    {
        label: "持证人数",
        labelWidth: 160,
        prop: "cnum",
        width: 73,
        // search: true,
        searchSpan: 4,
        searchLabelWidth: 100
    },
    {
        label: "注册时间",
        prop: "establishtime",
        labelWidth: 160,
        width: 130,
        overHidden: true,
        type: "date",
        format: "yyyy-MM-dd",
        valueFormat: "yyyy-MM-dd",
        mock: {
            type: "datetime",
            format: "yyyy-MM-dd",
        },
        search: true,
        searchSpan: 4,
        display: false,
        width: 140,
        valueFormat: "timestamp",

    },
    {
        label: "注册资金",
        label: "注册资本",
        prop: "registeredcapital",
        display: false,
        width: 110,
        hide: true,
        labelWidth: 160,
        // search: true,
        width: 80,
    },
    // {
    //     label: "实缴资金",
    //     prop: "capital",
    //     display: false,
    //     width: 110,
    // },
    // {
    //   label: "公司类型",
    //   prop: "enterprises",
    //   display: false,
    //   width: 220,
    //   overHidden: true,
    // },

    {
        label: "联系人",
        prop: "contacts",
        display: false,
        overHidden: true,
        width: 95,
    },
    {
        labelWidth: 160,
        width: 85,
    }, {
        label: "联系电话",
        prop: "contactscell",
        display: false,
        overHidden: true,
        labelWidth: 160,
        width: 95,
    },

    {
        label: "注册地址",
        prop: "address",
        display: false,
        labelWidth: 160,
        // search: true,
        hide: true,
    },
    {
        label: "经营范围",
        prop: "business",
        // search: true,
        labelWidth: 160,
        hide: true,
        // width: 110,
        overHidden: true
    },
    {
        label: "所属辖区",
        prop: "region",
        labelWidth: 160,
        // width: 110,
        // search: true,
        overHidden: true
    },
    {
        label: "登记机关",
        prop: "registration",
        // search: true,
        labelWidth: 160,
        // width: 88,
        overHidden: true,
    }
        hide: true,
    },

    {
        label: "所属行业",
        prop: "industry",
        labelWidth: 160,
        hide: true,
        // search: true,
        // width: 88,
    },
]

 src/views/securityCompany/companyDetails.vue

@@ -1,8 +1,8 @@
/*
 * @Author: Morpheus
 * @Date: 2021-07-05 16:31:54
 * @Last Modified by: Morpheus
 * @Last Modified time: 2021-07-10 15:33:24
 * @Last Modified by: liu
 * @Last Modified time: 2021-08-31 14:52:13
 * menu-name 保安公司详细资料
 */
<template>
@@ -209,8 +209,37 @@
            <el-tab-pane label="服务对象" name="seventh">
              <service :form="form"></service>
            </el-tab-pane>
            <el-tab-pane label="其他附件" name="eighth">
            <!-- <el-tab-pane label="其他附件" name="eighth">
              <enclosure :form="form"></enclosure>
            </el-tab-pane> -->
            <el-tab-pane label="营业执照" name="eighth">
              <div class="businessLicenses">
                <el-container>
                  <el-main>
                    <div class="title" v-if="businessLicenseUrl == ''">
                      未上传营业执照
                    </div>
                    <img
                      class="businessLicensess"
                      :src="businessLicenseUrl"
                      alt=""
                      v-else
                    />
                  </el-main>
                </el-container>
              </div>
            </el-tab-pane>
            <el-tab-pane label="许可证" name="ninth">
              <div class="businessLicenses">
                <el-container>
                  <el-main>
                    <div class="title" v-if="licenceUrl == ''">
                      未上传许可证
                    </div>
                    <img class="Licenses" :src="licenceUrl" alt="" v-else />
                  </el-main>
                </el-container>
              </div>
            </el-tab-pane>
          </el-tabs>
        </div>
@@ -233,17 +262,23 @@
import staff from "./computents/staff.vue"; //保安员信息
import punish from "./computents/punish.vue"; //处罚信息
import service from "./computents/service.vue"; //服务对象
import enclosure from "./computents/enclosure.vue"; //其他附件
// import enclosure from "./computents/enclosure.vue"; //其他附件

import { getList } from "@/api/securityCompany/security"; //保安公司

export default {
  components: {
    equipment: equipment,
    staff: staff,
    punish: punish,
    service: service,
    enclosure: enclosure,
    // enclosure: enclosure,
  },
  data() {
    return {
      businessLicenseUrl: "",
      licenceUrl: "",

      activeName: "first",
      form: {},
      manifestationData: [],
@@ -394,10 +429,11 @@
  created() {
    var flag = false,
      i = 0,
      ind = null;
      ind = null,
      that = this;

    this.$store.state.tags.tagList.forEach((item, index) => {
      if (item.label == "保安详细资料") {
      if (item.label == "保安公司详细信息") {
        if (flag == false) {
          ind = index;
          flag = true;
@@ -408,10 +444,26 @@
    if (i > 1) {
      this.$store.state.tags.tagList.splice(ind, 1);
    }

    this.form = this.$route.query;

    console.log(this.form, 1);
    if (this.$route.query.fromSecunityGuardId) {
      console.log(this.$route.query.fromSecunityGuardId, "fromSecunityGuardId");
      // getList().then(res=>{
      //   console.log
      var page = {
          currentPage: 1,
          pageSize: 10,
        },
        params = { departmentid: this.$route.query.fromSecunityGuardId };
      getList(page.currentPage, page.pageSize, params).then((res) => {
        console.log(res.data.data.records[0]);
        that.form = res.data.data.records[0];
        this.businessLicenseUrl = res.data.data.records[0].businessLicense;
        this.licenceUrl = res.data.data.records[0].licence;
      });
      // })
    } else {
      this.form = this.$route.query;
      console.log(this.form, "obj1");
    }
  },
  mounted() {
    // this.$store.state.tags.tag.label = '保安详细资料'
@@ -566,4 +618,26 @@
</script>

<style lang="scss" scoped>
.businessLicenses {
  padding-top: 15px;
  background-color: transparent;
}
.el-main {
  background-color: transparent;
  color: #333;
  text-align: center;
  // position: relative;
  // right: 5%;
}
.businessLicensess {
  height: 680px;
  width: 450px;
}
.Licenses {
  height: 680px;
  width: 1048px;
}
.title {
  color: #fff;
}
</style>

 src/views/securityCompany/computents/enclosure.vue

@@ -17,8 +17,8 @@
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
    >
      <!-- @on-load="onLoad" -->
      <template slot="menuLeft">
        <!--        <el-button type="primary"-->
        <!--                   size="small"-->
@@ -281,6 +281,10 @@
      return ids.join(",");
    },
  },
  mounted() {
    console.log(this.form, "getListeenclosure");
    this.onLoad(this.page);
  },
  methods: {
    rowClick(row) {
      var that = this;
@@ -385,7 +389,7 @@
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        console.log(this.data, getListeenclosure);
        console.log(this.data, "getListeenclosure");
        this.loading = false;
        this.selectionClear();
      });

 src/views/securityCompany/computents/equipment.vue

@@ -7,7 +7,6 @@
    :data="equipmentData"
    ref="equipmentCrud"
    :page.sync="equipmentPage"
    @on-load="equipmentOnLoad"
    @selection-change="equipmentSelectionChange"
    @search-change="equipmentSearchChange"
    @search-reset="equipmentSearchReset"
@@ -15,6 +14,7 @@
    @size-change="equipmentSizeChange"
  >
  </avue-crud>
  <!-- @on-load="equipmentOnLoad" -->
</template>

<script>
@@ -31,7 +31,7 @@
        addBtn: false,
        selection: true,
        menu: false,

        border: true,
        align: "center",
        height: "auto",
        calcHeight: 270,
@@ -232,6 +232,10 @@
      equipmentSelectionList: [],
    };
  },
  mounted() {
    console.log(this.form, "equipmentData");
    this.equipmentOnLoad(this.equipmentPage);
  },
  methods: {
    equipmentOnLoad(page, params = {}) {
      this.equipmentLoading = true;

 src/views/securityCompany/computents/punish.vue

@@ -7,7 +7,6 @@
    :data="punishData"
    ref="punishCrud"
    :page.sync="punishPage"
    @on-load="punishOnLoad"
    @selection-change="punishSelectionChange"
    @search-change="punishSearchChange"
    @search-reset="punishSearchReset"
@@ -15,6 +14,7 @@
    @size-change="punishSizeChange"
  >
  </avue-crud>
  <!-- @on-load="punishOnLoad" -->
</template>

<script>
@@ -30,6 +30,7 @@
        searchShowBtn: false,
        addBtn: false,
        selection: true,
        border: true,
        menu: false,

        align: "center",
@@ -49,8 +50,8 @@
          {
            label: "处罚原因",
            prop: "punishreason",
            span: 24,
            labelWidth: 110,
            // width: 160,
            rules: [
              {
                required: true,
@@ -62,26 +63,29 @@
          {
            label: "处罚结果",
            prop: "punishresult",
            span: 24,
            // type: "textarea",
            // width: 160,
            labelWidth: 110,
          },
          {
            label: "处罚日期",
            prop: "punishtime",
            span: 24,
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            // type: "textarea",
            labelWidth: 110,
            width: 160,
          },
          {
            label: "处罚批准文号",
            label: "批准文号",
            prop: "punisnum",
            span: 24,
            // type: "textarea",
            // type: "date",
            // format: "yyyy-MM-dd",
            // valueFormat: "yyyy-MM-dd",
            // // type: "textarea",
            labelWidth: 110,
            // width: 160,
          },
        ],
      },
@@ -97,6 +101,10 @@
      punishSelectionList: [],
    };
  },
  mounted() {
    console.log(this.form, "pu");
    this.punishOnLoad(this.punishPage);
  },
  methods: {
    punishOnLoad(page, params = {}) {
      this.punishLoading = true;
@@ -111,7 +119,7 @@

        this.punishPage.total = data.total;
        this.punishData = data.records;
        console.log(this.punishData);
        console.log(this.punishData, "pu");
        this.punishLoading = false;
        this.$refs.punishCrud.refreshTable();
        this.$refs.punishCrud.doLayout();

 src/views/securityCompany/computents/service.vue

@@ -7,7 +7,6 @@
    :data="serviceData"
    ref="serviceCrud"
    :page.sync="servicePage"
    @on-load="serviceOnLoad"
    @selection-change="serviceSelectionChange"
    @search-change="serviceSearchChange"
    @search-reset="serviceSearchReset"
@@ -15,6 +14,7 @@
    @size-change="serviceSizeChange"
  >
  </avue-crud>
  <!-- @on-load="serviceOnLoad" -->
</template>

<script>
@@ -31,7 +31,7 @@
        addBtn: false,
        selection: true,
        menu: false,

        border: true,
        align: "center",
        height: "auto",
        calcHeight: 270,
@@ -46,13 +46,6 @@
        menuWidth: 156,

        column: [
          // {
          //   label: "id",
          //   prop: "id",
          //   hide: true,
          //   editDisplay: false,
          //   addDisplay: false,
          // },
          {
            label: "姓名",
            prop: "name",
@@ -66,55 +59,11 @@
              },
            ],
          },
          // {
          //   label: "身份证号",
          //   prop: "cardid",
          //   // rules: [
          //   //   {
          //   //     required: true,
          //   //     message: "请输入编号",
          //   //     trigger: "blur",
          //   //   },
          //   // ],
          //   // search: true,
          // }, //上面不显示
          {
            label: "派遣单位",
            prop: "dispatcherCompany",
            search: true,
            // rules: [
            //   {
            //     required: true,
            //     message: "请输入规格",
            //     trigger: "blur",
            //   },
            // ],
            // search: true,
          },
          // {
          //   label: "保安公司",
          //   prop: "deptName",
          //   // rules: [
          //   //   {
          //   //     required: true,
          //   //     message: "请输入规格",
          //   //     trigger: "blur",
          //   //   },
          //   // ],
          //   // search: true,
          // },
          // {
          //   label: "派遣人",
          //   prop: "dispatcher",
          //   // rules: [
          //   //   {
          //   //     required: true,
          //   //     message: "请输入规格",
          //   //     trigger: "blur",
          //   //   },
          //   // ],
          //   // search: true,
          // },
          {
            label: "派遣时间",
            prop: "dispatchertime",
@@ -212,6 +161,10 @@
      serviceSelectionList: [],
    };
  },
  mounted() {
    console.log(this.form, "serviceData");
    this.serviceOnLoad(this.servicePage);
  },
  methods: {
    serviceOnLoad(page, params = {}) {
      this.serviceLoading = true;

 src/views/securityCompany/computents/staff.vue

@@ -7,13 +7,13 @@
    :data="staffData"
    ref="staffCrud"
    :page.sync="staffPage"
    @on-load="staffOnLoad"
    @selection-change="staffSelectionChange"
    @search-change="staffSearchChange"
    @search-reset="staffSearchReset"
    @current-change="staffCurrentChange"
    @size-change="staffSizeChange"
  >
    <!-- @on-load="staffOnLoad" -->
  </avue-crud>
</template>

@@ -31,7 +31,7 @@
        searchShowBtn: false,
        selection: true,
        menu: false,

        border: true,
        align: "center",
        height: "auto",
        calcHeight: 270,
@@ -253,6 +253,10 @@
      staffSelectionList: [],
    };
  },
  mounted() {
    console.log(this.form, "staff");
    this.staffOnLoad(this.staffPage);
  },
  methods: {
    staffOnLoad(page, params = {}) {
      this.staffLoading = true;

 src/views/securityCompany/computents/xkz.png

 src/views/securityCompany/computents/yyzz.png

 src/views/securityCompany/confess.vue

@@ -2,8 +2,8 @@
 * @Author: Morpheus
 * @Date: 2021-07-07 17:30:05
 * @Last Modified by: Morpheus
 * @Last Modified time: 2021-07-10 16:07:26
 * menu-name 自招保安单位查询
 * @Last Modified time: 2021-07-10 16:01:42
 * menu-name 保安服务公司查询
 */
<template>
  <basic-container>
@@ -25,13 +25,29 @@
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @row-click="handleRowClick"
      @on-load="onLoad"
    >
      <!-- @row-click="handleRowClick" -->
      <template slot-scope="{ row }" slot="znum">
        <el-tag
          class="rowClickSelf"
          @click="rowClickSelf(row)"
          title="点击查看保安人员情况"
          >{{ row.znum }}</el-tag
        >
      </template>
      <template slot-scope="{ type, size, row }" slot="menu">
        <el-button
          icon="el-icon-s-custom"
          :size="size"
          :type="type"
          @click.stop="handleRowClick(row)"
          >查看
        </el-button>
        <el-button
          :size="size"
          :type="type"
          icon="el-icon-warning"
          class="zhengJian-icon"
          @click.stop="punish(row)"
          >处罚</el-button
@@ -80,8 +96,8 @@
  add,
  update,
  remove,
} from "@/api/securityCompany/confess";
import { savePunish } from "@/api/securityCompany/security";
  savePunish,
} from "@/api/securityCompany/security";
import { mapGetters } from "vuex";
import { companyColimn } from "./column";

@@ -165,101 +181,22 @@
        delBtn: false,
        editBtn: false,
        addBtn: false,
        menuWidth: 100,
        selection: true,
        searchShowBtn: false,
        // menu: false,

        border: true,
        align: "center",
        height: "auto",
        calcHeight: 30,
        tip: false,
        searchShow: true,
        menuWidth: 160,
        searchMenuSpan: 6,
        index: true,
        searchShowBtn: false,
        viewBtn: true,
        dialogClickModal: false,

        column: companyColimn,
        // [
        //   {
        //     label: "公司名称",
        //     prop: "enterprisename",
        //     search: true,
        //     searchSpan: 4,
        //     // width: 300,
        //     minWidth: 120,
        //     overHidden: true,
        //     display: false,
        //   },
        //   {
        //     label: "法定代表人",
        //     prop: "representative",
        //     display: false,
        //     width: 86,
        //   },
        //   {
        //     label: "法人电话",
        //     prop: "representativecell",
        //     display: false,
        //     width: 95,
        //   },
        //   {
        //     label: "注册时间",
        //     prop: "establishtime",
        //     type: "date",
        //     format: "yyyy-MM-dd",
        //     valueFormat: "yyyy-MM-dd",
        //     mock: {
        //       type: "datetime",
        //       format: "yyyy-MM-dd",
        //     },
        //     search: true,
        //     searchSpan: 4,
        //     display: false,
        //     width: 140,
        //   },
        //   {
        //     label: "注册资金",
        //     prop: "registeredcapital",
        //     display: false,
        //     width: 110,
        //   },
        //   {
        //     label: "实缴资金",
        //     prop: "capital",
        //     display: false,
        //     width: 110,
        //   },
        //   // {
        //   //   label: "公司类型",
        //   //   prop: "enterprises",
        //   //   display: false,
        //   //   width: 220,
        //   //   overHidden: true,
        //   // },

        //   {
        //     label: "联系人",
        //     prop: "contacts",
        //     display: false,
        //     overHidden: true,
        //     width: 95,
        //   },
        //   {
        //     label: "联系电话",
        //     prop: "contactscell",
        //     display: false,
        //     overHidden: true,
        //     width: 95,
        //   },
        //   {
        //     label: "注册地址",
        //     prop: "address",
        //     display: false,
        //     overHidden: true,
        //   },
        // ],
        group: [
          {
            label: "详细信息",
@@ -309,14 +246,12 @@
    },
  },
  methods: {
    punish(row) {
      //打开处罚
      // console.log(row);
      this.objf = {
        deptid: row.departmentid,
        enterprisename: row.enterprisename,
      };
      this.dialogVisible = true;
    rowClickSelf(val) {
      console.log(val.departmentid);
      this.$router.push({
        path: "/securityGuardManagement/registerOnce",
        query: { departmentid: val.departmentid },
      });
    },
    close(row) {
      this.dialogVisible = false;
@@ -350,7 +285,7 @@
      this.objf = {};
    },
    errorf(err) {
      this.$message.success("操作失败");
      this.$message.success("请查看控制台");
      console.log(err);
    },
    handleClose(done) {
@@ -362,6 +297,15 @@
        punisnum: "",
      };
      done();
    },
    punish(row) {
      //打开处罚
      // console.log(row);
      this.objf = {
        deptid: row.departmentid,
        enterprisename: row.enterprisename,
      };
      this.dialogVisible = true;
    },
    rowSave(row, done, loading) {
      add(row).then(
@@ -457,7 +401,7 @@
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        console.log(this.data, "自招单位");
        console.log(this.data);
        this.loading = false;
        this.selectionClear();
      });
@@ -467,7 +411,8 @@
    handleRowClick(row) {
      // delete (row["name"]);
      var obj = row;
      obj["name"] = "保安公司详细资料";
      obj["name"] = "保安公司详细信息";
      console.log(obj, "obj");
      this.$router.push({
        path: `/securityCompany/index`,
        query: obj,
@@ -477,5 +422,5 @@
};
</script>

<style>
<style lang="scss">
</style>

 src/views/securityCompany/security.vue

@@ -25,13 +25,29 @@
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @row-click="handleRowClick"
      @on-load="onLoad"
    >
      <!-- @row-click="handleRowClick" -->
      <template slot-scope="{ row }" slot="znum">
        <el-tag
          class="rowClickSelf"
          @click="rowClickSelf(row)"
          title="点击查看保安人员情况"
          >{{ row.znum }}</el-tag
        >
      </template>
      <template slot-scope="{ type, size, row }" slot="menu">
        <el-button
          icon="el-icon-s-custom"
          :size="size"
          :type="type"
          @click.stop="handleRowClick(row)"
          >查看
        </el-button>
        <el-button
          :size="size"
          :type="type"
          icon="el-icon-warning"
          class="zhengJian-icon"
          @click.stop="punish(row)"
          >处罚</el-button
@@ -135,6 +151,13 @@
            labelWidth: 110,
          },
          {
            label: "处罚单位",
            prop: "penalty",
            span: 24,
            // type: "textarea",
            labelWidth: 110,
          },
          {
            label: "处罚批准文号",
            prop: "punisnum",
            span: 24,
@@ -168,98 +191,19 @@
        selection: true,
        searchShowBtn: false,
        // menu: false,

        border: true,
        align: "center",
        height: "auto",
        calcHeight: 30,
        tip: false,
        searchShow: true,
        menuWidth: 100,
        menuWidth: 160,
        searchMenuSpan: 6,
        index: true,
        viewBtn: true,
        dialogClickModal: false,

        column: companyColimn,
        // [
        //   {
        //     label: "公司名称",
        //     prop: "enterprisename",
        //     search: true,
        //     searchSpan: 4,
        //     // width: 300,
        //     minWidth: 120,
        //     overHidden: true,
        //     display: false,
        //   },
        //   {
        //     label: "法定代表人",
        //     prop: "representative",
        //     display: false,
        //     width: 86,
        //   },
        //   {
        //     label: "法人电话",
        //     prop: "representativecell",
        //     display: false,
        //     width: 95,
        //   },
        //   {
        //     label: "注册时间",
        //     prop: "establishtime",
        //     type: "date",
        //     format: "yyyy-MM-dd",
        //     valueFormat: "yyyy-MM-dd",
        //     mock: {
        //       type: "datetime",
        //       format: "yyyy-MM-dd",
        //     },
        //     search: true,
        //     searchSpan: 4,
        //     display: false,
        //     width: 140,
        //   },
        //   {
        //     label: "注册资金",
        //     prop: "registeredcapital",
        //     display: false,
        //     width: 110,
        //   },
        //   {
        //     label: "实缴资金",
        //     prop: "capital",
        //     display: false,
        //     width: 110,
        //   },
        //   // {
        //   //   label: "公司类型",
        //   //   prop: "enterprises",
        //   //   display: false,
        //   //   width: 220,
        //   //   overHidden: true,
        //   // },

        //   {
        //     label: "联系人",
        //     prop: "contacts",
        //     display: false,
        //     overHidden: true,
        //     width: 95,
        //   },
        //   {
        //     label: "联系电话",
        //     prop: "contactscell",
        //     display: false,
        //     overHidden: true,
        //     width: 95,
        //   },
        //   {
        //     label: "注册地址",
        //     prop: "address",
        //     display: false,
        //     overHidden: true,
        //   },
        // ],
        group: [
          {
            label: "详细信息",
@@ -309,6 +253,13 @@
    },
  },
  methods: {
    rowClickSelf(val) {
      console.log(val.departmentid);
      this.$router.push({
        path: "/securityGuardManagement/registerOnce",
        query: { departmentid: val.departmentid },
      });
    },
    close(row) {
      this.dialogVisible = false;
      this.objf = {
@@ -468,31 +419,15 @@
      // delete (row["name"]);
      var obj = row;
      obj["name"] = "保安公司详细信息";
      console.log(obj, "obj");
      this.$router.push({
        path: `/securityCompany/index`,
        query: obj,
      });

      var flag = false,
        i = 0,
        ind = null;

      this.$store.state.tags.tagList.forEach((item, index) => {
        if (item.label == "保安公司详细信息") {
          if (flag == false) {
            ind = index;
            flag = true;
          }
          i++;
        }
      });
      if (i > 1) {
        this.$store.state.tags.tagList.splice(ind, 1);
      }
    },
  },
};
</script>

<style>
<style lang="scss">
</style>

 src/views/securityCompany/securityCrossRegion.vue

@@ -25,13 +25,29 @@
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @row-click="handleRowClick"
      @on-load="onLoad"
    >
      <!-- @row-click="handleRowClick" -->
      <template slot-scope="{ row }" slot="znum">
        <el-tag
          class="rowClickSelf"
          @click="rowClickSelf(row)"
          title="点击查看保安人员情况"
          >{{ row.znum }}</el-tag
        >
      </template>
      <template slot-scope="{ type, size, row }" slot="menu">
        <el-button
          icon="el-icon-s-custom"
          :size="size"
          :type="type"
          @click.stop="handleRowClick(row)"
          >查看
        </el-button>
        <el-button
          :size="size"
          :type="type"
          icon="el-icon-warning"
          class="zhengJian-icon"
          @click.stop="punish(row)"
          >处罚</el-button
@@ -168,98 +184,19 @@
        selection: true,
        searchShowBtn: false,
        // menu: false,

        border: true,
        align: "center",
        height: "auto",
        calcHeight: 30,
        tip: false,
        searchShow: true,
        menuWidth: 100,
        menuWidth: 160,
        searchMenuSpan: 6,
        index: true,
        viewBtn: true,
        dialogClickModal: false,

        column: companyColimn,
        // [
        //   {
        //     label: "公司名称",
        //     prop: "enterprisename",
        //     search: true,
        //     searchSpan: 4,
        //     // width: 300,
        //     minWidth: 120,
        //     overHidden: true,
        //     display: false,
        //   },
        //   {
        //     label: "法定代表人",
        //     prop: "representative",
        //     display: false,
        //     width: 86,
        //   },
        //   {
        //     label: "法人电话",
        //     prop: "representativecell",
        //     display: false,
        //     width: 95,
        //   },
        //   {
        //     label: "注册时间",
        //     prop: "establishtime",
        //     type: "date",
        //     format: "yyyy-MM-dd",
        //     valueFormat: "yyyy-MM-dd",
        //     mock: {
        //       type: "datetime",
        //       format: "yyyy-MM-dd",
        //     },
        //     search: true,
        //     searchSpan: 4,
        //     display: false,
        //     width: 140,
        //   },
        //   {
        //     label: "注册资金",
        //     prop: "registeredcapital",
        //     display: false,
        //     width: 110,
        //   },
        //   {
        //     label: "实缴资金",
        //     prop: "capital",
        //     display: false,
        //     width: 110,
        //   },
        //   // {
        //   //   label: "公司类型",
        //   //   prop: "enterprises",
        //   //   display: false,
        //   //   width: 220,
        //   //   overHidden: true,
        //   // },

        //   {
        //     label: "联系人",
        //     prop: "contacts",
        //     display: false,
        //     overHidden: true,
        //     width: 95,
        //   },
        //   {
        //     label: "联系电话",
        //     prop: "contactscell",
        //     display: false,
        //     overHidden: true,
        //     width: 95,
        //   },
        //   {
        //     label: "注册地址",
        //     prop: "address",
        //     display: false,
        //     overHidden: true,
        //   },
        // ],
        group: [
          {
            label: "详细信息",
@@ -309,6 +246,13 @@
    },
  },
  methods: {
    rowClickSelf(val) {
      console.log(val.departmentid);
      this.$router.push({
        path: "/securityGuardManagement/registerOnce",
        query: { departmentid: val.departmentid },
      });
    },
    close(row) {
      this.dialogVisible = false;
      this.objf = {
@@ -468,31 +412,15 @@
      // delete (row["name"]);
      var obj = row;
      obj["name"] = "保安公司详细信息";
      console.log(obj, "obj");
      this.$router.push({
        path: `/securityCompany/index`,
        query: obj,
      });

      var flag = false,
        i = 0,
        ind = null;

      this.$store.state.tags.tagList.forEach((item, index) => {
        if (item.label == "保安公司详细信息") {
          if (flag == false) {
            ind = index;
            flag = true;
          }
          i++;
        }
      });
      if (i > 1) {
        this.$store.state.tags.tagList.splice(ind, 1);
      }
    },
  },
};
</script>

<style>
<style lang="scss">
</style>

 src/views/securityCompany/train.vue

@@ -2,8 +2,8 @@
 * @Author: Morpheus
 * @Date: 2021-07-07 17:30:05
 * @Last Modified by: Morpheus
 * @Last Modified time: 2021-07-10 16:06:14
 * menu-name 保安培训单位查询
 * @Last Modified time: 2021-07-10 16:01:42
 * menu-name 保安服务公司查询
 */
<template>
  <basic-container>
@@ -25,13 +25,29 @@
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @row-click="handleRowClick"
      @on-load="onLoad"
    >
      <!-- @row-click="handleRowClick" -->
      <template slot-scope="{ row }" slot="znum">
        <el-tag
          class="rowClickSelf"
          @click="rowClickSelf(row)"
          title="点击查看保安人员情况"
          >{{ row.znum }}</el-tag
        >
      </template>
      <template slot-scope="{ type, size, row }" slot="menu">
        <el-button
          icon="el-icon-s-custom"
          :size="size"
          :type="type"
          @click.stop="handleRowClick(row)"
          >查看
        </el-button>
        <el-button
          :size="size"
          :type="type"
          icon="el-icon-warning"
          class="zhengJian-icon"
          @click.stop="punish(row)"
          >处罚</el-button
@@ -80,9 +96,10 @@
  add,
  update,
  remove,
} from "@/api/securityCompany/train";
import { savePunish } from "@/api/securityCompany/security";
  savePunish,
} from "@/api/securityCompany/security";
import { mapGetters } from "vuex";
import { companyColimn } from "./column";

export default {
  data() {
@@ -165,73 +182,21 @@
        editBtn: false,
        addBtn: false,
        selection: true,
        searchShowBtn: false,
        // menu: false,
        menuWidth: 100,

        border: true,
        align: "center",
        height: "auto",
        calcHeight: 30,
        searchShowBtn: false,
        tip: false,
        searchShow: true,
        menuWidth: 160,
        searchMenuSpan: 6,
        index: true,
        viewBtn: true,
        dialogClickModal: false,

        column: [
          {
            label: "公司名称",
            prop: "enterprisename",
            search: true,
            searchSpan: 4,
            display: false,
          },
          {
            label: "法定代表人",
            prop: "representative",
            display: false,
            width: 120,
          },
          {
            label: "注册时间",
            prop: "establishtime",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            mock: {
              type: "datetime",
              format: "yyyy-MM-dd",
            },
            search: true,
            searchSpan: 4,
            display: false,
            width: 180,
          },
          {
            label: "注册资金",
            prop: "registeredcapital",
            display: false,
            width: 130,
          },
          {
            label: "实缴资金",
            prop: "capital",
            display: false,
            width: 130,
          },
          {
            label: "公司类型",
            prop: "enterprises",
            display: false,
          },
          {
            label: "注册地址",
            prop: "address",
            display: false,
            width: 280,
          },
        ],
        column: companyColimn,
        group: [
          {
            label: "详细信息",
@@ -281,14 +246,12 @@
    },
  },
  methods: {
    punish(row) {
      //打开处罚
      // console.log(row);
      this.objf = {
        deptid: row.departmentid,
        enterprisename: row.enterprisename,
      };
      this.dialogVisible = true;
    rowClickSelf(val) {
      console.log(val.departmentid);
      this.$router.push({
        path: "/securityGuardManagement/registerOnce",
        query: { departmentid: val.departmentid },
      });
    },
    close(row) {
      this.dialogVisible = false;
@@ -322,7 +285,7 @@
      this.objf = {};
    },
    errorf(err) {
      this.$message.success("操作失败");
      this.$message.success("请查看控制台");
      console.log(err);
    },
    handleClose(done) {
@@ -335,7 +298,15 @@
      };
      done();
    },

    punish(row) {
      //打开处罚
      // console.log(row);
      this.objf = {
        deptid: row.departmentid,
        enterprisename: row.enterprisename,
      };
      this.dialogVisible = true;
    },
    rowSave(row, done, loading) {
      add(row).then(
        () => {
@@ -430,6 +401,7 @@
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        console.log(this.data);
        this.loading = false;
        this.selectionClear();
      });
@@ -439,7 +411,8 @@
    handleRowClick(row) {
      // delete (row["name"]);
      var obj = row;
      obj["name"] = "保安公司详细资料";
      obj["name"] = "保安公司详细信息";
      console.log(obj, "obj");
      this.$router.push({
        path: `/securityCompany/index`,
        query: obj,
@@ -449,5 +422,5 @@
};
</script>

<style>
<style lang="scss">
</style>

 src/views/securityGuardManagement/register.vue

@@ -1,8 +1,8 @@
/*
 * @Author: Morpheus
 * @Date: 2021-07-05 16:31:54
 * @Last Modified by: Morpheus
 * @Last Modified time: 2021-07-10 15:41:13
 * @Last Modified by: liu
 * @Last Modified time: 2021-08-31 11:26:49
 * menu-name 保安员注册查询
 */
<template>
@@ -40,9 +40,9 @@
            @current-change="currentChange"
            @size-change="sizeChange"
            @refresh-change="refreshChange"
            @row-click="handleRowClick"
            @on-load="onLoad"
          >
            <!-- @row-click="handleRowClick" -->
            <!-- <template slot-scope="{row}"
                              slot="tenantName">
                        <el-tag>{{row.tenantName}}</el-tag>
@@ -59,7 +59,22 @@
                              slot="userTypeName">
                        <el-tag>{{row.userTypeName}}</el-tag>
                    </template> -->
            <template slot-scope="{ row }" slot="deptId">
              <el-tag
                class="rowClickSelf"
                title="点击查看所属公司情况"
                @click="rowClickSelf(row.deptId)"
                >{{ row.$deptId }}</el-tag
              >
            </template>
            <template slot-scope="{ type, size, row }" slot="menu">
              <el-button
                :size="size"
                :type="type"
                class="zhengJian-icon"
                @click.stop="handleRowClick(row)"
                >详情</el-button
              >
              <el-button
                :size="size"
                :type="type"
@@ -140,10 +155,62 @@
    </el-dialog>

    <div class="baoanzheng" v-if="dialogVisiblecertificates">
      <!-- 保安员证 -->
      <!-- <div class="baoanzheng" id="baoanzheng"> -->
      <div class="baz-main">
        <div class="baz-m-body" ref="baoanzheng">
          <div class="bmb-heard">保安员证</div>
          <div class="img">
            <div v-if="!objVisiblecertificates.myPicture">暂无照片</div>
            <img :src="objVisiblecertificates.myPicture" alt="" v-else />
          </div>
          <div class="imgs">
            <div v-if="erweima == ''">暂无二维码</div>
            <img :src="erweima" alt="" v-else />
            <!-- <img src="/img/register/ewm.png" alt="" /> -->
            <!-- logoSrc="/img/register/ewm.png" -->
            <!-- <vue-qr :text="goToUrl" :size="200"></vue-qr> -->
          </div>

          <!-- <img src="/img/mock/card/card-1.jpg" alt="" /> -->
          <div class="bmb-b">
            姓名：<span class="bmb-b-s">{{
              objVisiblecertificates.realName
            }}</span>
          </div>
          <div class="bmb-b">
            性别：<span class="bmb-b-s">{{ objVisiblecertificates.$sex }}</span>
          </div>
          <div class="bmb-b">
            编号：<span class="bmb-b-s">{{
              objVisiblecertificates.securitynumber
            }}</span>
          </div>
          <div class="bmb-b">
            发证机关：<span class="bmb-b-s">南昌市公安局</span>
          </div>
          <div class="bmb-b">
            发证日期：<span class="bmb-b-s">{{
              objVisiblecertificates.paperTime.slice(0, 10)
            }}</span>
          </div>
          <!-- <div class="bmb-b">
              发证机关：<span class="bmb-b-s" style="margin-right: 15px"
                >南昌市公安局</span
              >发证日期：<span class="bmb-b-s">{{
                obj0.createTime.slice(0, 10)
              }}</span>
            </div> -->
        </div>
        <span slot="footer" class="dialog-footer no-print PrintBut">
          <el-button type="primary" @click="Print">打 印</el-button>
          <el-button type="primary" @click="closePrint"> 取 消 </el-button>
        </span>
      </div>
      <!-- </div> -->
      <!-- <div class="baz-main">
        <div class="baz-m-body" ref="baoanzheng">
          <div class="bmb-heard">保安员证</div>
          <div class="bmb-b">
            姓名：<span class="bmb-b-s">{{
              objVisiblecertificates.realName
@@ -171,7 +238,7 @@
          <el-button type="primary" @click="Print">打 印</el-button>
          <el-button type="primary" @click="closePrint"> 取 消 </el-button>
        </span>
      </div>
      </div> -->
    </div>
  </div>
</template>
@@ -187,7 +254,7 @@
import { mapGetters } from "vuex";
import website from "@/config/website";
import { getToken } from "@/util/auth";
import { addhonor } from "@/api/register/honor";
import { addhonor, getER } from "@/api/register/honor";

export default {
  data() {
@@ -210,6 +277,7 @@
    return {
      dialogVisiblecertificates: false,
      objVisiblecertificates: {},
      erweima: "", //二维码

      objf: {},
      optionf: {
@@ -321,388 +389,247 @@
        tip: false,
        searchShowBtn: false,
        searchShow: true,
        border: true,
        searchMenuSpan: 4,
        index: true,
        viewBtn: false,
        //dialogType: 'drawer',
        dialogClickModal: false,
        // 操作栏宽度
        menuWidth: 280,
        menuWidth: 310,
        column: [
          {
            label: "保安姓名",
            label: "姓名",
            prop: "realName",
            search: true,
            searchSpan: 4,
            searchSpan: 3,
            width: 60,
            searchLabelWidth: 50,
            display: false,
            width: 78,
          },
          {
            label: "所属保安公司",
            searchLabelWidth: "110",
            // prop: "deptName",
            prop: "deptId",
            type: "tree",
            dicUrl:
              "/api/blade-system/dept/security_lazy-tree?parentId=1413470343230877697",
            props: {
              label: "title",
              value: "id",
            },
            slot: true,
            searchSpan: 5,
            display: false,
            overHidden: true,
            search: true,
            width: 198,
          },
          {
            label: "性别",
            prop: "sex",
            width: 55,
            type: "select",
            // search: true,
            searchSpan: 4,
            searchLabelWidth: 50,
            dicData: [
              {
                label: "男",
                value: 1,
              },
              {
                label: "女",
                value: 2,
              },
              {
                label: "男",
                value: 1,
                label: "未知",
                value: 3,
              },
            ],
            slot: true,
            display: false,
            width: 48,
          },
          {
            label: "保安公司",
            prop: "deptName",
            // width: 120,
            label: "身份证号码",
            prop: "cardid",
            search: true,
            searchLabelWidth: 90,
            searchSpan: 4,
            overHidden: true,
            slot: true,
            minWidth: 140,

            display: false,
          },

          {
            label: "籍贯",
            prop: "nativeplace",
            hide: true,
            display: false,
          },
          {
            label: "民族",
            prop: "nation",
            hide: true,
            width: 55,
            display: false,
          },

          {
            label: "出生日期",
            prop: "birthday",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            display: false,
            hide: true,
          },
          {
            label: "年龄",
            prop: "age",
            width: 55,
            display: false,
          },
          {
            label: "学历",
            prop: "education",
            display: false,
            hide: true,
            width: 90,
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            type: "select",
            // hide: true,
            rules: [
              {
                required: true,
                message: "请选择学历",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系电话",
            prop: "phone",
            minWidth: 95,
            display: false,
          },
          {
            label: "健康状态",
            prop: "healstats",
            hide: true,
            display: false,
          },
          {
            label: "保安证编号",
            prop: "securitynumber",
            display: false,
            searchSpan: 5,
            searchLabelWidth: 110,
            // search: true,
          },
          {
            label: "身份证号",
            prop: "cardid",
            slot: true,
            display: false,
            width: 145,
          },
          {
            label: "联系方式",
            prop: "phone",
            slot: true,
            display: false,
            width: 100,
          },
          {
            label: "联系地址",
            prop: "address",
            slot: true,
            display: false,
            hide: true,
            search: true,
            searchLabelWidth: 90,
            minWidth: 105,
            searchSpan: 4,
            addDisplay: false,
            editDisplay: false,
            // hide: true,
          },
          {
            label: "入职时间",
            prop: "rtime",
            slot: true,
            display: false,
            width: 82,
          },
          {
            label: "所属角色",
            prop: "roleName",
            slot: true,
            display: false,
            width: 78,
            hide: true,
            display: false,
          },

          // {
          //   label: "所属辖区",
          //   prop: "jurisdiction",
          //   // multiple: true,
          //   minWidth: 60,
          //   type: "tree",
          //   dicUrl: "/api/jurisdiction/lazy-tree?parentId=0",
          //   props: {
          //     label: "title",
          //     value: "id",
          //   },
          //   checkStrictly: true,
          //   slot: true,
          //   rules: [
          //     {
          //       required: true,
          //       message: "请选择所属辖区",
          //       trigger: "click",
          //     },
          //   ],
          //     label: "是否派遣",
          //     prop: "dispatch",
          //     // hide: true,
          //     type: 'select',
          //     // display: false,
          //     dicData: [
          //         {
          //             label: '未派遣',
          //             value: 1
          //         }, {
          //             label: '已派遣',
          //             value: 0
          //         }
          //     ]
          // },
          {
            label: "是否在职",
            prop: "status",
            label: "是否派遣",
            prop: "dispatch",
            type: "select",
            search: true,
            searchSpan: 4,
            dicData: [
              {
                label: "否",
                value: 0,
                label: "未派遣",
                value: "1",
              },
              {
                label: "是",
                value: 1,
                label: "已派遣",
                value: "0",
              },
            ],
            slot: true,
            display: false,
            width: 70,
          },
          {
            label: "是否持证",
            prop: "hold",
            type: "select",
            search: true,
            searchSpan: 4,
            dicData: [
              {
                label: "是",
                value: "0",
              },
              {
                label: "否",
                value: "1",
              },
              {
                label: "已吊销",
                value: "2",
              },
            ],
            slot: true,
            search: true,
            searchSpan: 3,
            width: 72,
            display: false,
            width: 70,
          },
        ],
        group: [
          {
            label: "基础信息",
            prop: "baseInfo",
            icon: "el-icon-user-solid",
            column: [
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=equipage",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            type: "select",
            rules: [
              {
                label: "所属机构",
                prop: "tenantId",
                type: "tree",
                dicUrl: "/api/blade-system/tenant/select",
                props: {
                  label: "tenantName",
                  value: "tenantId",
                },
                hide: !website.tenantMode,
                addDisplay: website.tenantMode,
                editDisplay: website.tenantMode,
                viewDisplay: website.tenantMode,
                rules: [
                  {
                    required: true,
                    message: "请输入所属机构",
                    trigger: "click",
                  },
                ],
                span: 24,
              },
              {
                label: "登录账号",
                prop: "account",
                rules: [
                  {
                    required: true,
                    message: "请输入登录账号",
                    trigger: "blur",
                  },
                ],
              },
              {
                label: "用户平台",
                type: "select",
                dicUrl: "/api/blade-system/dict/dictionary?code=user_type",
                props: {
                  label: "dictValue",
                  value: "dictKey",
                },
                dataType: "number",
                slot: true,
                prop: "userType",
                rules: [
                  {
                    required: true,
                    message: "请选择用户平台",
                    trigger: "blur",
                  },
                ],
              },
              {
                label: "密码",
                prop: "password",
                hide: true,
                editDisplay: false,
                viewDisplay: false,
                rules: [
                  { required: true, validator: validatePass, trigger: "blur" },
                ],
              },
              {
                label: "确认密码",
                prop: "password2",
                hide: true,
                editDisplay: false,
                viewDisplay: false,
                rules: [
                  { required: true, validator: validatePass2, trigger: "blur" },
                ],
                required: true,
                message: "请选择",
                trigger: "blur",
              },
            ],
          },

          // {
          //     label: "入职时间",
          //     prop: "rtime",
          //     type: "datetime",
          //     format: "yyyy-MM-dd",
          //     valueFormat: "yyyy-MM-dd",
          //     searchRange: true,
          //     searchSpan: 6,
          //     hide: true,
          //     addDisplay: false,
          //     editDisplay: false,
          //     viewDisplay: false,
          //     search: true,
          //     rules: [{
          //         required: true,
          //         message: "请输入时间",
          //         trigger: "blur"
          //     }]
          // },
          {
            label: "详细信息",
            prop: "detailInfo",
            icon: "el-icon-s-order",
            column: [
            label: "在职状态",
            prop: "status",
            type: "select",
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=workerState",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            dataType: "number",
            display: false,
            hide: true,
            searchSpan: 3,
            width: 80,
            search: false,
            rules: [
              {
                label: "用户昵称",
                prop: "name",
                hide: true,
                rules: [
                  {
                    required: true,
                    message: "请输入用户昵称",
                    trigger: "blur",
                  },
                ],
              },
              {
                label: "用户姓名",
                prop: "realName",
                rules: [
                  {
                    required: true,
                    message: "请输入用户姓名",
                    trigger: "blur",
                  },
                  {
                    min: 2,
                    max: 5,
                    message: "姓名长度在2到5个字符",
                  },
                ],
              },
              {
                label: "手机号码",
                prop: "phone",
                overHidden: true,
              },
              {
                label: "电子邮箱",
                prop: "email",
                hide: true,
                overHidden: true,
              },
              {
                label: "用户性别",
                prop: "sex",
                type: "select",
                dicData: [
                  {
                    label: "男",
                    value: 1,
                  },
                  {
                    label: "女",
                    value: 2,
                  },
                  {
                    label: "未知",
                    value: 3,
                  },
                ],
                hide: true,
              },
              {
                label: "用户生日",
                type: "date",
                prop: "birthday",
                format: "yyyy-MM-dd hh:mm:ss",
                valueFormat: "yyyy-MM-dd hh:mm:ss",
                hide: true,
              },
              {
                label: "账号状态",
                prop: "statusName",
                hide: true,
                display: false,
              },
            ],
          },
          {
            label: "职责信息",
            prop: "dutyInfo",
            icon: "el-icon-s-custom",
            column: [
              {
                label: "用户编号",
                prop: "code",
              },
              {
                label: "所属角色",
                prop: "roleId",
                multiple: true,
                type: "tree",
                dicData: [],
                props: {
                  label: "title",
                },
                checkStrictly: true,
                slot: true,
                rules: [
                  {
                    required: true,
                    message: "请选择所属角色",
                    trigger: "click",
                  },
                ],
              },
              {
                label: "所属单位",
                prop: "deptId",
                type: "tree",
                multiple: true,
                dicData: [],
                props: {
                  label: "title",
                },
                checkStrictly: true,
                slot: true,
                rules: [
                  {
                    required: true,
                    message: "请选择所属部门",
                    trigger: "click",
                  },
                ],
              },
              {
                label: "所属岗位",
                prop: "postId",
                type: "tree",
                multiple: true,
                dicData: [],
                props: {
                  label: "postName",
                  value: "id",
                },
                rules: [
                  {
                    required: true,
                    message: "请选择所属岗位",
                    trigger: "click",
                  },
                ],
                required: true,
                message: "请选择在职状态",
                trigger: "blur",
              },
            ],
          },
@@ -805,6 +732,13 @@
    }
  },
  methods: {
    rowClickSelf(row) {
      console.log(row, "baoan");
      this.$router.push({
        path: "/securityCompany/index",
        query: { fromSecunityGuardId: row },
      });
    },
    Print() {
      this.$Print(this.$refs.baoanzheng);
    },
@@ -836,18 +770,24 @@
    honor(row) {
      this.objf = {};
      //打开荣誉录入
      console.log(this.objf);
      this.objf = {
        cardid: row.cardid,
        name: row.name,
        name: row.realName,
        honor: "",
        honortime: "",
      };
      console.log(this.objf);
      console.log(row);
      this.dialogVisible = true;
    },
    nodeClick(data) {
      //   this.treeDeptId = data.id;
      this.jurisdiction = data.id;
      // console.log(data, 55555);
      if (data.title != "南昌市公安局") {
        this.jurisdiction = data.id;
      } else {
        this.jurisdiction = "";
      }
      this.page.currentPage = 1;
      this.onLoad(this.page);
    },
@@ -894,7 +834,11 @@
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      var deptId;
      if (params.deptId) {
        deptId = params.deptId;
      }
      this.onLoad(this.page, params, deptId);
      done();
    },
    selectionChange(list) {
@@ -945,16 +889,25 @@
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
    onLoad(page, params = {}, deptId) {
      this.loading = true;
      params["jurisdiction"] = this.jurisdiction;
      getListSecurity(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
        Object.assign(params, this.query),
        deptId
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        var d = data.records;
        var date = new Date();
        var datayear = date.getFullYear();
        for (const key in d) {
          var year = d[key].cardid.slice(6, 10);
          d[key]["age"] = +datayear - +year;
          // d[key].securitynumber = "赣洪202100009";
        }
        this.data = data.records;
        console.log(this.data);
        this.loading = false;
@@ -977,22 +930,22 @@
        query: obj,
      });

      var flag = false,
        i = 0,
        ind = null;
      // var flag = false,
      //   i = 0,
      //   ind = null;

      this.$store.state.tags.tagList.forEach((item, index) => {
        if (item.label == "保安详细信息") {
          if (flag == false) {
            ind = index;
            flag = true;
          }
          i++;
        }
      });
      if (i > 1) {
        this.$store.state.tags.tagList.splice(ind, 1);
      }
      // this.$store.state.tags.tagList.forEach((item, index) => {
      //   if (item.label == "保安详细信息") {
      //     if (flag == false) {
      //       ind = index;
      //       flag = true;
      //     }
      //     i++;
      //   }
      // });
      // if (i > 1) {
      //   this.$store.state.tags.tagList.splice(ind, 1);
      // }
    },
    //证件查看
    handleViewCredentials(row) {
@@ -1008,6 +961,10 @@
      // this.$Print("#certificatess");
      this.objVisiblecertificates = obj;
      console.log(this.objVisiblecertificates);
      getER(this.obj.securitynumber).then((res) => {
        this.erweima = res.data;
        // console.log(res.data);
      });
    },
    // 证件吊销事件
    handleCredentials(row) {
@@ -1086,13 +1043,91 @@
  align-items: center;
  justify-content: center;
}
// .baz-main {
//   position: relative;
//   top: 15px;
//   // width: 441px;
//   // height: 358px;
//   width: 491px;
//   height: 468px;
//   // background-color: #004ca7;
//   background-color: #fff;
//   display: flex;
//   align-items: center;
//   justify-content: center;
//   flex-direction: column;
// }
// .baz-m-body {
//   width: 461px;
//   height: 308px;
//   background-image: url("/img/register/bazbj.png");
//   background-size: 100% 100%;
//   .bmb-heard {
//     font-size: 2rem;
//     width: 100%;
//     text-align: center;
//     letter-spacing: 1rem;
//     margin-bottom: 40px;
//     position: relative;
//     top: 20px;
//   }
//   img {
//     width: 130px;
//     height: 130px;
//     border-radius: 130px;
//     position: absolute;
//     top: 110px;
//     right: 60px;
//   }
//   .bmb-b {
//     padding-left: 20px;
//     box-sizing: border-box;
//     height: 50px;
//     margin-left: 10px;
//     width: 100%;
//     font-size: 1rem;
//     font-weight: 400;
//     .bmb-b-s {
//       display: inline-block;
//       width: 110px;
//       font-size: 1.1rem;
//       font-weight: 600;
//     }
//   }
// }
// .PrintBut {
//   margin-top: 15px;
// }
// .rowClickSelf {
//   &:hover {
//     cursor: pointer;
//   }
// }

// .baoanzheng {
//   // position: fixed;
//   position: relative;
//   // top: 0;
//   top: 0;
//   // left: -10%;
//   left: 0;
//   // height: 0;
//   width: 100%;
//   height: calc(100% - 100px);
//   // background-color: rgba(0, 0, 0, 0.5);
//   background-color: #fff;
//   z-index: 9000;
//   display: flex;
//   align-items: center;
//   justify-content: center;
// }
.baz-main {
  position: relative;
  top: 15px;
  // width: 441px;
  // height: 358px;
  width: 491px;
  height: 468px;
  width: 750px;
  height: 550px;
  // background-color: #004ca7;
  background-color: #fff;
  display: flex;
@@ -1101,40 +1136,65 @@
  flex-direction: column;
}
.baz-m-body {
  width: 461px;
  height: 308px;
  width: 750px;
  height: 550px;
  background-image: url("/img/register/bazbj.png");
  background-size: 100% 100%;
  .bmb-heard {
    font-size: 2rem;
    font-size: 4rem;
    width: 100%;
    text-align: center;
    letter-spacing: 1rem;
    letter-spacing: 1.4rem;
    margin-bottom: 40px;
    padding-left: 10px;
    position: relative;
    top: 20px;
  }
  img {
    width: 130px;
    height: 130px;
    border-radius: 130px;
  .img {
    width: 152px;
    height: 205px;
    border-radius: 10px;
    position: absolute;
    // border: 1px solid rgba($color: #888888, $alpha: 0.5);
    top: 110px;
    right: 60px;
    right: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    img {
      width: 100%;
      height: 100%;
    }
  }
  .imgs {
    width: 110px;
    height: 110px;
    border-radius: 10px;
    position: absolute;
    // border: 1px solid rgba($color: #888888, $alpha: 0.5);
    top: 330px;
    right: 103px;
    display: flex;
    align-items: center;
    justify-content: center;
    img {
      width: 100%;
      height: 100%;
    }
  }
  .bmb-b {
    padding-left: 20px;
    box-sizing: border-box;
    height: 50px;
    margin-left: 10px;
    height: 3.9rem;
    margin-left: 3rem;
    width: 100%;
    font-size: 1rem;
    font-weight: 400;
    font-size: 2rem;
    font-weight: 300;
    .bmb-b-s {
      display: inline-block;
      width: 110px;
      font-size: 1.1rem;
      font-weight: 600;
      width: 20rem;
      font-size: 2rem;
      font-weight: 300;
    }
  }
}

 src/views/securityGuardManagement/registerOnce.vue

New file
@@ -0,0 +1,1089 @@
/*
 * @Author: Morpheus
 * @Date: 2021-07-05 16:31:54
 * @Last Modified by: Morpheus
 * @Last Modified time: 2021-07-10 15:41:13
 * menu-name 保安员注册查询
 */
<template>
  <div>
    <el-row class="registersss">
      <el-col :span="spanLeft">
        <div class="box">
          <el-scrollbar>
            <basic-container>
              <avue-tree
                :option="treeOption"
                :data="treeData"
                @node-click="nodeClick"
              />
            </basic-container>
          </el-scrollbar>
        </div>
      </el-col>
      <el-col :span="spanRight">
        <basic-container>
          <avue-crud
            :option="option"
            :search.sync="search"
            :table-loading="loading"
            :data="data"
            ref="crud"
            v-model="form"
            :permission="permissionList"
            @row-save="rowSave"
            :before-open="beforeOpen"
            :page.sync="page"
            @search-change="searchChange"
            @search-reset="searchReset"
            @selection-change="selectionChange"
            @current-change="currentChange"
            @size-change="sizeChange"
            @refresh-change="refreshChange"
          >
            <!-- @on-load="onLoad" -->
            <!-- @row-click="handleRowClick" -->
            <!-- <template slot-scope="{row}"
                              slot="tenantName">
                        <el-tag>{{row.tenantName}}</el-tag>
                    </template>
                    <template slot-scope="{row}"
                              slot="roleName">
                        <el-tag>{{row.roleName}}</el-tag>
                    </template>
                    <template slot-scope="{row}"
                              slot="deptName">
                        <el-tag>{{row.deptName}}</el-tag>
                    </template>
                    <template slot-scope="{row}"
                              slot="userTypeName">
                        <el-tag>{{row.userTypeName}}</el-tag>
                    </template> -->
            <template slot-scope="{ row }" slot="deptId">
              <el-tag
                class="rowClickSelf"
                title="点击查看所属公司情况"
                @click="rowClickSelf(row.deptId)"
                >{{ row.$deptId }}</el-tag
              >
            </template>
            <template slot-scope="{ type, size, row }" slot="menu">
              <el-button
                :size="size"
                :type="type"
                class="zhengJian-icon"
                @click.stop="handleRowClick(row)"
                >详情</el-button
              >
              <el-button
                :size="size"
                :type="type"
                class="zhengJian-icon"
                @click.stop="honor(row)"
                >荣誉录入</el-button
              >
              <el-button
                :size="size"
                :type="type"
                class="zhengJian-icon"
                @click.stop="handleViewCredentials(row)"
                >打印证件</el-button
              >

              <el-button
                icon="icon-zhengjian"
                :size="size"
                :type="type"
                class="zhengJian-icon"
                @click.stop="handleCredentials(row)"
                >证件吊销</el-button
              >
            </template>
          </avue-crud>
          <el-dialog
            title="用户数据导入"
            append-to-body
            :visible.sync="excelBox"
            width="555px"
          >
            <avue-form
              :option="excelOption"
              v-model="excelForm"
              :upload-after="uploadAfter"
            >
              <template slot="excelTemplate">
                <el-button type="primary" @click="handleTemplate">
                  点击下载<i class="el-icon-download el-icon--right"></i>
                </el-button>
              </template>
            </avue-form>
          </el-dialog>
        </basic-container>
      </el-col>
    </el-row>
    <el-dialog
      title="荣誉录入"
      :visible.sync="dialogVisible"
      width="60%"
      :before-close="handleClose"
      :modal-append-to-body="false"
      center
    >
      <!-- <span>这是一段信息</span> -->
      <avue-form
        :option="optionf"
        v-model="objf"
        @submit="submitf"
        @error="errorf"
      >
        <template slot-scope="{ type, size, row }" slot="menuForm">
          <el-button
            :size="size"
            icon="el-icon-error"
            :type="type"
            @click="close(row)"
            >关闭</el-button
          >
        </template>
      </avue-form>
      <!-- <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible = false"
          >确 定</el-button
        >
      </span> -->
    </el-dialog>

    <div class="baoanzheng" v-if="dialogVisiblecertificates">
      <div class="baz-main">
        <div class="baz-m-body" ref="baoanzheng">
          <div class="bmb-heard">保安员证</div>
          <!-- <img src="/img/mock/card/card-1.jpg" alt="" /> -->
          <div class="bmb-b">
            姓名：<span class="bmb-b-s">{{
              objVisiblecertificates.realName
            }}</span>
          </div>
          <div class="bmb-b">
            性别：<span class="bmb-b-s">{{
              objVisiblecertificates.sexName
            }}</span>
          </div>
          <div class="bmb-b">
            编号：<span class="bmb-b-s">{{
              objVisiblecertificates.securitynumber
            }}</span>
          </div>
          <div class="bmb-b">
            发证机关：<span class="bmb-b-s" style="margin-right: 15px"
              >南昌市公安局</span
            >发证日期：<span class="bmb-b-s">{{
              objVisiblecertificates.createTime.slice(0, 10)
            }}</span>
          </div>
        </div>
        <span slot="footer" class="dialog-footer no-print PrintBut">
          <el-button type="primary" @click="Print">打 印</el-button>
          <el-button type="primary" @click="closePrint"> 取 消 </el-button>
        </span>
      </div>
    </div>
  </div>
</template>

<script>
import { getUser, add, updateHold } from "@/api/management/user";
import { getListSecurity } from "@/api/system/user";
import { getDeptLazyTree } from "@/api/Jurs/jurs";
// import { getDeptTree, getDeptLazyTree } from "@/api/system/dept";
import { getDeptTree } from "@/api/system/dept";
import { getRoleTree } from "@/api/system/role";
import { getPostList } from "@/api/system/post";
import { mapGetters } from "vuex";
import website from "@/config/website";
import { getToken } from "@/util/auth";
import { addhonor } from "@/api/register/honor";

export default {
  data() {
    const validatePass = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请输入密码"));
      } else {
        callback();
      }
    };
    const validatePass2 = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请再次输入密码"));
      } else if (value !== this.form.password) {
        callback(new Error("两次输入密码不一致!"));
      } else {
        callback();
      }
    };
    return {
      spanLeft: 3,
      spanRight: 21,
      departmentid: "", //从保安公司进来

      dialogVisiblecertificates: false,
      objVisiblecertificates: {},

      objf: {},
      optionf: {
        column: [
          {
            label: "保安员名称",
            prop: "name",
            span: 24,
            labelWidth: 110,
            disabled: true,
            rules: [
              {
                required: true,
                message: "请输入身份证号码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "身份证号码",
            prop: "cardid",
            span: 24,
            labelWidth: 110,
            disabled: true,
            rules: [
              {
                required: true,
                message: "请输入身份证号码",
                trigger: "blur",
              },
            ],
          },
          {
            label: "荣誉内容",
            prop: "honor",
            span: 24,
            type: "textarea",
            labelWidth: 110,
          },
          {
            label: "获取时间",
            prop: "honortime",
            span: 24,
            labelWidth: 110,
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
          },
        ],
      },
      dialogVisible: false,
      form: {},
      search: {},
      excelBox: false,
      initFlag: true,
      selectionList: [],
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },

      init: {
        roleTree: [],
        deptTree: [],
      },

      treeDeptId: "",
      jurisdiction: "",
      treeData: [],
      treeOption: {
        nodeKey: "id",
        defaultExpandAll: true,
        lazy: true,
        treeLoad: function (node, resolve) {
          const parentId = node.level === 0 ? 0 : node.data.id;
          getDeptLazyTree(parentId).then((res) => {
            resolve(
              res.data.data.map((item) => {
                return {
                  ...item,
                  leaf: !item.hasChildren,
                };
              })
            );
          });
        },
        addBtn: false,
        menu: false,
        size: "small",
        props: {
          labelText: "标题",
          label: "title",
          value: "value",
          children: "children",
        },
      },
      option: {
        // 操作栏多余按钮去除
        delBtn: false,
        editBtn: false,
        addBtn: false,
        selection: true,
        align: "center",
        height: "auto",
        calcHeight: 80,
        tip: false,
        searchShowBtn: false,
        searchShow: true,
        border: true,
        searchMenuSpan: 4,
        index: true,
        viewBtn: false,
        //dialogType: 'drawer',
        dialogClickModal: false,
        // 操作栏宽度
        menuWidth: 310,
        column: [
          {
            label: "姓名",
            prop: "realName",
            search: true,
            searchSpan: 3,
            width: 60,
            searchLabelWidth: 50,
            display: false,
          },
          {
            label: "所属保安公司",
            searchLabelWidth: "110",
            // prop: "deptName",
            prop: "deptId",
            type: "tree",
            dicUrl:
              "/api/blade-system/dept/security_lazy-tree?parentId=1413470343230877697",
            props: {
              label: "title",
              value: "id",
            },
            slot: true,
            searchSpan: 5,
            display: false,
            overHidden: true,
            search: true,
            width: 280,
          },
          {
            label: "性别",
            prop: "sex",
            width: 55,
            type: "select",
            dicData: [
              {
                label: "男",
                value: 1,
              },
              {
                label: "女",
                value: 2,
              },
              {
                label: "未知",
                value: 3,
              },
            ],
            display: false,
          },
          {
            label: "身份证号码",
            prop: "cardid",
            search: true,
            searchLabelWidth: 90,
            searchSpan: 4,
            minWidth: 140,

            display: false,
          },

          {
            label: "籍贯",
            prop: "nativeplace",
            hide: true,
            display: false,
          },
          {
            label: "民族",
            prop: "nation",
            hide: true,
            width: 55,
            display: false,
          },

          {
            label: "出生日期",
            prop: "birthday",
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
            display: false,
            hide: true,
          },
          {
            label: "年龄",
            prop: "age",
            width: 55,
            display: false,
          },
          {
            label: "学历",
            prop: "education",
            display: false,
            width: 90,
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            type: "select",
            // hide: true,
            rules: [
              {
                required: true,
                message: "请选择学历",
                trigger: "blur",
              },
            ],
          },
          {
            label: "联系电话",
            prop: "phone",
            minWidth: 95,
            display: false,
          },
          {
            label: "健康状态",
            prop: "healstats",
            hide: true,
            display: false,
          },
          {
            label: "保安证编号",
            prop: "securitynumber",
            search: true,
            searchLabelWidth: 90,
            minWidth: 105,
            searchSpan: 4,
            addDisplay: false,
            editDisplay: false,
            // hide: true,
          },
          {
            label: "入职时间",
            prop: "rtime",
            hide: true,
            display: false,
          },
          // {
          //     label: "是否派遣",
          //     prop: "dispatch",
          //     // hide: true,
          //     type: 'select',
          //     // display: false,
          //     dicData: [
          //         {
          //             label: '未派遣',
          //             value: 1
          //         }, {
          //             label: '已派遣',
          //             value: 0
          //         }
          //     ]
          // },
          {
            label: "是否派遣",
            prop: "dispatch",
            type: "select",
            dicData: [
              {
                label: "未派遣",
                value: "1",
              },
              {
                label: "已派遣",
                value: "0",
              },
            ],
          },
          {
            label: "是否持证",
            prop: "hold",
            slot: true,
            search: true,
            searchSpan: 3,
            width: 72,
            display: false,
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=equipage",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            type: "select",
            rules: [
              {
                required: true,
                message: "请选择",
                trigger: "blur",
              },
            ],
          },

          // {
          //     label: "入职时间",
          //     prop: "rtime",
          //     type: "datetime",
          //     format: "yyyy-MM-dd",
          //     valueFormat: "yyyy-MM-dd",
          //     searchRange: true,
          //     searchSpan: 6,
          //     hide: true,
          //     addDisplay: false,
          //     editDisplay: false,
          //     viewDisplay: false,
          //     search: true,
          //     rules: [{
          //         required: true,
          //         message: "请输入时间",
          //         trigger: "blur"
          //     }]
          // },
          {
            label: "在职状态",
            prop: "status",
            type: "select",
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=workerState",
            props: {
              label: "dictValue",
              value: "dictKey",
            },
            dataType: "number",
            display: false,
            hide: true,
            searchSpan: 3,
            width: 80,
            search: false,
            rules: [
              {
                required: true,
                message: "请选择在职状态",
                trigger: "blur",
              },
            ],
          },
        ],
      },
      data: [],
      platformQuery: {},
      platformSelectionList: [],

      excelForm: {},
      excelOption: {
        submitBtn: false,
        emptyBtn: false,
        column: [
          {
            label: "模板上传",
            prop: "excelFile",
            type: "upload",
            drag: true,
            loadText: "模板上传中，请稍等",
            span: 24,
            propsHttp: {
              res: "data",
            },
            tip: "请上传 .xls,.xlsx 标准格式文件",
            action: "/api/blade-user/import-user",
          },
          {
            label: "数据覆盖",
            prop: "isCovered",
            type: "switch",
            align: "center",
            width: 80,
            dicData: [
              {
                label: "否",
                value: 0,
              },
              {
                label: "是",
                value: 1,
              },
            ],
            value: 0,
            slot: true,
            rules: [
              {
                required: true,
                message: "请选择是否覆盖",
                trigger: "blur",
              },
            ],
          },
          {
            label: "模板下载",
            prop: "excelTemplate",
            formslot: true,
            span: 24,
          },
        ],
      },
    };
  },
  watch: {
    "form.tenantId"() {
      if (this.form.tenantId !== "" && this.initFlag) {
        this.initData(this.form.tenantId);
      }
    },
    "excelForm.isCovered"() {
      if (this.excelForm.isCovered !== "") {
        const column = this.findObject(this.excelOption.column, "excelFile");
        column.action = `/api/blade-user/import-user?isCovered=${this.excelForm.isCovered}`;
      }
    },
  },
  computed: {
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.user_add, false),
        viewBtn: this.vaildData(this.permission.user_view, false),
        delBtn: this.vaildData(this.permission.user_delete, false),
        editBtn: this.vaildData(this.permission.user_edit, false),
      };
    },

    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  mounted() {
    //重复菜单

    var flag = false,
      i = 0,
      ind = null;
    this.$store.state.tags.tagList.forEach((item, index) => {
      if (item.label == "公司保安员详情") {
        if (flag == false) {
          ind = index;
          flag = true;
        }
        i++;
      }
    });
    if (i > 1) {
      this.$store.state.tags.tagList.splice(ind, 1);
    }

    // 非租户模式默认加载管理组数据
    if (!website.tenantMode) {
      this.initData(website.tenantId);
    }

    // 判断是否从保安公司人数点击跳转
    if (this.$route.query.departmentid) {
      this.departmentid = this.$route.query.departmentid;
      console.log(this.departmentid, "ddddddddddddd");
      this.spanRight = 24;
      this.spanLeft = 0;
      var d = this.option.column;
      d[1]["search"] = false;
    } else {
      console.log("正常点击");
      this.spanRight = 21;
      this.spanLeft = 3;
      var d = this.option.column;
      d[1]["search"] = true;
    }
    this.onLoad(this.page);
  },
  methods: {
    rowClickSelf(row) {
      console.log(row, "baoan");
      this.$router.push({
        path: "/securityCompany/index",
        query: { fromSecunityGuardId: row },
      });
    },
    Print() {
      this.$Print(this.$refs.baoanzheng);
    },
    closePrint() {
      this.dialogVisiblecertificates = false;
    },
    close(row) {
      this.objf = {};
      this.dialogVisible = false;
    },
    submitf(form, done) {
      console.log(form);
      // this.$message.success(JSON.stringify(form));
      addhonor(form).then((res) => {
        console.log(res);
      });
      this.objf = {};
      this.dialogVisible = false;
      done();
    },
    errorf(err) {
      this.$message.success("请查看控制台");
      console.log(err);
    },
    handleClose(done) {
      this.objf = {};
      done();
    },
    honor(row) {
      this.objf = {};
      //打开荣誉录入
      console.log(this.objf);
      this.objf = {
        cardid: row.cardid,
        name: row.name,
        honor: "",
        honortime: "",
      };
      this.dialogVisible = true;
    },
    nodeClick(data) {
      //   this.treeDeptId = data.id;
      // console.log(data, 55555);
      if (data.title != "南昌市公安局") {
        this.jurisdiction = data.id;
      } else {
        this.jurisdiction = "";
      }
      this.page.currentPage = 1;
      this.onLoad(this.page);
    },
    initData(tenantId) {
      getRoleTree(tenantId).then((res) => {
        const column = this.findObject(this.option.group, "roleId");
        column.dicData = res.data.data;
      });
      getDeptTree(tenantId).then((res) => {
        const column = this.findObject(this.option.group, "deptId");
        column.dicData = res.data.data;
      });
      getPostList(tenantId).then((res) => {
        const column = this.findObject(this.option.group, "postId");
        column.dicData = res.data.data;
      });
    },

    rowSave(row, done, loading) {
      row.deptId = row.deptId.join(",");
      row.roleId = row.roleId.join(",");
      row.postId = row.postId.join(",");
      add(row).then(
        () => {
          this.initFlag = false;
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          window.console.log(error);
          loading();
        }
      );
    },
    searchReset() {
      this.query = {};
      this.treeDeptId = "";
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      var deptId;
      if (params.deptId) {
        deptId = params.deptId;
      }
      this.onLoad(this.page, params, deptId);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    uploadAfter(res, done, loading, column) {
      window.console.log(column);
      this.excelBox = false;
      this.refreshChange();
      done();
    },

    handleTemplate() {
      window.open(
        `/api/blade-user/export-template?${
          this.website.tokenHeader
        }=${getToken()}`
      );
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getUser(this.form.id).then((res) => {
          this.form = res.data.data;
          if (this.form.hasOwnProperty("deptId")) {
            this.form.deptId = this.form.deptId.split(",");
          }
          if (this.form.hasOwnProperty("roleId")) {
            this.form.roleId = this.form.roleId.split(",");
          }
          if (this.form.hasOwnProperty("postId")) {
            this.form.postId = this.form.postId.split(",");
          }
        });
      }
      this.initFlag = true;
      done();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}, deptId) {
      this.loading = true;
      params["jurisdiction"] = this.jurisdiction;
      if (this.departmentid) {
        deptId = this.departmentid;
      }
      getListSecurity(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query),
        deptId
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        var d = data.records;
        var date = new Date();
        var datayear = date.getFullYear();
        for (const key in d) {
          var year = d[key].cardid.slice(6, 10);
          d[key]["age"] = +datayear - +year;
          // d[key].securitynumber = "赣洪202100009";
        }
        this.data = data.records;
        console.log(this.data);
        this.loading = false;
        this.selectionClear();
      });
    },

    platformSelectionClear() {
      this.platformSelectionList = [];
      this.$refs.platformCrud.toggleSelection();
    },

    // 行单击
    handleRowClick(row) {
      // delete (row["name"]);
      var obj = row;
      obj["name"] = "保安详细信息";
      this.$router.push({
        path: `/management/index`,
        query: obj,
      });

      // var flag = false,
      //   i = 0,
      //   ind = null;

      // this.$store.state.tags.tagList.forEach((item, index) => {
      //   if (item.label == "保安详细信息") {
      //     if (flag == false) {
      //       ind = index;
      //       flag = true;
      //     }
      //     i++;
      //   }
      // });
      // if (i > 1) {
      //   this.$store.state.tags.tagList.splice(ind, 1);
      // }
    },
    //证件查看
    handleViewCredentials(row) {
      var obj = row;
      // obj["name"] = "保安证件信息";
      // this.$router.push({
      //   path: `/management/idinformation`,
      //   query: obj,
      // });
      this.dialogVisiblecertificates = true;
      // // $("#certificatess").jqprint();
      // console.log($);
      // this.$Print("#certificatess");
      this.objVisiblecertificates = obj;
      console.log(this.objVisiblecertificates);
    },
    // 证件吊销事件
    handleCredentials(row) {
      if (row.hold == 1) {
        this.$message({
          type: "info",
          message: "证件未拥有!",
        });
      } else if (row.hold == 2) {
        this.$message({
          type: "info",
          message: "证件已吊销!",
        });
      } else {
        this.$confirm("是否吊销该人员的证件?", "提示", {
          confirmButtonText: "是",
          cancelButtonText: "否",
          type: "warning",
        })
          .then(() => {
            updateHold(2, row.cardid).then((res) => {
              console.log(res);
              this.$message({
                type: "success",
                message: "删除成功!",
              });
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除",
            });
          });
      }
    },
  },
};
</script>

<style lang='scss' scoped>
.box {
  height: 800px;
}

.el-scrollbar {
  height: 100%;
}

.box .el-scrollbar__wrap {
  overflow: scroll;
}
#certificatess {
  width: 600px;
  height: 300px;
  background-color: #fff;
  .certificates-main {
    width: 100%;
    height: 100%;
    background-image: url("/img/register/bazbj.png");
    background-size: 100% 100%;
  }
}

.baoanzheng {
  position: fixed;
  top: 0;
  left: -10%;
  height: 0;
  width: 120%;
  height: 100%;
  // background-color: rgba(0, 0, 0, 0.5);
  background-color: #fff;
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.baz-main {
  position: relative;
  top: 15px;
  // width: 441px;
  // height: 358px;
  width: 491px;
  height: 468px;
  // background-color: #004ca7;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.baz-m-body {
  width: 461px;
  height: 308px;
  background-image: url("/img/register/bazbj.png");
  background-size: 100% 100%;
  .bmb-heard {
    font-size: 2rem;
    width: 100%;
    text-align: center;
    letter-spacing: 1rem;
    margin-bottom: 40px;
    position: relative;
    top: 20px;
  }
  img {
    width: 130px;
    height: 130px;
    border-radius: 130px;
    position: absolute;
    top: 110px;
    right: 60px;
  }
  .bmb-b {
    padding-left: 20px;
    box-sizing: border-box;
    height: 50px;
    margin-left: 10px;
    width: 100%;
    font-size: 1rem;
    font-weight: 400;
    .bmb-b-s {
      display: inline-block;
      width: 110px;
      font-size: 1.1rem;
      font-weight: 600;
    }
  }
}
.PrintBut {
  margin-top: 15px;
}
.rowClickSelf {
  &:hover {
    cursor: pointer;
  }
}
</style>

 src/views/securityUnitOperation/economicAnalysis.vue

@@ -6,7 +6,7 @@
          <div class="rowTitle">
            <img src="../../../public/img/bajgxt/u1618.png" />
            <span>数据概览</span>
            <el-select class="select0" v-model="value0" placeholder="请选择">
            <!-- <el-select class="select0" v-model="value0" placeholder="请选择">
              <el-option
                v-for="item in options0"
                :key="item.value"
@@ -14,19 +14,22 @@
                :value="item.value"
              >
              </el-option>
            </el-select>
            </el-select> -->
            <el-select
              class="select1"
              v-model="value1"
              ref="treeForm"
              v-model="node.title"
              placeholder="请选择"
              @change="fenjuChange"
            >
              <el-option
                v-for="item in options1"
                :key="item.id"
                :label="item.title"
                :value="item.id"
              >
              <el-option style="height: auto;" :value="node">
                <el-tree
                  :data="options1"
                  default-expand-all
                  node-key="id"
                  @node-click="handleNodeClick"
                  :props="props"
                >
                </el-tree>
              </el-option>
            </el-select>
            <el-select
@@ -59,13 +62,13 @@
            </div>
            <div class="box-card">
              <span>公司派遣人数</span>
              <span>1121</span>
              <span>较上月增加13人</span>
              <span>{{ socialSecurity.paiQ }}</span>
              <span>较上月增加{{ socialSecurity.addPaiQ }}人</span>
            </div>
            <div class="box-card">
              <span>社保缴纳人数占比</span>
              <span>85%</span>
              <span>较上月上涨2%</span>
              <span>{{ socialSecurity.sheBPerson }}</span>
              <span>较上月上涨{{ socialSecurity.addSheBPerson }}</span>
            </div>
          </div>
        </div>
@@ -73,13 +76,13 @@
    </el-row>
    <el-row :gutter="20">
      <el-col :span="16">
        <div class="rowContent">
        <div class="rowContent" v-loading="loading1">
          <span class="span-title">社保缴纳</span>
          <div id="middleEchart1"></div>
        </div>
      </el-col>
      <el-col :span="8">
        <div class="rowContent">
        <div class="rowContent" v-loading="loading2">
          <span class="span-title">派遣人员占比</span>
          <div id="middleEchart2"></div>
        </div>
@@ -87,8 +90,8 @@
    </el-row>
    <el-row>
      <el-col :span="24">
        <div class="rowContent">
          <span class="span-title">公司经济运转趋势</span>
        <div class="rowContent" v-loading="loading3">
          <span class="span-title">服务客户数量</span>
          <div id="bottomEchart"></div>
        </div>
      </el-col>
@@ -99,13 +102,15 @@
<script>
import * as echarts from "echarts";
import echartJs from "./securityEchart.js";
import { lazyTreeJu } from "../../api/index/index";
import { lazyTreeJu, lazyTrees } from "../../api/index/index";
import {
  getCompanys,
  selectPCount,
  selectTo,
  queryYearSoil,
  queryYearAn,
  queryYearPz,
  queryYearKh
} from "../../api/securityUnitOperation/securityUnitOperation";
export default {
  data() {
@@ -116,28 +121,28 @@
      options0: [
        {
          value: "2012",
          label: "2012年",
          label: "2012年"
        },
        {
          value: "2011",
          label: "2011年",
          label: "2011年"
        },
        {
          value: "2010",
          label: "2010年",
          label: "2010年"
        },
        {
          value: "2009",
          label: "2009年",
          label: "2009年"
        },
        {
          value: "2008",
          label: "2008年",
          label: "2008年"
        },
        {
          value: "2007",
          label: "2007年",
        },
          label: "2007年"
        }
      ],
      options1: [],
      options2: [],
@@ -146,33 +151,64 @@
        addNum: 0,
        money: 0,
        addMoney: 0,
        paiQ: 0,
        addPaiQ: 0,
        sheBPerson: 0,
        addSheBPerson: 0
      },
      loading1: true,
      loading2: true,
      loading3: true,
      enterpriseName: "",
      props: {
        children: "children",
        label: "title",
        value: "id"
      },
      node: {} //选中的记录
    };
  },
  methods: {
    //点击节点
    handleNodeClick(data) {
      this.node = data;
      this.value1 = data.id;
      this.$refs.treeForm.blur();
      this.getCompanys();
    },
    toEconomicTable() {
      this.$router.push({ path: "/securityUnitOperation/economicTable" });
      this.$router.push({
        path:
          "/securityUnitOperation/economicTable?jurisdiction=" +
          this.value2 +
          "&enterpriseName=" +
          this.enterpriseName +
          "&jurisdiction1=" +
          this.value1
      });
    },
    getFenju() {
      lazyTreeJu().then((res) => {
      this.options1 = [];
      this.value1 = "";
      this.node = {};
      lazyTrees().then(res => {
        if (res.data.code === 200) {
          this.options1 = res.data.data;
          this.value1 = this.options1[0] ? this.options1[0].id : "";
          this.node = this.options1[0];
          this.getCompanys();
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    fenjuChange() {
      this.getCompanys();
    },
    pieChange() {
      this.loading2 = true;
      let params = {
        jurisdiction: this.value1,
        deptid: this.value2,
        deptid: this.value2
      };
      selectPCount(params).then((res) => {
      selectPCount(params).then(res => {
        if (res.data.code === 200) {
          let middleEchart2 = echarts.init(
            document.getElementById("middleEchart2")
@@ -181,10 +217,11 @@
        } else {
          this.$message.error(res.msg);
        }
        this.loading2 = false;
      });
    },
    getCompanys() {
      getCompanys({ jurisdiction: this.value1 }).then((res) => {
      getCompanys({ jurisdiction: this.value1 }).then(res => {
        if (res.data.code === 200) {
          this.options2 = res.data.data;
          this.value2 = this.options2[0] ? this.options2[0].departmentid : "";
@@ -195,42 +232,70 @@
    getSocialSecurity() {
      let params = {
        jurisdiction: this.value1,
        deptid: this.value2,
        deptid: this.value2
      };
      selectTo(params).then((res) => {
      selectTo(params).then(res => {
        if (res.data.code === 200) {
          let data = res.data.data[0];
          this.socialSecurity.num = data.thismouth;
          this.socialSecurity.addNum = data.thismouth - data.lastmonth;
          this.socialSecurity.money = data.thisamount;
          this.socialSecurity.addMoney = data.thisamount - data.lastamount;
          this.socialSecurity.paiQ = data.userpcthismouth;
          this.socialSecurity.addPaiQ =
            data.userpcthismouth - data.userpclastmouth;
          this.socialSecurity.sheBPerson =
            data.userthismouth && (data.thismouth / data.userthismouth) * 100
              ? ((data.thismouth / data.userthismouth) * 100).toFixed(2) + "%"
              : 0;
          this.socialSecurity.addSheBPerson =
            data.userthismouth &&
            data.userlastmouth &&
            (data.thismouth / data.userthismouth) * 100 &&
            (data.lastmonth / data.userlastmouth) * 100 &&
            (data.thismouth / data.userthismouth) * 100 -
              (data.lastmonth / data.userlastmouth) * 100
              ? (
                  (data.thismouth / data.userthismouth) * 100 -
                  (data.lastmonth / data.userlastmouth) * 100
                ).toFixed(2) + "%"
              : 0;
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    getQueryYearSoil() {
      this.loading1 = true;
      let params = {
        jurisdiction: this.value1,
        deptid: this.value2,
        deptid: this.value2
      };
      queryYearSoil(params).then((res) => {
      queryYearSoil(params).then(res => {
        if (res.data.code === 200) {
          let middleEchart1 = echarts.init(
            document.getElementById("middleEchart1")
          );
          middleEchart1.setOption(echartJs.economicMiddle(res.data.data));
          queryYearPz(params).then(res1 => {
            if (res1.data.code === 200) {
              let middleEchart1 = echarts.init(
                document.getElementById("middleEchart1")
              );
              middleEchart1.setOption(
                echartJs.economicMiddle(res.data.data, res1.data.data)
              );
            }
            this.loading1 = false;
          });
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    getQueryYearAn() {
      this.loading3 = true;
      let params = {
        jurisdiction: this.value1,
        deptid: this.value2,
        deptid: this.value2
      };
      queryYearAn(params).then((res) => {
      queryYearKh(params).then(res => {
        if (res.data.code === 200) {
          let bottomEchart = echarts.init(
            document.getElementById("bottomEchart")
@@ -239,18 +304,24 @@
        } else {
          this.$message.error(res.msg);
        }
        this.loading3 = false;
      });
    },
    changeCompanys() {
      this.options2.forEach(item => {
        if (item.departmentid === this.value2) {
          this.enterpriseName = item.enterpriseName;
        }
      });
      this.pieChange();
      this.getSocialSecurity();
      this.getQueryYearSoil();
      this.getQueryYearAn();
    },
    }
  },
  mounted() {
    this.getFenju();
  },
  }
};
</script>
<style lang="scss" scoped>

 src/views/securityUnitOperation/economicTable.vue

@@ -1,136 +1,73 @@
<template>
  <basic-container>
    <!-- <div class="operation-table"> -->
    <!-- <el-row>
        <el-col>
          <span>时间范围：</span>
          <el-date-picker
            v-model="value2"
            type="daterange"
            align="right"
            unlink-panels
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :picker-options="pickerOptions"
          >
          </el-date-picker>
          <span>类别：</span>
          <el-select v-model="typeValue" placeholder="请选择">
            <el-option
              v-for="item in typeOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <span>所属辖区：</span>
          <el-select v-model="subofficeValue" placeholder="请选择">
            <el-option
              v-for="item in subofficeOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <span>公司名称：</span>
          <el-input v-model="companyName"></el-input>
          <el-button>查询</el-button>
          <el-button>重置</el-button>
        </el-col>
      </el-row> -->
    <!-- <el-row>
        <el-col>
          <div class="table">
            <el-button @click="downExcel">下载</el-button> -->
    <avue-crud
      :option="tableOption"
      :table-loading="loading"
      :data="tableData"
      :page.sync="tablePage"
      :page.sync="page"
      :permission="permissionList"
      :before-open="beforeOpen"
      @date-change="dateChange"
      ref="crud"
      @row-update="rowUpdates"
      @row-save="rowSave"
      @search-change="searchChange"
      @search-reset="searchReset"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
    >
    </avue-crud>
    <!-- <el-table id="table" :data="tableData" style="width: 100%">
            <el-table-column type="index" label="序号" width="50">
            </el-table-column>
            <el-table-column prop="company" label="公司名称" width="180">
            </el-table-column>
            <el-table-column prop="subOffice" label="所属分局" width="180">
            </el-table-column>
            <el-table-column prop="time" label="时间"> </el-table-column>
            <el-table-column prop="sbjnrs" label="社保缴纳人数">
            </el-table-column>
            <el-table-column prop="sbjnze" label="社保缴纳总额（万）">
            </el-table-column>
            <el-table-column prop="gspqrs" label="公司派遣人数">
            </el-table-column>
            <el-table-column prop="sbjnrszb" label="社保缴纳人数占比（%）">
            </el-table-column>
            <el-table-column prop="bz" label="备注"> </el-table-column>
          </el-table> -->
    <!-- <el-pagination
              background
              layout="prev, pager, next"
              :total="tableData.length"
            >
            </el-pagination> -->
    <!-- </div>
        </el-col>
      </el-row> -->
    <!-- </div> -->
  </basic-container>
</template>
<script>
import FileSaver from "file-saver";
import XLSX from "xlsx";
import { mapGetters } from "vuex";
import { selectJj } from "../../api/securityUnitOperation/securityUnitOperation";
import { lazyTreeJu,lazyTrees } from "../../api/index/index";
export default {
  name: "公司经济情况智能分析详情表",
  data() {
    return {
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      query: {},
      value1: "",
      value2: "",
      tableData: [
        {
          company: "江西省永安保安服务有限公司",
          subOffice: "南昌市公安局",
          time: "2021-06-1",
          sbjnrs: "2100",
          sbjnze: "350",
          gspqrs: "110",
          sbjnrszb: "10",
          bz: "",
        },
        {
          company: "南昌市赣水保安服务有限公司",
          subOffice: "东湖分局",
          time: "2020-05-21",
          sbjnrs: "1800",
          sbjnze: "310",
          gspqrs: "160",
          sbjnrszb: "21",
          bz: "",
        },
        {
          company: "江西中业兴达保安服务有限公司",
          subOffice: "西湖分局",
          time: "2021-08-11",
          sbjnrs: "2300",
          sbjnze: "612",
          gspqrs: "80",
          sbjnrszb: "7",
          bz: "",
        },
        // {
        //   company: "江西省永安保安服务有限公司",
        //   subOffice: "南昌市公安局",
        //   time: "2021-06-1",
        //   sbjnrs: "2100",
        //   sbjnze: "350",
        //   gspqrs: "110",
        //   sbjnrszb: "10",
        //   bz: ""
        // },
        // {
        //   company: "南昌市赣水保安服务有限公司",
        //   subOffice: "东湖分局",
        //   time: "2020-05-21",
        //   sbjnrs: "1800",
        //   sbjnze: "310",
        //   gspqrs: "160",
        //   sbjnrszb: "21",
        //   bz: ""
        // },
        // {
        //   company: "江西中业兴达保安服务有限公司",
        //   subOffice: "西湖分局",
        //   time: "2021-08-11",
        //   sbjnrs: "2300",
        //   sbjnze: "612",
        //   gspqrs: "80",
        //   sbjnrszb: "7",
        //   bz: ""
        // }
      ],
      tablePage: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      tableOption: {
        excelBtn: true,
        delBtn: false,
@@ -150,185 +87,150 @@
        viewBtn: true,
        dialogClickModal: false,
        column: [
          {
            label: "类别",
            hide: true,
            prop: "",
            search: true,
            searchSpan: 4,
            display: true,
            type: "select",
            props: {
              label: "label",
              value: "value",
            },
            // cascaderItem: ["city", "area"],
            // dicUrl:subofficeOptions,
            dicData: [
              {
                value: "0",
                label: "全部",
              },
              {
                value: "1",
                label: "社保缴纳人数",
              },
              {
                value: "2",
                label: "社保缴纳总额",
              },
              {
                value: "3",
                label: "公司派遣人数",
              },
              {
                value: "4",
                label: "社保缴纳人数占比",
              },
            ],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择类别",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "类别",
          //   hide: true,
          //   prop: "",
          //   search: true,
          //   searchSpan: 4,
          //   display: true,
          //   type: "select",
          //   props: {
          //     label: "label",
          //     value: "value"
          //   },
          //   // cascaderItem: ["city", "area"],
          //   // dicUrl:subofficeOptions,
          //   dicData: [
          //     {
          //       value: "0",
          //       label: "全部"
          //     },
          //     {
          //       value: "1",
          //       label: "社保缴纳人数"
          //     },
          //     {
          //       value: "2",
          //       label: "社保缴纳总额"
          //     },
          //     {
          //       value: "3",
          //       label: "公司派遣人数"
          //     },
          //     {
          //       value: "4",
          //       label: "社保缴纳人数占比"
          //     }
          //   ],
          //   search: true,
          //   rules: [
          //     {
          //       required: true,
          //       message: "请选择类别",
          //       trigger: "blur"
          //     }
          //   ]
          // },
          {
            label: "公司名称",
            prop: "company",
            prop: "enterpriseName",
            search: true,
            searchSpan: 4,
            display: false,
            width:300,
            display: false
          },
          {
            label: "所属辖区",
            prop: "subOffice",
            prop: "jurname",
            searchSpan: 4,
            type: "select",
            type: "tree",
            props: {
              label: "label",
              value: "value",
              label: "title",
              value: "id"
            },
            // cascaderItem: ["city", "area"],
            // dicUrl:subofficeOptions,
            dicData: [
              {
                value: "0",
                label: "南昌市公安局",
              },
              {
                value: "2",
                label: "东湖分局",
              },
              {
                value: "3",
                label: "西湖分局",
              },
              {
                value: "4",
                label: "青云谱分局",
              },
              {
                value: "5",
                label: "青山湖分局",
              },
            ],
            dicData: [],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择所属辖区",
                trigger: "blur",
              },
            ],
                trigger: "blur"
              }
            ]
          },
          {
            label: "时间",
            prop: "time",
            type: "date",
            format: "yyyy-MM-dd hh:mm:ss",
            valueFormat: "yyyy-MM-dd hh:mm:ss",
            searchSpan: 6,
            searchRange: true,
            search: true,
            display: false,
          },
          // {
          //   label: "时间",
          //   prop: "time",
          //   type: "date",
          //   format: "yyyy-MM-dd hh:mm:ss",
          //   valueFormat: "yyyy-MM-dd hh:mm:ss",
          //   searchSpan: 6,
          //   searchRange: true,
          //   search: true,
          //   display: false
          // },
          {
            label: "社保缴纳人数",
            prop: "sbjnrs",
            display: false,
            prop: "sbnum",
            display: false
          },
          {
            label: "社保缴纳总额（万）",
            prop: "sbjnze",
            prop: "sbcount",
            display: false,
            formatter: function(row, value) {
              return (value = value / 10000);
            }
          },
          {
            label: "公司派遣人数",
            prop: "gspqrs",
            display: false,
            prop: "pcnum",
            display: false
          },
          {
            label: "社保缴纳人数占比（%）",
            prop: "sbjnrszb",
            label: "社保缴纳人数占比",
            prop: "zb",
            display: false,
            formatter: function(row, value) {
              return (value = value * 100 + "%");
            }
          },
          {
            label: "备注",
            prop: "bz",
            display: false,
          },
        ],
            display: false
          }
        ]
      },
      typeValue: "0",
      typeOptions: [
        {
          value: "0",
          label: "全部",
          label: "全部"
        },
        {
          value: "1",
          label: "社保缴纳人数",
          label: "社保缴纳人数"
        },
        {
          value: "2",
          label: "社保缴纳总额",
          label: "社保缴纳总额"
        },
        {
          value: "3",
          label: "公司派遣人数",
          label: "公司派遣人数"
        },
        {
          value: "4",
          label: "社保缴纳人数占比",
        },
          label: "社保缴纳人数占比"
        }
      ],
      subofficeValue: "0",
      subofficeOptions: [
        {
          value: "0",
          label: "南昌市公安局",
        },
        {
          value: "2",
          label: "东湖分局",
        },
        {
          value: "3",
          label: "西湖分局",
        },
        {
          value: "4",
          label: "青云谱分局",
        },
        {
          value: "5",
          label: "青山湖分局",
        },
      ],
      companyName: "",
      loading: true
    };
  },
  computed: {
@@ -338,33 +240,113 @@
        addBtn: this.vaildData(this.permission.post_add, false),
        viewBtn: this.vaildData(this.permission.post_view, false),
        delBtn: this.vaildData(this.permission.post_delete, false),
        editBtn: this.vaildData(this.permission.post_edit, false),
        editBtn: this.vaildData(this.permission.post_edit, false)
      };
    },
    }
  },
  methods: {
    dateChange() {},
    // downExcel() {
    //   let et = XLSX.utils.table_to_book(document.getElementById("table"));
    //   let etout = XLSX.write(et, {
    //     bookType: "xlsx",
    //     bookSST: true,
    //     type: "array"
    //   });
    //   try {
    //     FileSaver.saveAs(
    //       new Blob([etout], {
    //         type: "application/octet-stream"
    //       }),
    //       `表.xlsx`
    //     ); //导出的文件名
    //   } catch (e) {
    //     console.log(e, etout);
    //   }
    //   return etout;
    // }
    rowSave(row, done, loading) {
      adddata(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          done();
        },
        error => {
          window.console.log(error);
          loading();
        }
      );
    },
    rowUpdates(row, index, done, loading) {
      update(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          done();
        },
        error => {
          window.console.log(error);
          loading();
        }
      );
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },

    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
      this.onLoad(this.page, this.query);
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
      this.onLoad(this.page, this.query);
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      let param = {};
      param["jurisdiction"] = params["jurname"] || "";
      param["enterpriseName"] = params["enterpriseName"] || "";
      param["current"] = page.currentPage;
      param["size"] = page.pageSize;
      selectJj(param).then(res => {
        const data = res.data.data;
        this.page.total = data.total;
        this.tableData = data.records;
        this.loading = false;
      });
    },
    getSubOfficeData() {
      lazyTrees().then(res => {
        if (res.data.code === 200) {
          this.tableOption.column.forEach(item => {
            if (item.label == "所属辖区") {
              item.dicData = res.data.data;
            }
          });
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    getLocationParams() {
      let url = window.location.href;
      let urlArr = url.split("?")[1].split("&");
      var object = new Object();
      for (var i = 0; i < urlArr.length; i++) {
        let mm = urlArr[i].split("=");
        object[decodeURIComponent(mm[0])] = decodeURIComponent(mm[1]);
      }
      let jurisdiction = object["jurisdiction1"] || "";
      let enterpriseName = object["enterpriseName"] || "";
      this.query = {
        jurisdiction: jurisdiction,
        enterpriseName: enterpriseName
      };
      this.onLoad(this.page, this.query);
    }
  },
  mounted() {},
  mounted() {
    this.getLocationParams();
    this.getSubOfficeData();
  }
};
</script>
<style lang="scss" scoped>

 src/views/securityUnitOperation/operationAnalysis.vue

@@ -7,23 +7,37 @@
            <img src="../../../public/img/bajgxt/u1618.png" />
            <span>数据概览</span>

            <el-select class="select0" v-model="value0" placeholder="请选择">
            <!-- <el-select class="select0" v-model="value0" placeholder="请选择">
              <el-option
                v-for="item in options0"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select> -->
            <el-select
              class="select1"
              ref="treeForm"
              v-model="node.title"
              placeholder="请选择"
            >
              <el-option style="height: auto;" :value="node">
                <el-tree
                  :data="options1"
                  default-expand-all
                  node-key="id"
                  @node-click="handleNodeClick"
                  :props="props"
                >
                </el-tree>
              </el-option>
            </el-select>
            <el-select class="select1" v-model="value1" placeholder="请选择" @change="fenjuChange">
              <el-option
                v-for="item in options1"
                :key="item.id"
                :label="item.title"
                :value="item.id"
              ></el-option>
            </el-select>
            <el-select class="select2" v-model="value2" placeholder="请选择" @change="changeCompanys">
            <el-select
              class="select2"
              v-model="value2"
              placeholder="请选择"
              @change="changeCompanys"
            >
              <el-option
                v-for="item in options2"
                :key="item.departmentid"
@@ -37,38 +51,38 @@
          <div class="col-content">
            <div class="box-card">
              <span>总保安数</span>
              <span>{{card.baoanTotal}}</span>
              <span>较上月增加{{card.addbaoanTotal}}人</span>
              <span>{{ card.baoanTotal }}</span>
              <span>较上月增加{{ card.addbaoanTotal }}人</span>
            </div>
            <div class="box-card">
              <span>正常保安员</span>
              <span>{{card.zcBaoan}}</span>
              <span>较上月增加{{card.addzcBaoan}}人</span>
              <span>{{ card.zcBaoan }}</span>
              <span>较上月增加{{ card.addzcBaoan }}人</span>
            </div>
            <div class="box-card">
              <span>持证保安员</span>
              <span>{{card.czBaoan}}</span>
              <span>较上月增加{{card.addczBaoan}}人</span>
              <span>{{ card.czBaoan }}</span>
              <span>较上月增加{{ card.addczBaoan }}人</span>
            </div>
            <div class="box-card">
            <!-- <div class="box-card">
              <span>过考保安员</span>
              <span>{{card.gkBaoan}}</span>
              <span>较上月增加{{card.addgkBaoan}}人</span>
            </div>
              <span>{{ card.gkBaoan }}</span>
              <span>较上月增加{{ card.addgkBaoan }}人</span>
            </div> -->
            <div class="box-card">
              <span>服务客户</span>
              <span>{{card.kh}}</span>
              <span>较上月增加{{card.addkh}}家</span>
              <span>{{ card.kh }}</span>
              <span>较上月增加{{ card.addkh }}家</span>
            </div>
            <div class="box-card">
              <span>缴纳社保</span>
              <span>{{card.sheb}}</span>
              <span>较上月增加{{card.addsheb}}人</span>
              <span>{{ card.sheb }}</span>
              <span>较上月增加{{ card.addsheb }}人</span>
            </div>
            <div class="box-card">
              <span>保安派遣</span>
              <span>{{card.baoanPq}}</span>
              <span>较上月增加{{card.addbaoanPq}}人</span>
              <span>{{ card.baoanPq }}</span>
              <span>较上月增加{{ card.addbaoanPq }}人</span>
            </div>
          </div>
        </div>
@@ -76,23 +90,47 @@
    </el-row>
    <el-row :gutter="20">
      <el-col :span="16">
        <div class="rowContent">
        <div class="rowContent" v-loading="loading1">
          <span class="span-title">保安类数据统计</span>
          <div id="middleEchart1"></div>
        </div>
      </el-col>
      <el-col :span="8">
        <div class="rowContent">
        <div class="rowContent" v-loading="loading2">
          <span class="span-title">服务客户</span>
          <div id="middleEchart2"></div>
        </div>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="24">
        <div class="rowContent">
    <el-row :gutter="20">
      <el-col :span="16">
        <div class="rowContent" v-loading="loading3">
          <span class="span-title">公司运营趋势</span>
          <div id="bottomEchart"></div>
        </div>
      </el-col>
      <el-col :span="8">
        <div class="rowContent" v-loading="loading4">
          <span class="span-title">年龄结构</span>
          <div class="leftEchartTitle qing">
            <div class="block1"></div>
            <span>青年</span>
            <span>{{ ageData.qing }}</span>
            <span>人</span>
          </div>
          <div class="leftEchartTitle zhong">
            <div class="block1"></div>
            <span>中年</span>
            <span>{{ ageData.zhong }}</span>
            <span>人</span>
          </div>
          <div class="leftEchartTitle lao">
            <div class="block1"></div>
            <span>老年</span>
            <span>{{ ageData.lao }}</span>
            <span>人</span>
          </div>
          <div id="bottomEchart1"></div>
        </div>
      </el-col>
    </el-row>
@@ -102,12 +140,13 @@
<script>
import * as echarts from "echarts";
import echartJs from "./securityEchart.js";
import { lazyTreeJu } from "../../api/index/index";
import { lazyTreeJu, lazyTrees } from "../../api/index/index";
import {
  queryCounts,
  getCompanys,
  queryYearKh,
  queryYearG
  queryYearG,
  selectAge
} from "../../api/securityUnitOperation/securityUnitOperation";
export default {
  data() {
@@ -158,39 +197,99 @@
        }
      ],
      options1: [],
      options2: []
      options2: [],
      enterpriseName: "",
      loading1: true,
      loading2: true,
      loading3: true,
      loading4: false,
      echartDom: {
        middleEchart1: null,
        middleEchart2: null,
        bottomEchart: null,
        bottomEchart1: null
      },
      ageData: {
        qing: 0,
        zhong: 0,
        lao: 0
      },
      props: {
        children: "children",
        label: "title",
        value: "id"
      },
      node: {} //选中的记录
    };
  },
  methods: {
    setEchart() {
      let data = [];
      let bottomEchart = echarts.init(document.getElementById("bottomEchart"));
      bottomEchart.setOption(echartJs.bottomOption1(data));
    //点击节点
    handleNodeClick(data) {
      this.node = data;
      this.value1 = data.id;
      this.$refs.treeForm.blur();
      this.getCompanys();
    },
    setAgeEchart() {
      this.loading4 = true;
      let params = {
        jurisdiction: this.value1,
        deptid: this.value2
      };
      selectAge(params).then(res => {
        if (res.data.code === 200) {
          if (!this.echartDom.bottomEchart1) {
            this.echartDom.bottomEchart1 = echarts.init(
              document.getElementById("bottomEchart1")
            );
          }
          this.echartDom.bottomEchart1.setOption(
            echartJs.bottomOption2(res.data.data)
          );
          this.ageData.qing = res.data.data.qcount;
          this.ageData.zhong = res.data.data.zcount;
          this.ageData.lao = res.data.data.lcount;
        } else {
          this.$message.error(res.data.msg);
        }
        this.loading4 = false;
      });
    },
    toOperationTable() {
      this.$router.push({ path: "/securityUnitOperation/operationTable" });
      this.$router.push({
        path:
          "/securityUnitOperation/operationTable?jurisdiction=" +
          this.value2 +
          "&enterpriseName=" +
          this.enterpriseName +
          "&jurisdiction1=" +
          this.value1
      });
    },
    getFenju() {
      this.options1 = [];
      this.value1 = "";
      lazyTreeJu().then(res => {
      this.node = {};
      lazyTrees().then(res => {
        if (res.data.code === 200) {
          this.options1 = res.data.data;
          this.value1 = this.options1[0] ? this.options1[0].id : "";
          this.node = this.options1[0];
          this.getCompanys();
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    fenjuChange() {
      this.getCompanys();
    },

    getCompanys() {
      getCompanys({ jurisdiction: this.value1 }).then(res => {
        if (res.data.code === 200) {
          this.options2 = res.data.data;
          this.value2 = this.options2[0] ? this.options2[0].departmentid : "";
          this.enterpriseName = this.options2[0]
            ? this.options2[0].enterpriseName
            : "";
          this.changeCompanys();
        }
      });
@@ -223,31 +322,53 @@
      });
    },
    getQueryYearKh() {
      this.loading2 = true;
      let params = {
        jurisdiction: this.value1,
        deptid: this.value2
      };
      queryYearKh(params).then(res => {
        if (res.data.code === 200) {
          let middleEchart2 = echarts.init(
            document.getElementById("middleEchart2")
          if (!this.echartDom.middleEchart2) {
            this.echartDom.middleEchart2 = echarts.init(
              document.getElementById("middleEchart2")
            );
          }
          this.echartDom.middleEchart2.setOption(
            echartJs.middleOption2(res.data.data)
          );
          middleEchart2.setOption(echartJs.middleOption2(res.data.data));
        }
        this.loading2 = false;
      });
    },
    getQueryYearG() {
      this.loading1 = true;
      this.loading3 = true;
      let params = {
        jurisdiction: this.value1,
        deptid: this.value2
      };
      queryYearG().then(res => {
      queryYearG(params).then(res => {
        if (res.data.code === 200) {
          let middleEchart1 = echarts.init(
            document.getElementById("middleEchart1")
          if (!this.echartDom.middleEchart1) {
            this.echartDom.middleEchart1 = echarts.init(
              document.getElementById("middleEchart1")
            );
          }
          this.echartDom.middleEchart1.setOption(
            echartJs.middleOption1(res.data.data)
          );
          middleEchart1.setOption(echartJs.middleOption1(res.data.data));
          if (!this.echartDom.bottomEchart) {
            this.echartDom.bottomEchart = echarts.init(
              document.getElementById("bottomEchart")
            );
          }
          this.echartDom.bottomEchart.setOption(
            echartJs.bottomOption1(res.data.data)
          );
        }
        this.loading3 = false;
        this.loading1 = false;
      });
    },
    // 清空之前的查询结果
@@ -268,16 +389,26 @@
        baoanPq: 0,
        addbaoanPq: 0
      };
      this.ageData = {
        qing: 0,
        zhong: 0,
        lao: 0
      };
    },
    changeCompanys() {
      this.options2.forEach(item => {
        if (item.departmentid === this.value2) {
          this.enterpriseName = item.enterpriseName;
        }
      });
      this.clear();
      this.getQueryCounts();
      this.getQueryYearKh();
      this.getQueryYearG();
      this.setAgeEchart();
    }
  },
  mounted() {
    this.setEchart();
    this.getFenju();
  }
};
@@ -289,8 +420,9 @@
}
#bottomEchart,
#middleEchart1,
#middleEchart2 {
  height: calc(100% - 40px);
#middleEchart2,
#bottomEchart1 {
  height: calc(100% - 25px);
  width: 100%;
}
.el-row:first-child {
@@ -378,4 +510,102 @@
  margin-top: 15px;
  margin-left: 36px;
}
.leftEchartTitle {
  height: 30px;
  display: flex;
  line-height: 30px;
  margin-top: 10px;
  margin-left: 28px;
  position: absolute;
  .block1 {
    width: 23px;
    height: 13px;
    background: #2ec7c9;
    border-radius: 3px;
    margin-top: 9px;
  }
  span:nth-child(2) {
    color: #fff;
    font-size: 13px;
    margin: 0px 10px 0px 3px;
  }
  span:nth-child(3) {
    color: #2ec7c9;
    font-size: 17px;
    font-weight: 700;
    display: block;
    width: 65px;
    text-align: center;
  }
  span:nth-child(4) {
    font-size: 13px;
    color: #2ec7c9;
  }
}
.leftEchartTitle.qing {
  right: 37px;
  margin-top: 42px;
  .block1 {
    width: 30px;
    height: 15px;
    background: #73c0de;
    margin-top: 7px;
  }
  span:nth-child(2) {
    color: #fff;
    font-size: 13px;
  }
  span:nth-child(3) {
    color: #73c0de;
    font-size: 17px;
  }
  span:nth-child(4) {
    font-size: 13px;
    color: #73c0de;
  }
}
.leftEchartTitle.zhong {
  right: 37px;
  margin-top: 83px;
  .block1 {
    width: 30px;
    height: 15px;
    background: #fac858;
    margin-top: 7px;
  }
  span:nth-child(2) {
    color: #fff;
    font-size: 13px;
  }
  span:nth-child(3) {
    color: #fac858;
    font-size: 17px;
  }
  span:nth-child(4) {
    font-size: 13px;
    color: #fac858;
  }
}
.leftEchartTitle.lao {
  right: 37px;
  margin-top: 125px;
  .block1 {
    width: 30px;
    height: 15px;
    background: #91cc75;
    margin-top: 7px;
  }
  span:nth-child(2) {
    color: #fff;
    font-size: 13px;
  }
  span:nth-child(3) {
    color: #91cc75;
    font-size: 17px;
  }
  span:nth-child(4) {
    font-size: 13px;
    color: #91cc75;
  }
}
</style>

 src/views/securityUnitOperation/operationTable.vue

@@ -2,148 +2,77 @@
  <basic-container>
    <avue-crud
      :option="tableOption"
      :table-loading="loading"
      :data="tableData"
      :page.sync="tablePage"
      :page.sync="page"
      :permission="permissionList"
      :before-open="beforeOpen"
      @date-change="dateChange"
      ref="crud"
      @search-change="searchChange"
      @search-reset="searchReset"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      
    >
    </avue-crud>
  </basic-container>
  <!-- <div class="operation-table">
    <el-row>
      <el-col>
        <span>时间范围：</span>
        <el-date-picker
          v-model="value2"
          type="daterange"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :picker-options="pickerOptions"
        >
        </el-date-picker>
        <span>类别：</span>
        <el-select v-model="typeValue" placeholder="请选择">
          <el-option
            v-for="item in typeOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
        <span>所属辖区：</span>
        <el-select v-model="subofficeValue" placeholder="请选择">
          <el-option
            v-for="item in subofficeOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
        <span>公司名称：</span>
        <el-input v-model="companyName"></el-input>
        <el-button>查询</el-button>
        <el-button>重置</el-button>
      </el-col>
    </el-row>
    <el-row>
      <el-col>
        <div class="table">
          <el-button @click="downExcel">下载</el-button>
          <el-table id="table" :data="tableData" style="width: 100%">
            <el-table-column type="index" label="序号" width="50">
            </el-table-column>
            <el-table-column prop="company" label="公司名称" width="180">
            </el-table-column>
            <el-table-column prop="subOffice" label="所属分局" width="180">
            </el-table-column>
            <el-table-column prop="time" label="时间"> </el-table-column>
            <el-table-column prop="totalSec" label="总保安人数">
            </el-table-column>
            <el-table-column prop="normalSec" label="正常保安数">
            </el-table-column>
            <el-table-column prop="holderSec" label="持证保安数">
            </el-table-column>
            <el-table-column prop="sendSec" label="保安派遣数">
            </el-table-column>
            <el-table-column prop="passSec" label="过考保安数">
            </el-table-column>
            <el-table-column prop="unit" label="服务单位数"> </el-table-column>
            <el-table-column prop="socialSec" label="缴纳社保保安数">
            </el-table-column>
            <el-table-column prop="bz" label="备注"> </el-table-column>
          </el-table>
          <el-pagination
            background
            layout="prev, pager, next"
            :total="tableData.length"
          >
          </el-pagination>
        </div>
      </el-col>
    </el-row>
  </div> -->
</template>
<script>
import FileSaver from "file-saver";
import XLSX from "xlsx";
import { selectTb } from "../../api/securityUnitOperation/securityUnitOperation";
import { lazyTreeJu,lazyTrees } from "../../api/index/index";
export default {
  name: "公司运营情况智能分析详情表",
  data() {
    return {
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      query:{},
      value1: "",
      value2: "",
      tableData: [
        {
          company: "江西省永安保安服务有限公司",
          subOffice: "南昌市公安局",
          time: "2020-07-21",
          totalSec: "1200",
          normalSec: "1150",
          holderSec: "1160",
          sendSec: "1000",
          passSec: "1180",
          unit: "52",
          socialSec: "1160",
          bz: "",
        },
        {
          company: "南昌市赣水保安服务有限公司",
          subOffice: "东湖分局",
          time: "2021-06-11",
          totalSec: "1360",
          normalSec: "1250",
          holderSec: "1258",
          sendSec: "1210",
          passSec: "1180",
          unit: "48",
          socialSec: "1200",
          bz: "",
        },
        {
          company: "江西中业兴达保安服务有限公司",
          subOffice: "西湖分局",
          time: "2020-01-21",
          totalSec: "1269",
          normalSec: "1250",
          holderSec: "1042",
          sendSec: "1040",
          passSec: "1180",
          unit: "41",
          socialSec: "1025",
          bz: "",
        },
        // {
        //   company: "江西省永安保安服务有限公司",
        //   subOffice: "南昌市公安局",
        //   time: "2020-07-21",
        //   totalSec: "1200",
        //   normalSec: "1150",
        //   holderSec: "1160",
        //   sendSec: "1000",
        //   passSec: "1180",
        //   unit: "52",
        //   socialSec: "1160",
        //   bz: ""
        // },
        // {
        //   company: "南昌市赣水保安服务有限公司",
        //   subOffice: "东湖分局",
        //   time: "2021-06-11",
        //   totalSec: "1360",
        //   normalSec: "1250",
        //   holderSec: "1258",
        //   sendSec: "1210",
        //   passSec: "1180",
        //   unit: "48",
        //   socialSec: "1200",
        //   bz: ""
        // },
        // {
        //   company: "江西中业兴达保安服务有限公司",
        //   subOffice: "西湖分局",
        //   time: "2020-01-21",
        //   totalSec: "1269",
        //   normalSec: "1250",
        //   holderSec: "1042",
        //   sendSec: "1040",
        //   passSec: "1180",
        //   unit: "41",
        //   socialSec: "1025",
        //   bz: ""
        // }
      ],
      tablePage: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      tableOption: {
        excelBtn: true,
        delBtn: false,
@@ -163,193 +92,222 @@
        viewBtn: true,
        dialogClickModal: false,
        column: [
          {
            label: "类别",
            hide: true,
            prop: "",
            search: true,
            searchSpan: 4,
            display: true,
            type: "select",
            props: {
              label: "label",
              value: "value",
            },
            // cascaderItem: ["city", "area"],
            // dicUrl:subofficeOptions,
            dicData: [
              {
                value: "0",
                label: "全部",
              },
              {
                value: "1",
                label: "总保安人数",
              },
              {
                value: "2",
                label: "正常保安数",
              },
              {
                value: "3",
                label: "持证保安数",
              },
              {
                value: "4",
                label: "保安派遣数",
              },
              {
                value: "5",
                label: "过考保安数",
              },
              {
                value: "6",
                label: "服务单位数",
              },
              {
                value: "7",
                label: "缴纳社保保安数",
              },
            ],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择类别",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "类别",
          //   hide: true,
          //   prop: "",
          //   search: true,
          //   searchSpan: 4,
          //   display: true,
          //   type: "select",
          //   props: {
          //     label: "label",
          //     value: "value"
          //   },
          //   // cascaderItem: ["city", "area"],
          //   // dicUrl:subofficeOptions,
          //   dicData: [
          //     {
          //       value: "0",
          //       label: "全部"
          //     },
          //     {
          //       value: "1",
          //       label: "总保安人数"
          //     },
          //     {
          //       value: "2",
          //       label: "正常保安数"
          //     },
          //     {
          //       value: "3",
          //       label: "持证保安数"
          //     },
          //     {
          //       value: "4",
          //       label: "保安派遣数"
          //     },
          //     {
          //       value: "5",
          //       label: "过考保安数"
          //     },
          //     {
          //       value: "6",
          //       label: "服务单位数"
          //     },
          //     {
          //       value: "7",
          //       label: "缴纳社保保安数"
          //     }
          //   ],
          //   rules: [
          //     {
          //       required: true,
          //       message: "请选择类别",
          //       trigger: "blur"
          //     }
          //   ]
          // },
          {
            label: "公司名称",
            prop: "company",
            prop: "enterpriseName",
            search: true,
            searchSpan: 4,
            display: false,
            width:300,
            display: false
          },
          {
            label: "所属辖区",
            prop: "subOffice",
            prop: "jurisdiction",
            searchSpan: 4,
            type: "select",
            props: {
              label: "label",
              value: "value",
            },
            // cascaderItem: ["city", "area"],
            // dicUrl:subofficeOptions,
            dicData: [
              {
                value: "0",
                label: "南昌市公安局",
              },
              {
                value: "2",
                label: "东湖分局",
              },
              {
                value: "3",
                label: "西湖分局",
              },
              {
                value: "4",
                label: "青云谱分局",
              },
              {
                value: "5",
                label: "青山湖分局",
              },
            ],
            // dicUrl: "/api/information/lazyTreeJu",
            // dicMethod:'post',
            props: {
              label: "title",
              value: "id"
            },
            dicData: [],
            search: true,
            // overHidden: true,
            type: "tree",
            rules: [
              {
                required: true,
                message: "请选择所属辖区",
                trigger: "blur",
              },
            ],
                trigger: "blur"
              }
            ]
          },
          {
            label: "时间",
            prop: "time",
            type: "date",
            format: "yyyy-MM-dd hh:mm:ss",
            valueFormat: "yyyy-MM-dd hh:mm:ss",
            searchSpan: 6,
            searchRange: true,
            search: true,
            display: false,
          },
          // {
          //   label: "时间",
          //   prop: "time",
          //   type: "date",
          //   format: "yyyy-MM-dd hh:mm:ss",
          //   valueFormat: "yyyy-MM-dd hh:mm:ss",
          //   searchSpan: 6,
          //   searchRange: true,
          //   search: true,
          //   display: false
          // },

          {
            label: "总保安人数",
            prop: "totalSec",
            display: false,
            prop: "znum",
            display: false
          },
          {
            label: "正常保安数",
            prop: "normalSec",
            display: false,
            prop: "zcnum",
            display: false
          },
          {
            label: "持证保安数",
            prop: "holderSec",
            display: false,
            prop: "cznum",
            display: false
          },
          {
            label: "保安派遣数",
            prop: "sendSec",
            display: false,
            prop: "pcnum",
            display: false
          },
          {
            label: "过考保安数",
            prop: "passSec",
            display: false,
          },
          // {
          //   label: "过考保安数",
          //   prop: "passSec",
          //   display: false
          // },
          {
            label: "服务单位数",
            prop: "unit",
            display: false,
            prop: "ghnum",
            display: false
          },
          {
            label: "缴纳社保保安数",
            prop: "socialSec",
            display: false,
            prop: "sbnum",
            display: false
          },
          {
            label: "备注",
            prop: "bz",
            display: false,
          },
        ],
            display: false
          }
        ]
      },
      typeValue: "0",
      subofficeValue: "0",
      companyName: "",
      subOfficeData: [],
      subOfficeValue: "",
      loading: true
    };
  },
  methods: {
    downExcel() {
      let et = XLSX.utils.table_to_book(document.getElementById("table"));
      let etout = XLSX.write(et, {
        bookType: "xlsx",
        bookSST: true,
        type: "array",
      });
      try {
        FileSaver.saveAs(
          new Blob([etout], {
            type: "application/octet-stream",
          }),
          `表.xlsx`
        ); //导出的文件名
      } catch (e) {
        console.log(e, etout);
      }
      return etout;
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },

    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
      this.onLoad(this.page, this.query)
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
      this.onLoad(this.page, this.query)
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      let param = {};
      param["jurisdiction"] = params["jurisdiction"] || "";
      param["enterpriseName"] = params["enterpriseName"] || "";
      param["current"] = page.currentPage;
      param["size"] = page.pageSize;
      selectTb(param).then(res => {
        const data = res.data.data;
        this.page.total = data.total;
        this.tableData = data.records;
        this.loading = false;
      });
    },
    getSubOfficeData() {
      lazyTrees().then(res => {
        if (res.data.code === 200) {
          this.tableOption.column.forEach(item => {
            if (item.label == "所属辖区") {
              item.dicData = res.data.data;
            }
          });
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    getLocationParams() {
      let url = window.location.href;
      let urlArr = url.split("?")[1].split("&");
      var object = new Object();
      for (var i = 0; i < urlArr.length; i++) {
        let mm = urlArr[i].split("=");
        object[decodeURIComponent(mm[0])] = decodeURIComponent(mm[1]);
      }
      let jurisdiction = object["jurisdiction1"] || "";
      let enterpriseName = object["enterpriseName"] || "";
      this.query = { jurisdiction: jurisdiction, enterpriseName: enterpriseName };
      this.onLoad(this.page, this.query);
    }
  },
  mounted() {},
  mounted() {
    this.getLocationParams();
    this.getSubOfficeData();
  }
};
</script>
<style lang="scss" scoped>

 src/views/securityUnitOperation/securityEchart.js

@@ -1,7 +1,7 @@
function bottomOption(alldata) {
  let data = [];
  for (var i in alldata) {
    data.push(alldata[i])
    data.push(alldata[i]);
  }
  let option = {
    // title: {
@@ -26,15 +26,15 @@
      "#96dee8"
    ],
    grid: {
      top: "10%",
      top: "15%",
      left: "3%",
      right: "4%",
      bottom: "15%",
      bottom: "0%",
      containLabel: true
    },
    legend: {
      data: ["趋势"],
      bottom: "0%",
      data: ["服务客户数量"],
      top: "0%",
      textStyle: {
        color: "#fff"
      }
@@ -47,7 +47,7 @@
      // borderColor: "gray", //设置边框颜色
      textStyle: {
        color: "#fff" //设置文字颜色
      },
      }
    },
    xAxis: {
      type: "category",
@@ -71,7 +71,6 @@
      ]
    },
    yAxis: {
      name: "（元）",
      type: "value",
      axisLabel: {
        color: "#fff"
@@ -79,7 +78,7 @@
    },
    series: [
      {
        name: "趋势",
        name: "服务对象数量",
        data: data,
        type: "line",
        smooth: true,
@@ -90,7 +89,22 @@
  return option;
}
function bottomOption1(alldata) {

  let baoan = [];
  let chiz = [];
  let paiq = [];
  alldata.forEach(item => {
    for (var i in item) {
      for (var j in item[i]) {
        if (i === "baoan") {
          baoan.push(item[i][j]);
        } else if (i === "chiz") {
          chiz.push(item[i][j]);
        } else if (i === "paiq") {
          paiq.push(item[i][j]);
        }
      }
    }
  });
  let option = {
    // title: {
    //   text: "公司运营趋势",
@@ -100,7 +114,6 @@
    // },
    color: [
      "#73c0de",

      "#fac858",
      "#91cc75",
      "#3ba272",
@@ -114,28 +127,28 @@
      "#96dee8"
    ],
    grid: {
      top: "10%",
      top: "15%",
      left: "3%",
      right: "4%",
      bottom: "15%",
      bottom: "0%",
      containLabel: true
    },
    legend: {
      data: ["趋势"],
      bottom: "0%",
      data: ["保安员数量", "派遣数量", "持证数量"],
      top: "0%",
      textStyle: {
        color: "#fff"
      }
    },
    tooltip: {
      trigger: "item",
      trigger: "axis",
      backgroundColor: "#031952",
      color: "#fff",
      borderWidth: "0", //边框宽度设置1
      // borderColor: "gray", //设置边框颜色
      textStyle: {
        color: "#fff" //设置文字颜色
      },
      }
    },
    xAxis: {
      type: "category",
@@ -159,7 +172,7 @@
      ]
    },
    yAxis: {
      name: "（元）",
      // name: "（元）",
      type: "value",
      axisLabel: {
        color: "#fff"
@@ -167,11 +180,22 @@
    },
    series: [
      {
        name: "趋势",
        data: [10,20,14,15,16,17,24,15,3,7,11,23],
        name: "保安员数量",
        type: "line",
        smooth: true,
        areaStyle: {}
        stack: "总量",
        data: baoan
      },
      {
        name: "派遣数量",
        type: "line",
        stack: "总量",
        data: paiq
      },
      {
        name: "持证数量",
        type: "line",
        stack: "总量",
        data: chiz
      }
    ]
  };
@@ -186,23 +210,20 @@
  alldata.forEach(item => {
    for (var i in item) {
      for (var j in item[i]) {
        if (i === 'baoan') {
          baoan.push(item[i][j])
        } else if (i === 'zc') {
          zc.push(item[i][j])
        }
        else if (i === 'chiz') {
          chiz.push(item[i][j])
        }
        else if (i === 'sheb') {
          sheb.push(item[i][j])
        }
        else if (i === 'paiq') {
          paiq.push(item[i][j])
        if (i === "baoan") {
          baoan.push(item[i][j]);
        } else if (i === "zc") {
          zc.push(item[i][j]);
        } else if (i === "chiz") {
          chiz.push(item[i][j]);
        } else if (i === "sheb") {
          sheb.push(item[i][j]);
        } else if (i === "paiq") {
          paiq.push(item[i][j]);
        }
      }
    }
  })
  });
  let option = {
    // title: {
    //   text: "公司保安类数据对比",
@@ -218,7 +239,7 @@
      // borderColor: "gray", //设置边框颜色
      textStyle: {
        color: "#fff" //设置文字颜色
      },
      }
    },
    legend: {
      data: [
@@ -302,12 +323,12 @@
        barWidth: 9,
        data: chiz
      },
      {
        name: "过考保安数",
        type: "bar",
        barWidth: 9,
        data: []
      },
      // {
      //   name: "过考保安数",
      //   type: "bar",
      //   barWidth: 9,
      //   data: []
      // },
      {
        name: "缴纳社保保安数",
        type: "bar",
@@ -327,7 +348,7 @@
function middleOption2(alldata) {
  let data = [];
  for (var i in alldata) {
    data.push(alldata[i])
    data.push(alldata[i]);
  }
  let option = {
    // title: {
@@ -347,7 +368,7 @@
      // borderColor: "gray", //设置边框颜色
      textStyle: {
        color: "#fff" //设置文字颜色
      },
      }
    },
    legend: {
      data: ["客户数"],
@@ -417,11 +438,97 @@
  };
  return option;
}
function bottomOption2(alldata) {
  let data = [];
  for (var key in alldata) {
    let obj = null;
    if (key === "lcount") {
      obj = {
        name: "老年",
        value: alldata[key]
      };
    } else if (key === "zcount") {
      obj = {
        name: "中年",
        value: alldata[key]
      };
    }
    else if (key === "qcount") {
      obj = {
        name: "青年",
        value: alldata[key]
      };
    }
    data.push(obj);
  }
  let option = {
    tooltip: {
      trigger: "item",
      formatter: "{a}<br>{b}:{c}({d}%)",
      axisPointer: {
        type: "shadow"
      },
      backgroundColor: "#031952", //设置背景图片 rgba格式
      color: "#fff",
      borderWidth: "0", //边框宽度设置1
      // borderColor: "gray", //设置边框颜色
      textStyle: {
        color: "#fff" //设置文字颜色
      }
    },
    // legend: {
    //   data: ["青年", "中年", "老年"],
    //   top: "0%",
    //   itemHeight: 10,
    //   textStyle: {
    //     color: "#fff"
    //   }
    // },
    color: [
      "#73c0de",
      "#fac858",
      "#91cc75",
      "#3ba272",
      "#fc8452",
      "#9a60b4",
      "#3fb1e3",
      "#6be6c1",
      "#626c91",
      "#a0a7e6",
      "#c4ebad",
      "#96dee8"
    ],
    grid: {
      top: "10%",
      left: "5%",
      right: "30%",
      bottom: "4%",
      containLabel: true
    },
    series: [
      {
        name: "年龄结构",
        type: "pie",
        center: ["33%", "50%"],
        radius: "70%",
        data:data,
        label: {
          color: "#fff"
        }
      }
    ]
  };
  return option;
}

function economicMiddle(data) {
  let data1 = [];
  for (var a in data) {
    data1.push(data[a])
function economicMiddle(data1, data2) {
  let sbData = [];
  let pqData = [];
  for (var a in data1) {
    sbData.push(data1[a]);
  }
  for (var b in data2) {
    pqData.push(data2[b]);
  }
  let option = {
    tooltip: {
@@ -432,7 +539,7 @@
      // borderColor: "gray", //设置边框颜色
      textStyle: {
        color: "#fff" //设置文字颜色
      },
      }
    },
    legend: {
      data: ["缴纳社保人数", "公司派遣人数"],
@@ -495,20 +602,19 @@
        name: "缴纳社保人数",
        type: "line",
        stack: "总量",
        data: data1
        data: sbData
      },
      {
        name: "公司派遣人数",
        type: "line",
        stack: "总量",
        data: [220, 182, 191, 234, 290, 330, 310, 111, 222, 132, 143, 123]
        data: pqData
      }
    ]
  };
  return option;
}
function economicPieOption(allData) {

  let title = "总";
  let total = Number(allData.PCount) + Number(allData.WPCount);
  let option = {
@@ -542,7 +648,7 @@
      // borderColor: "gray", //设置边框颜色
      textStyle: {
        color: "#fff" //设置文字颜色
      },
      }
    },
    legend: {
      bottom: "0%",
@@ -572,9 +678,12 @@
        name: "人员分布",
        type: "pie",
        radius: ["40%", "70%"],
        label: {
          color: "#fff"
        },
        data: [
          { value: allData.PCount, name: "已派遣人数" },
          { value: allData.WPCount, name: "未派遣人" }
          { value: allData.WPCount, name: "未派遣人数" }
        ]
      }
    ]
@@ -588,5 +697,6 @@
  middleOption1,
  middleOption2,
  economicMiddle,
  economicPieOption
  economicPieOption,
  bottomOption2
};

 src/views/statisticalQueryManagement/businessStatistics.vue

@@ -2,12 +2,22 @@
  <basic-container>
    <avue-crud
      :option="tableOption"
      :table-loading="loading"
      :data="tableData"
      :page.sync="tablePage"
      :page.sync="page"
      :permission="permissionList"
      :before-open="beforeOpen"
      @date-change="dateChange"
      @row-click="handleRowClick"
      ref="crud"
      @row-update="rowUpdates"
      @row-save="rowSave"
      @search-change="searchChange"
      @search-reset="searchReset"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
      @cell-click="handleRowClick"
      :cell-style="cellStyle"
      class="businessStatisticsStyle"
    >
    </avue-crud>
  </basic-container>
@@ -16,37 +26,42 @@
import FileSaver from "file-saver";
import XLSX from "xlsx";
import { mapGetters } from "vuex";
import {
  selectYw,
  dictionaryList
} from "../../api/statisticalQueryManagement/statisticalQueryManagement";
import { lazyTreeJu,lazyTrees } from "../../api/index/index";
export default {
  name: "业务情况统计",
  data() {
    return {
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      value1: "",
      value2: "",
      tableData: [
        {
          company: "江西省永安保安服务有限公司",
          subOffice: "南昌市公安局",
          customer: "76",
          num: "1124",
        },
        {
          company: "南昌市赣水保安服务有限公司",
          subOffice: "东湖分局",
          customer: "85",
          num: "1428",
        },
        {
          company: "江西中业兴达保安服务有限公司",
          subOffice: "西湖分局",
          customer: "46",
          num: "974",
        },
        // {
        //   company: "江西省永安保安服务有限公司",
        //   subOffice: "南昌市公安局",
        //   customer: "76",
        //   num: "1124"
        // },
        // {
        //   company: "南昌市赣水保安服务有限公司",
        //   subOffice: "东湖分局",
        //   customer: "85",
        //   num: "1428"
        // },
        // {
        //   company: "江西中业兴达保安服务有限公司",
        //   subOffice: "西湖分局",
        //   customer: "46",
        //   num: "974"
        // }
      ],
      tablePage: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      tableOption: {
        excelBtn: true,
        delBtn: false,
@@ -68,66 +83,56 @@
        column: [
          {
            label: "公司名称",
            prop: "company",
            prop: "enterpriseName",
            search: true,
            searchSpan: 4,
            display: false
          },
          {
            label: "单位类型",
            prop: "stats",
            search: true,
            searchSpan: 4,
            display: false,
          },

          {
            label: "所属辖区",
            prop: "subOffice",
            searchSpan: 4,
            type: "select",
            props: {
              label: "label",
              value: "value",
              label: "dictValue",
              value: "dictKey"
            },
            // cascaderItem: ["city", "area"],
            // dicUrl:subofficeOptions,
            dicData: [
              {
                value: "0",
                label: "南昌市公安局",
              },
              {
                value: "2",
                label: "东湖分局",
              },
              {
                value: "3",
                label: "西湖分局",
              },
              {
                value: "4",
                label: "青云谱分局",
              },
              {
                value: "5",
                label: "青山湖分局",
              },
            ],
            dicData: []
          },
          {
            label: "所属辖区",
            prop: "jurname",
            searchSpan: 4,
            type: "tree",
            props: {
              label: "title",
              value: "id"
            },
            dicData: [],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择所属辖区",
                trigger: "blur",
              },
            ],
                trigger: "blur"
              }
            ]
          },
          {
            label: "服务对象数量",
            prop: "customer",
            display: false,
            prop: "fwnum",
            display: false
          },
          {
            label: "保安员人数",
            prop: "num",
            display: false,
          },
        ],
            prop: "znum",
            display: false
          }
        ]
      },
      loading: true
    };
  },
  computed: {
@@ -137,37 +142,101 @@
        addBtn: this.vaildData(this.permission.post_add, false),
        viewBtn: this.vaildData(this.permission.post_view, false),
        delBtn: this.vaildData(this.permission.post_delete, false),
        editBtn: this.vaildData(this.permission.post_edit, false),
        editBtn: this.vaildData(this.permission.post_edit, false)
      };
    },
    }
  },
  methods: {
    handleRowClick(row, event, column) {
      this.$router.push({ path: "/statisticalQueryManagement/businessStatisticsDetail" });
    getSubOfficeData() {
      lazyTrees().then(res => {
        if (res.data.code === 200) {
          this.tableOption.column.forEach(item => {
            if (item.label == "所属辖区") {
              item.dicData = res.data.data;
            }
          });
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    dateChange() {},
    // downExcel() {
    //   let et = XLSX.utils.table_to_book(document.getElementById("table"));
    //   let etout = XLSX.write(et, {
    //     bookType: "xlsx",
    //     bookSST: true,
    //     type: "array"
    //   });
    //   try {
    //     FileSaver.saveAs(
    //       new Blob([etout], {
    //         type: "application/octet-stream"
    //       }),
    //       `表.xlsx`
    //     ); //导出的文件名
    //   } catch (e) {
    //     console.log(e, etout);
    //   }
    //   return etout;
    // }
    getDictionaryList() {
      dictionaryList().then(res => {
        if (res.data.code === 200) {
          this.tableOption.column.forEach(item => {
            if (item.label == "单位类型") {
              item.dicData = res.data.data;
            }
          });
        }
      });
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },

    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
      this.onLoad(this.page, this.query);
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
      this.onLoad(this.page, this.query);
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      let param = {};
      param["jurisdiction"] = params["jurname"] || "";
      param["deptid"] = params["enterpriseName"] || "";
      param["stats"] = params["stats"] || "";
      param["current"] = page.currentPage;
      param["size"] = page.pageSize;
      selectYw(param).then(res => {
        const data = res.data.data;
        this.page.total = data.total;
        this.tableData = data.records;
        this.loading = false;
      });
    },
    handleRowClick(row, column, cell, event) {
      if (column.label == "服务对象数量") {
        this.$router.push({
          path:
            "/statisticalQueryManagement/businessStatisticsDetail?&departmentid=" +
            row.departmentid
        });
      } else if (column.label == "保安员人数") {
        this.$router.push({
          path:
            "/statisticalQueryManagement/securityGuardDetail?departmentid=" +
            row.departmentid
        });
      }
    },
    cellStyle(row, column, rowIndex, columnIndex) {
      // if (columnIndex == 4 || columnIndex == 5) {
      // }
    }
  },
  mounted() {},
  mounted() {
    this.getSubOfficeData();
    this.getDictionaryList();
  }
};
</script>
<style lang="scss" scoped>
/deep/ .businessStatisticsStyle .el-table__row:hover td:nth-child(7),
/deep/ .businessStatisticsStyle .el-table__row:hover td:nth-child(6) {
  cursor: pointer !important;
}
</style>

 src/views/statisticalQueryManagement/businessStatisticsDetail.vue

@@ -2,61 +2,78 @@
  <basic-container>
    <avue-crud
      :option="tableOption"
      :table-loading="loading"
      :data="tableData"
      :page.sync="tablePage"
      :page.sync="page"
      :permission="permissionList"
      :before-open="beforeOpen"
      @date-change="dateChange"
      ref="crud"
      @row-update="rowUpdates"
      @row-save="rowSave"
      @search-change="searchChange"
      @search-reset="searchReset"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
    >
    </avue-crud>
  </basic-container>
</template>
<script>
// import FileSaver from "file-saver";
// import XLSX from "xlsx";
import { mapGetters } from "vuex";
import {
  selectDis,
  selectFw,
  fwList
} from "../../api/statisticalQueryManagement/statisticalQueryManagement";
import { lazyTreeJu,lazyTrees } from "../../api/index/index";
export default {
  name: "业务情况统计",
  name: "业务情况统计明细",
  data() {
    return {
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      query: {},
      value1: "",
      value2: "",
      tableData: [
        {
          company: "江西省永安保安服务有限公司",
          subOffice: "南昌市公安局",
          timeStart:'2020-07-14',
          timeEnd:'2021-06-30',
          customerName: "南昌市幼儿园",
          num: "7",
          // status: "正在服务",
          bz:'',
        },
        {
          company: "南昌市赣水保安服务有限公司",
          subOffice: "东湖分局",
          timeStart:'2020-01-23',
          timeEnd:'2020-12-31',
          customerName: "南昌市第一人民医院",
          num: "32",
          // status: "已完成",
          bz:'',
        },
        {
          company: "江西中业兴达保安服务有限公司",
          subOffice: "西湖分局",
          timeStart:'2020-03-16',
          timeEnd:'2021-7-29',
          customerName: "南昌市动物园",
          num: "12",
          // status: "未下单",
          bz:'',
        },
        // {
        //   company: "江西省永安保安服务有限公司",
        //   subOffice: "南昌市公安局",
        //   timeStart: "2020-07-14",
        //   timeEnd: "2021-06-30",
        //   customerName: "南昌市幼儿园",
        //   num: "7",
        //   // status: "正在服务",
        //   bz: ""
        // },
        // {
        //   company: "南昌市赣水保安服务有限公司",
        //   subOffice: "东湖分局",
        //   timeStart: "2020-01-23",
        //   timeEnd: "2020-12-31",
        //   customerName: "南昌市第一人民医院",
        //   num: "32",
        //   // status: "已完成",
        //   bz: ""
        // },
        // {
        //   company: "江西中业兴达保安服务有限公司",
        //   subOffice: "西湖分局",
        //   timeStart: "2020-03-16",
        //   timeEnd: "2021-7-29",
        //   customerName: "南昌市动物园",
        //   num: "12",
        //   // status: "未下单",
        //   bz: ""
        // }
      ],
      tablePage: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
        total: 0
      },
      tableOption: {
        excelBtn: true,
@@ -77,167 +94,138 @@
        viewBtn: true,
        dialogClickModal: false,
        column: [
          {
            label: "公司名称",
            prop: "company",
            search: true,
            searchSpan: 4,
            display: false,
          },

          {
            label: "所属辖区",
            prop: "subOffice",
            searchSpan: 4,
            type: "select",
            props: {
              label: "label",
              value: "value",
            },
            // cascaderItem: ["city", "area"],
            // dicUrl:subofficeOptions,
            dicData: [
              {
                value: "0",
                label: "南昌市公安局",
              },
              {
                value: "2",
                label: "东湖分局",
              },
              {
                value: "3",
                label: "西湖分局",
              },
              {
                value: "4",
                label: "青云谱分局",
              },
              {
                value: "5",
                label: "青山湖分局",
              },
            ],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择所属辖区",
                trigger: "blur",
              },
            ],
          },
          {
            label: "服务开始时间",
            prop: "timeStart",
            display: false,
          },
          {
            label: "服务到期时间",
            prop: "timeEnd",
            display: false,
          },
          {
            label: "服务单位名称",
            prop: "customerName",
            searchLabelWidth: 110,
            search: true,
            searchSpan: 4,
            display: false,
          },
          {
            label: "保安派遣人数",
            prop: "num",
            display: false,
          },
          {
            label: "备注",
            prop: "bz",
            display: false,
          },
          // {
          //   label: "服务状态",
          //   prop: "status",
          //   label: "公司名称",
          //   prop: "gsname",
          //   // search: true,
          //   // searchSpan: 4,
          //   display: false
          // },

          // {
          //   label: "所属辖区",
          //   prop: "jurname",
          //   searchSpan: 4,
          //   type: "select",
          //   props: {
          //     label: "label",
          //     value: "value",
          //     label: "title",
          //     value: "id"
          //   },
          //   // cascaderItem: ["city", "area"],
          //   // dicUrl:subofficeOptions,
          //   dicData: [
          //     {
          //       value: "0",
          //       label: "已完成",
          //     },
          //     {
          //       value: "2",
          //       label: "正在服务",
          //     },
          //     {
          //       value: "3",
          //       label: "未下单",
          //     },
          //   ],
          //   dicData: [],
          //   search: true,
          //   type: "tree",
          //   rules: [
          //     {
          //       required: true,
          //       message: "请选择服务状态",
          //       trigger: "blur",
          //     },
          //   ],
          //       message: "请选择所属辖区",
          //       trigger: "blur"
          //     }
          //   ]
          // },
        ],
          {
            label: "服务单位名称",
            prop: "name",
            props: {
              label: "name",
              value: "id"
            },
            dicData: [],
            searchLabelWidth: 110,
            search: true,
            type: "tree",
            searchSpan: 4,
            rules: [
              {
                required: true,
                message: "请选择服务单位",
                trigger: "blur"
              }
            ]
            // display: false
          },
          {
            label: "服务开始时间",
            prop: "startTime",
            display: false
          },
          {
            label: "服务到期时间",
            prop: "endTime",
            display: false
          },
          // {
          //   label: "保安派遣人数",
          //   prop: "num",
          //   display: false
          // },
          {
            label: "联系人",
            prop: "linkman",
            display: false
          },
          {
            label: "联系电话",
            prop: "phone",
            display: false
          }
          // {
          //   label: "备注",
          //   prop: "bz",
          //   display: false
          // }
        ]
      },
      typeValue: "0",
      typeOptions: [
        {
          value: "0",
          label: "全部",
          label: "全部"
        },
        {
          value: "1",
          label: "社保缴纳人数",
          label: "社保缴纳人数"
        },
        {
          value: "2",
          label: "社保缴纳总额",
          label: "社保缴纳总额"
        },
        {
          value: "3",
          label: "公司派遣人数",
          label: "公司派遣人数"
        },
        {
          value: "4",
          label: "社保缴纳人数占比",
        },
          label: "社保缴纳人数占比"
        }
      ],
      subofficeValue: "0",
      subofficeOptions: [
        {
          value: "0",
          label: "南昌市公安局",
          label: "南昌市公安局"
        },
        {
          value: "2",
          label: "东湖分局",
          label: "东湖分局"
        },
        {
          value: "3",
          label: "西湖分局",
          label: "西湖分局"
        },
        {
          value: "4",
          label: "青云谱分局",
          label: "青云谱分局"
        },
        {
          value: "5",
          label: "青山湖分局",
        },
          label: "青山湖分局"
        }
      ],
      servicesList: [],
      companyName: "",
      loading: true,
      deptid: ""
    };
  },
  computed: {
@@ -247,34 +235,94 @@
        addBtn: this.vaildData(this.permission.post_add, false),
        viewBtn: this.vaildData(this.permission.post_view, false),
        delBtn: this.vaildData(this.permission.post_delete, false),
        editBtn: this.vaildData(this.permission.post_edit, false),
        editBtn: this.vaildData(this.permission.post_edit, false)
      };
    },
    }
  },
  methods: {
    dateChange() {},
    // downExcel() {
    //   let et = XLSX.utils.table_to_book(document.getElementById("table"));
    //   let etout = XLSX.write(et, {
    //     bookType: "xlsx",
    //     bookSST: true,
    //     type: "array"
    //   });
    //   try {
    //     FileSaver.saveAs(
    //       new Blob([etout], {
    //         type: "application/octet-stream"
    //       }),
    //       `表.xlsx`
    //     ); //导出的文件名
    //   } catch (e) {
    //     console.log(e, etout);
    //   }
    //   return etout;
    // }
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },

    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
      this.onLoad(this.page, this.query);
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
      this.onLoad(this.page, this.query);
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      let param = {};
      // param["jurisdiction"] = params["jurname"] || "";
      param["id"] = params["name"] || "";
      param["deptId"] = this.deptid;
      param["current"] = page.currentPage;
      param["size"] = page.pageSize;
      fwList(param).then(res => {
        const data = res.data.data;
        this.page.total = data.total;
        this.tableData = data.records;
        this.loading = false;
      });
    },
    getFuWuList() {
      selectFw().then(res => {
        if (res.data.code === 200) {
          this.tableOption.column.forEach(item => {
            if (item.label == "服务单位名称") {
              item.dicData = res.data.data;
            }
          });
          // this.servicesList = res.data.data;
        }
      });
    },
    getSubOfficeData() {
      lazyTrees().then(res => {
        if (res.data.code === 200) {
          this.tableOption.column.forEach(item => {
            if (item.label == "所属辖区") {
              item.dicData = res.data.data;
            }
          });
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    getLocationParams() {
      let url = window.location.href;
      let urlArr = url.split("?")[1].split("&");
      var object = new Object();
      for (var i = 0; i < urlArr.length; i++) {
        let mm = urlArr[i].split("=");
        object[decodeURIComponent(mm[0])] = decodeURIComponent(mm[1]);
      }
      this.deptid = object["departmentid"] || "";
      // let jurisdiction = object["jurisdiction"] || "";
      this.query = { deptid: this.deptid };
      // this.onLoad(this.page, obj);
      this.onLoad(this.page, this.query);
    }
  },
  mounted() {},
  mounted() {
    // this.getTableData();
    this.getFuWuList();
    this.getSubOfficeData();
    this.getLocationParams();
  }
};
</script>
<style lang="scss" scoped>
</style>
<style lang="scss" scoped></style>

 src/views/statisticalQueryManagement/companyDetails.vue

@@ -2,11 +2,16 @@
  <basic-container>
    <avue-crud
      :option="tableOption"
      :table-loading="loading"
      :data="tableData"
      :page.sync="tablePage"
      :page.sync="page"
      :permission="permissionList"
      :before-open="beforeOpen"
      @date-change="dateChange"
      ref="crud"
      @search-change="searchChange"
      @search-reset="searchReset"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
    >
    </avue-crud>
  </basic-container>
@@ -15,55 +20,57 @@
import FileSaver from "file-saver";
import XLSX from "xlsx";
import { mapGetters } from "vuex";
import { selectUIn } from "../../api/statisticalQueryManagement/statisticalQueryManagement";
export default {
  name: "公司人员详情",
  data() {
    return {
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      query: {},
      value1: "",
      value2: "",
      tableData: [
        {
          name: "张强",
          No: "NO.2143",
          idNumber: "230229187623601221",
          tel: "13728198762",
          holder: "是",
          socialSecurity: "是",
          picture: "是",
          qualification: "通过",
          pass: "是",
          send: "是",
        },
        {
          name: "张强",
          No: "NO.2143",
          idNumber: "230229187623601221",
          tel: "13728198762",
          holder: "是",
          socialSecurity: "是",
          picture: "是",
          qualification: "通过",
          pass: "是",
          send: "是",
        },
        {
          name: "张强",
          No: "NO.2143",
          idNumber: "230229187623601221",
          tel: "13728198762",
          holder: "是",
          socialSecurity: "是",
          picture: "是",
          qualification: "通过",
          pass: "是",
          send: "是",
        },
        // {
        //   name: "张强",
        //   No: "NO.2143",
        //   idNumber: "230229187623601221",
        //   tel: "13728198762",
        //   holder: "是",
        //   socialSecurity: "是",
        //   picture: "是",
        //   qualification: "通过",
        //   pass: "是",
        //   send: "是"
        // },
        // {
        //   name: "张强",
        //   No: "NO.2143",
        //   idNumber: "230229187623601221",
        //   tel: "13728198762",
        //   holder: "是",
        //   socialSecurity: "是",
        //   picture: "是",
        //   qualification: "通过",
        //   pass: "是",
        //   send: "是"
        // },
        // {
        //   name: "张强",
        //   No: "NO.2143",
        //   idNumber: "230229187623601221",
        //   tel: "13728198762",
        //   holder: "是",
        //   socialSecurity: "是",
        //   picture: "是",
        //   qualification: "通过",
        //   pass: "是",
        //   send: "是"
        // }
      ],
      tablePage: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      tableOption: {
        excelBtn: true,
        delBtn: false,
@@ -74,218 +81,233 @@
        // dateBtn: true,
        align: "center",
        height: "auto",
        calcHeight: 90,
        calcHeight: 30,
        tip: false,
        searchShowBtn: false,
        searchShow: true,
        searchMenuSpan: 6,
        searchMenuSpan: 3,
        index: true,
        viewBtn: true,
        dialogClickModal: false,
        column: [
          {
            label: "保安员姓名",
            searchLabelWidth: 110,
            prop: "name",
            label: "保安姓名",
            // searchLabelWidth: 90,
            prop: "real_name",
            search: true,
            searchSpan: 4,
            display: false,
            searchSpan: 3,
            display: false
          },
          {
            label: "所属保安公司",
            prop: "enterpriseName",
            width: 300,
            display: false
          },

          {
            label: "保安员编号",
            prop: "No",
            display: false,
            label: "保安证编号",
            prop: "securitynumber",
            width: 180,
            display: false
          },
          {
            label: "身份证号",
            prop: "idNumber",
            display: false,
            prop: "cardid",
            width: 180,
            display: false
          },
          {
            label: "联系电话",
            prop: "tel",
            display: false,
            label: "联系方式",
            prop: "phone",
            width: 180,
            display: false
          },
          {
            label: "是否持证",
            prop: "holder",
            searchSpan: 4,
            prop: "hold",
            searchSpan: 3,
            type: "select",
            props: {
              label: "label",
              value: "value",
              value: "value"
            },
            // cascaderItem: ["city", "area"],
            // dicUrl:subofficeOptions,
            dicData: [
              {
                value: "0",
                label: "是",
                value: "1",
                label: "是"
              },
              {
                value: "2",
                label: "否",
                label: "否"
              },
              {
                value: "3",
                label: "吊销"
              }
            ],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择是否持证",
                trigger: "blur",
              },
            ],
                trigger: "blur"
              }
            ]
          },
          {
            label: "是否缴纳社保",
            //  labelWidth: 120,
            searchLabelWidth: 110,
            prop: "socialSecurity",
            searchLabelWidth: 100,
            prop: "soil",
            searchSpan: 4,
            type: "select",
            props: {
              label: "label",
              value: "value",
              value: "value"
            },
            dicData: [
              {
                value: "0",
                label: "是",
                label: "是"
              },
              {
                value: "2",
                label: "否",
              },
                value: "1",
                label: "否"
              }
            ],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择是否缴纳社保",
                trigger: "blur",
              },
            ],
                trigger: "blur"
              }
            ]
          },

          {
            label: "是否已采集照片",
            searchLabelWidth: 120,
            prop: "picture",
            prop: "photo",
            searchSpan: 4,
            type: "select",
            props: {
              label: "label",
              value: "value",
              value: "value"
            },
            dicData: [
              {
                value: "0",
                label: "是",
                label: "是"
              },
              {
                value: "2",
                label: "否",
              },
                value: "1",
                label: "否"
              }
            ],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择是否已采集照片",
                trigger: "blur",
              },
            ],
                trigger: "blur"
              }
            ]
          },
          {
            label: "资格审查情况",
            searchLabelWidth: 110,
            prop: "qualification",
            searchLabelWidth: 100,
            prop: "examination_type",
            searchSpan: 4,
            type: "select",
            props: {
              label: "label",
              value: "value",
              value: "value"
            },
            dicData: [
              {
                value: "0",
                label: "通过",
                label: "正常"
              },
              {
                value: "2",
                label: "异常",
              },
                value: "1",
                label: "异常"
              }
            ],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择资格审查情况",
                trigger: "blur",
              },
            ],
                trigger: "blur"
              }
            ]
          },
          {
            label: "是否通过考试",
            searchLabelWidth: 110,
            prop: "pass",
            searchSpan: 4,
            type: "select",
            props: {
              label: "label",
              value: "value",
            },
            dicData: [
              {
                value: "0",
                label: "是",
              },
              {
                value: "2",
                label: "否",
              },
            ],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择是否通过考试",
                trigger: "blur",
              },
            ],
          },
          // {
          //   label: "是否通过考试",
          //   searchLabelWidth: 110,
          //   prop: "pass",
          //   searchSpan: 4,
          //   type: "select",
          //   props: {
          //     label: "label",
          //     value: "value"
          //   },
          //   dicData: [
          //     {
          //       value: "0",
          //       label: "是"
          //     },
          //     {
          //       value: "2",
          //       label: "否"
          //     }
          //   ],
          //   search: true,
          //   rules: [
          //     {
          //       required: true,
          //       message: "请选择是否通过考试",
          //       trigger: "blur"
          //     }
          //   ]
          // },
          {
            label: "是否派遣",
            prop: "send",
            searchSpan: 4,
            prop: "dispatch",
            searchSpan: 3,
            type: "select",
            props: {
              label: "label",
              value: "value",
              value: "value"
            },
            dicData: [
              {
                value: "0",
                label: "是",
                label: "是"
              },
              {
                value: "2",
                label: "否",
              },
                value: "1",
                label: "否"
              }
            ],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择是否派遣",
                trigger: "blur",
              },
            ],
          },
        ],
                trigger: "blur"
              }
            ]
          }
        ]
      },
      companyName: "",
      loading: true,
      deptid: ""
    };
  },
  computed: {
@@ -295,37 +317,89 @@
        addBtn: this.vaildData(this.permission.post_add, false),
        viewBtn: this.vaildData(this.permission.post_view, false),
        delBtn: this.vaildData(this.permission.post_delete, false),
        editBtn: this.vaildData(this.permission.post_edit, false),
        editBtn: this.vaildData(this.permission.post_edit, false)
      };
    },
    }
  },
  methods: {
    dateChange() {},
    // downExcel() {
    //   let et = XLSX.utils.table_to_book(document.getElementById("table"));
    //   let etout = XLSX.write(et, {
    //     bookType: "xlsx",
    //     bookSST: true,
    //     type: "array"
    //   });
    //   try {
    //     FileSaver.saveAs(
    //       new Blob([etout], {
    //         type: "application/octet-stream"
    //       }),
    //       `表.xlsx`
    //     ); //导出的文件名
    //   } catch (e) {
    //     console.log(e, etout);
    //   }
    //   return etout;
    // }
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },

    searchReset() {
      this.query = {};
      this.onLoad(this.page, this.query);
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
      this.onLoad(this.page, this.query);
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
      this.onLoad(this.page, this.query);
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      // if (!params) {
      //   params = { current: page.currentPage, size: page.pageSize };
      // }
      let param = {};
      param["deptid"] = this.deptid;
      param["name"] = params["real_name"] || "";
      param["hold"] =
        params["hold"] || params["hold"] == "0" ? Number(params["hold"]) : "";
      param["photo"] =
        params["photo"] || params["photo"] == "0"
          ? Number(params["photo"])
          : "";
      param["examinationtype"] =
        params["examination_type"] || params["examination_type"] == "0"
          ? Number(params["examination_type"])
          : "";
      param["dispatch"] =
        params["dispatch"] || params["dispatch"] == "0"
          ? Number(params["dispatch"])
          : "";
      param["soil"] =
        params["soil"] || params["soil"] == "0" ? Number(params["soil"]) : "";
      param["current"] = page.currentPage;
      param["size"] = page.pageSize;
      selectUIn(param).then(res => {
        const data = res.data.data;
        this.page.total = data.total;
        this.tableData = data.records;
        // this.data = data.records;
        this.loading = false;
      });
    },

    getLocationParams() {
      let url = window.location.href;
      let urlArr = url.split("?")[1].split("&");
      var object = new Object();
      for (var i = 0; i < urlArr.length; i++) {
        let mm = urlArr[i].split("=");
        object[decodeURIComponent(mm[0])] = decodeURIComponent(mm[1]);
      }
      this.deptid = object["deptid"] || "";
      this.query = { deptid: this.deptid };
      this.onLoad(this.page, this.query);
    }
  },
  mounted() {},
  mounted() {
    // this.getTableData();
    this.getLocationParams();
  }
};
</script>
<style lang="scss" scoped>
/deep/ .avue-crud__menu {
  height: 130px !important;
}
// /deep/ .avue-crud__menu {
//   height: 130px !important;
// }
</style>

 src/views/statisticalQueryManagement/securityGuardDetail.vue

New file
@@ -0,0 +1,315 @@
<template>
  <basic-container>
    <avue-crud
      :option="tableOption"
      :table-loading="loading"
      :data="data"
      ref="crud"
      v-model="form"
      :permission="permissionList"
      :page.sync="page"
      @search-change="searchChange"
      @search-reset="searchReset"
      @selection-change="selectionChange"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @row-click="handleRowClick"
    >
    </avue-crud>
  </basic-container>
</template>
<script>
import { mapGetters } from "vuex";
import { pageSecurity } from "../../api/statisticalQueryManagement/statisticalQueryManagement";
export default {
  name: "保安员明细",
  data() {
    return {
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      query: {},
      value1: "",
      value2: "",
      tableData: [
        // {
        //   company: "江西省永安保安服务有限公司",
        //   subOffice: "南昌市公安局",
        //   timeStart: "2020-07-14",
        //   timeEnd: "2021-06-30",
        //   customerName: "南昌市幼儿园",
        //   num: "7",
        //   // status: "正在服务",
        //   bz: ""
        // },
        // {
        //   company: "南昌市赣水保安服务有限公司",
        //   subOffice: "东湖分局",
        //   timeStart: "2020-01-23",
        //   timeEnd: "2020-12-31",
        //   customerName: "南昌市第一人民医院",
        //   num: "32",
        //   // status: "已完成",
        //   bz: ""
        // },
        // {
        //   company: "江西中业兴达保安服务有限公司",
        //   subOffice: "西湖分局",
        //   timeStart: "2020-03-16",
        //   timeEnd: "2021-7-29",
        //   customerName: "南昌市动物园",
        //   num: "12",
        //   // status: "未下单",
        //   bz: ""
        // }
      ],
      tablePage: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      tableOption: {
        excelBtn: true,
        delBtn: false,
        editBtn: false,
        addBtn: false,
        selection: true,
        menu: false,
        // dateBtn: true,
        align: "center",
        height: "auto",
        calcHeight: 30,
        tip: false,
        searchShowBtn: false,
        searchShow: true,
        searchMenuSpan: 6,
        index: true,
        viewBtn: true,
        dialogClickModal: false,
        column: [
          {
            label: "保安姓名",
            prop: "realName",
            search: true,
            searchSpan: 4,
            display: false
          },
          {
            label: "性别",
            prop: "sex",
            type: "select",
            // search: true,
            searchSpan: 4,
            searchLabelWidth: 50,
            dicData: [
              {
                label: "女",
                value: 2
              },
              {
                label: "男",
                value: 1
              }
            ],
            slot: true,
            display: false
          },
          {
            label: "保安公司",
            prop: "deptName",
            width: 300,
            // search: true,
            // searchSpan: 4,
            overHidden: true,
            slot: true,
            display: false
          },
          {
            label: "保安证编号",
            prop: "securitynumber",
            display: false,
            searchSpan: 5,
            searchLabelWidth: 110,
            width: 180
            // search: true,
          },
          {
            label: "身份证号",
            prop: "cardid",
            slot: true,
            display: false,
            width: 180
          },
          {
            label: "联系方式",
            prop: "phone",
            slot: true,
            display: false,
            width: 180
          },
          // {
          //   label: "联系地址",
          //   prop: "address",
          //   slot: true,
          //   display: false,
          //   hide: true
          // },
          {
            label: "入职时间",
            prop: "rtime",
            slot: true,
            display: false,
            width: 180
          },
          // {
          //   label: "所属角色",
          //   prop: "roleName",
          //   slot: true,
          //   display: false,
          //   width: 78,
          //   hide: true
          // },

          // {
          //   label: "所属辖区",
          //   prop: "jurisdiction",
          //   // multiple: true,
          //   minWidth: 60,
          //   type: "tree",
          //   dicUrl: "/api/jurisdiction/lazy-tree?parentId=0",
          //   props: {
          //     label: "title",
          //     value: "id",
          //   },
          //   checkStrictly: true,
          //   slot: true,
          //   rules: [
          //     {
          //       required: true,
          //       message: "请选择所属辖区",
          //       trigger: "click",
          //     },
          //   ],
          // },
          {
            label: "是否在职",
            prop: "status",
            type: "select",
            search: true,
            searchSpan: 4,
            dicData: [
              {
                label: "否",
                value: 2
              },
              {
                label: "是",
                value: 1
              }
            ],
            slot: true,
            display: false,
          },
          {
            label: "是否持证",
            prop: "hold",
            type: "select",
            search: true,
            searchSpan: 4,
            dicData: [
              {
                label: "是",
                value: "0"
              },
              {
                label: "否",
                value: "1"
              },
              {
                label: "已吊销",
                value: "2"
              }
            ],
            slot: true,
            display: false,
          }
        ]
      },
      typeValue: "0",
      servicesList: [],
      companyName: "",
      loading: true
    };
  },
  computed: {
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.post_add, false),
        viewBtn: this.vaildData(this.permission.post_view, false),
        delBtn: this.vaildData(this.permission.post_delete, false),
        editBtn: this.vaildData(this.permission.post_edit, false)
      };
    }
  },
  methods: {
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },

    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
      this.onLoad(this.page, this.query);
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
      this.onLoad(this.page, this.query);
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      let param = {};
      param["realName"] = params["realName"] || "";
      param["status"] = params["status"] || "";
      param["deptId"] = this.deptid;
      param["hold"] = params["hold"] || "";
      param["current"] = page.currentPage;
      param["size"] = page.pageSize;
      pageSecurity(param).then(res => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
      });
    },
    getLocationParams() {
      let url = window.location.href;
      let urlArr = url.split("?")[1].split("&");
      var object = new Object();
      for (var i = 0; i < urlArr.length; i++) {
        let mm = urlArr[i].split("=");
        object[decodeURIComponent(mm[0])] = decodeURIComponent(mm[1]);
      }
      this.deptid = object["departmentid"] || "";
      this.query = { deptid: this.deptid };
      this.onLoad(this.page, this.query);
      //   this.onLoad(this.page, this.query);
    }
  },
  mounted() {
    this.getLocationParams();
  }
};
</script>

 src/views/statisticalQueryManagement/securityGuardStatistics.vue

@@ -2,18 +2,20 @@
  <basic-container>
    <avue-crud
      :option="tableOption"
      :table-loading="loading"
      :data="tableData"
      :page.sync="tablePage"
      :page.sync="page"
      :permission="permissionList"
      :before-open="beforeOpen"
      @date-change="dateChange"
      ref="crud"
      @search-change="searchChange"
      @search-reset="searchReset"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
      @row-click="handleRowClick"
      class="rowClick"
    >
      <template slot-scope="{ type, size }" slot="menu">
        <el-button icon="el-icon-check" :size="size" :type="type"
          >自定义菜单按钮</el-button
        >
      </template>
    </avue-crud>
  </basic-container>
</template>
@@ -21,55 +23,61 @@
import FileSaver from "file-saver";
import XLSX from "xlsx";
import { mapGetters } from "vuex";
import {
  selectLi,
  dictionaryList
} from "../../api/statisticalQueryManagement/statisticalQueryManagement";
import { lazyTreeJu ,lazyTrees} from "../../api/index/index";
export default {
  name: "业务情况统计",
  data() {
    return {
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      query: {},
      value1: "",
      value2: "",
      tableData: [
        {
          company: "江西省永安保安服务有限公司",
          subOffice: "东湖分局",
          total: "21540",
          holder: "21520",
          nosend: "10200",
          send: "1320",
          nopicture: "314",
          qualification: "142",
          pass: "21120",
          socialSecurity: "21535",
        },
        {
          company: "南昌市赣水保安服务有限公司",
          subOffice: "东湖分局",
          total: "21540",
          holder: "21520",
          nosend: "10200",
          send: "1320",
          nopicture: "314",
          qualification: "142",
          pass: "21120",
          socialSecurity: "21535",
        },
        {
          company: "江西中业兴达保安服务有限公司",
          subOffice: "东湖分局",
          total: "21540",
          holder: "21520",
          nosend: "10200",
          send: "1320",
          nopicture: "314",
          qualification: "142",
          pass: "21120",
          socialSecurity: "21535",
        },
        // {
        //   company: "江西省永安保安服务有限公司",
        //   subOffice: "东湖分局",
        //   total: "21540",
        //   holder: "21520",
        //   nosend: "10200",
        //   send: "1320",
        //   nopicture: "314",
        //   qualification: "142",
        //   pass: "21120",
        //   socialSecurity: "21535",
        // },
        // {
        //   company: "南昌市赣水保安服务有限公司",
        //   subOffice: "东湖分局",
        //   total: "21540",
        //   holder: "21520",
        //   nosend: "10200",
        //   send: "1320",
        //   nopicture: "314",
        //   qualification: "142",
        //   pass: "21120",
        //   socialSecurity: "21535",
        // },
        // {
        //   company: "江西中业兴达保安服务有限公司",
        //   subOffice: "东湖分局",
        //   total: "21540",
        //   holder: "21520",
        //   nosend: "10200",
        //   send: "1320",
        //   nopicture: "314",
        //   qualification: "142",
        //   pass: "21120",
        //   socialSecurity: "21535",
        // },
      ],
      tablePage: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      tableOption: {
        align: "center",
        viewBtn: true,
@@ -92,97 +100,111 @@
        column: [
          {
            label: "公司名称",
            prop: "company",
            prop: "deptname",
            search: true,
            searchSpan: 4,
            width: 300,
            display: false
          },
          {
            label: "单位类型",
            prop: "stats",
            search: true,
            searchSpan: 4,
            display: false,
          },

          {
            label: "所属辖区",
            prop: "subOffice",
            searchSpan: 4,
            type: "select",
            props: {
              label: "label",
              value: "value",
              label: "dictValue",
              value: "dictKey"
            },
            // cascaderItem: ["city", "area"],
            // dicUrl:subofficeOptions,
            dicData: []
          },
          {
            label: "所属辖区",
            prop: "jurname",
            searchSpan: 4,
            type: "tree",
            props: {
              label: "title",
              value: "value"
            },
            // dicUrl: "/api/information/lazyTreeJu",
            // dicMethod:'post',
            dicData: [
              {
                value: "0",
                label: "南昌市公安局",
              },
              {
                value: "2",
                label: "东湖分局",
              },
              {
                value: "3",
                label: "西湖分局",
              },
              {
                value: "4",
                label: "青云谱分局",
              },
              {
                value: "5",
                label: "青山湖分局",
              },
              // {
              //   value: "0",
              //   label: "南昌市公安局"
              // },
              // {
              //   value: "2",
              //   label: "东湖分局"
              // },
              // {
              //   value: "3",
              //   label: "西湖分局"
              // },
              // {
              //   value: "4",
              //   label: "青云谱分局"
              // },
              // {
              //   value: "5",
              //   label: "青山湖分局"
              // }
            ],
            search: true,
            rules: [
              {
                required: true,
                message: "请选择所属辖区",
                trigger: "blur",
              },
            ],
                trigger: "blur"
              }
            ]
          },
          {
            label: "保安员总数",
            prop: "total",
            display: false,
            prop: "num",
            display: false
          },
          {
            label: "持证上岗人数",
            prop: "holder",
            display: false,
            prop: "cznum",
            display: false
          },
          {
            label: "未派遣人数",
            prop: "nosend",
            display: false,
            prop: "wpaiqnum",
            display: false
          },
          {
            label: "派遣人数",
            prop: "send",
            display: false,
            prop: "paiqnum",
            display: false
          },
          {
            label: "未采集照片人数",
            prop: "nopicture",
            display: false,
            prop: "wcaijnum",
            display: false
          },
          {
            label: "资格审查异常人数",
            prop: "qualification",
            display: false,
            prop: "yicnum",
            display: false
          },
          {
            label: "过考保安人数",
            prop: "pass",
            display: false,
          },
          // {
          //   label: "过考保安人数",
          //   prop: "pass",
          //   display: false,
          // },
          {
            label: "缴纳社保人数",
            prop: "socialSecurity",
            display: false,
          },
        ],
            prop: "sbnum",
            display: false
          }
        ]
      },
      companyName: "",
      loading: true
    };
  },
  computed: {
@@ -192,40 +214,97 @@
        addBtn: this.vaildData(this.permission.post_add, false),
        viewBtn: this.vaildData(this.permission.post_view, false),
        delBtn: this.vaildData(this.permission.post_delete, false),
        editBtn: this.vaildData(this.permission.post_edit, false),
        editBtn: this.vaildData(this.permission.post_edit, false)
      };
    },
    }
  },
  methods: {
    toCompanyDetails() {
      this.$router.push({ path: "/statisticalQueryManagement/companyDetails" });
    getSubOfficeData() {
      lazyTrees().then(res => {
        if (res.data.code === 200) {
          this.tableOption.column.forEach(item => {
            if (item.label == "所属辖区") {
              // let data = res.data.data;
              item.dicData = res.data.data;
            }
          });
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    // searchChildren(data) {
    //   data.forEach(item => {
    //     if(item.hasChildren)(

    //     )
    //     else {
    //       this.searchChildren()
    //     }
    //   });
    // },
    getDictionaryList() {
      dictionaryList().then(res => {
        if (res.data.code === 200) {
          this.tableOption.column.forEach(item => {
            if (item.label == "单位类型") {
              item.dicData = res.data.data;
            }
          });
        }
      });
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },

    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
      this.onLoad(this.page, this.query);
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
      this.onLoad(this.page, this.query);
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      let param = {};
      param["jurisdiction"] = params["jurname"] || "";
      param["deptid"] = params["deptname"] || "";
      param["stats"] = params["stats"] || "";
      param["current"] = page.currentPage;
      param["size"] = page.pageSize;
      selectLi(param).then(res => {
        const data = res.data.data;
        this.page.total = data.total;
        this.tableData = data.records;
        this.loading = false;
      });
    },
    handleRowClick(row, event, column) {
      this.$router.push({ path: "/statisticalQueryManagement/companyDetails" });
    },
    dateChange() {},
    // downExcel() {
    //   let et = XLSX.utils.table_to_book(document.getElementById("table"));
    //   let etout = XLSX.write(et, {
    //     bookType: "xlsx",
    //     bookSST: true,
    //     type: "array"
    //   });
    //   try {
    //     FileSaver.saveAs(
    //       new Blob([etout], {
    //         type: "application/octet-stream"
    //       }),
    //       `表.xlsx`
    //     ); //导出的文件名
    //   } catch (e) {
    //     console.log(e, etout);
    //   }
    //   return etout;
    // }
      this.$router.push({
        path: "/statisticalQueryManagement/companyDetails?deptid=" + row.dept_id
      });
    }
  },
  mounted() {},
  mounted() {
    this.getSubOfficeData();
    this.getDictionaryList();
  }
};
</script>
<style lang="scss" scoped>
/deep/ .rowClick .el-table__row:hover td {
  cursor: pointer;
}
</style>

 src/views/talk/talk.vue

New file
@@ -0,0 +1,340 @@
<template>
  <basic-container>
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      :page.sync="page"
      :permission="permissionList"
      :before-open="beforeOpen"
      :upload-preview="uploadPreview"
      :upload-error="uploadError"
      :upload-exceed="uploadExceed"
      :upload-delete="uploadDelete"
      :upload-before="uploadBefore"
      :upload-after="uploadAfter"
      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"
    >
      <!-- <template slot-scope="{ disabled, size }" slot="realNameSearch">
        <el-input
          placeholder="姓名"
          :disabled="disabled"
          :size="size"
          style="width: 200px"
          v-on:input="inputs(findName)"
          v-model="findName"
        ></el-input>
      </template> -->
      <template slot="menuLeft">
        <el-button
          type="danger"
          size="small"
          icon="el-icon-delete"
          plain
          v-if="permission.talk_delete"
          @click="handleDelete"
          >删 除
        </el-button>
      </template>
    </avue-crud>
  </basic-container>
</template>

<script>
import { getList, getDetail, add, update, remove } from "@/api/talk/talk";
import { mapGetters } from "vuex";

export default {
  data() {
    var id = this.$store.getters.userInfo.dept_id;
    return {
      findName: "",
      form: {},
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      selectionList: [],
      option: {
        height: "auto",
        calcHeight: 30,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        border: true,
        searchShowBtn: false,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "标题",
            prop: "title",
            search: true,
            searchLabelWidth: 45,
            rules: [
              {
                required: true,
                message: "请输入标题",
                trigger: "blur",
              },
            ],
          },
          {
            label: "谈话对象",
            prop: "realName",
            search: true,
            // type: "tree",
            // searchslot: true,
            // dicUrl: `/api/blade-user/selectInr?deptid=` + id,
            // props: {
            //   label: "realName",
            //   value: "id",
            // },
            rules: [
              {
                required: true,
                message: "请输入谈话对象",
                trigger: "blur",
              },
            ],
          },
          {
            label: "谈话内容",
            prop: "talkcontent",
            rules: [
              {
                required: true,
                message: "请输入谈话内容",
                trigger: "blur",
              },
            ],
          },
          {
            label: "谈话时间",
            prop: "talktime",
            type: "date",
            format: "yyyy-MM-dd hh:mm:ss",
            valueFormat: "yyyy-MM-dd hh:mm:ss",
            rules: [
              {
                required: true,
                message: "请输入谈话时间",
                trigger: "blur",
              },
            ],
          },
          {
            label: "结论",
            prop: "conclusion",
            rules: [
              {
                required: true,
                message: "请输入结论",
                trigger: "blur",
              },
            ],
          },
          {
            label: "评价",
            prop: "evaluate",
            rules: [
              {
                required: true,
                message: "请输入评价",
                trigger: "blur",
              },
            ],
          },
          {
            label: "图片",
            prop: "imgurl",
            // dataType: 'string',
            type: "upload",
            propsHttp: {
              res: "data",
            },
            span: 24,
            listType: "picture-card",
            tip: "只能上传jpg/png文件，且不超过500kb",
            action: "/api/blade-resource/oss/endpoint/put-files-talk?file=",
          },
        ],
      },
      data: [],
    };
  },
  computed: {
    ...mapGetters(["permission", "userInfo"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.talk_add, false),
        viewBtn: this.vaildData(this.permission.talk_view, false),
        delBtn: this.vaildData(this.permission.talk_delete, false),
        editBtn: this.vaildData(this.permission.talk_edit, false),
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  methods: {
    searchChange(params, done) {
      // console.log(params);
      this.onLoad(this.page, params);
      done();
    },

    rowSave(row, done, loading) {
      var d = [];
      for (var k in row.imgurl) {
        d.push(row.imgurl[k].value);
      }
      row.imgurl = d.join(",");
      row.deptid = this.$store.getters.userInfo.dept_id;
      add(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          loading();
          window.console.log(error);
        }
      );
    },
    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: "操作成功!",
          });
        });
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then((res) => {
          this.form = res.data.data;
        });
      }
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      // console.log(1);
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        console.log(this.data);
        this.loading = false;
        this.selectionClear();
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.avue-form__menu--center .el-button {
  float: left !important;
}

.avue-form__menu--center .el-button:nth-child(1) {
  margin-left: 30px !important;
}
</style>

 src/views/workreport/data.js

@@ -17,28 +17,30 @@
        message: "请输入时间",
        trigger: "blur"
    }]
}, {
    label: "汇报类别",
    prop: "category",
    type: "select",
    dicUrl: "/api/blade-system/dict-biz/dictionary?code=workReportCategory",
    props: {
        label: "dictValue",
        value: "dictKey"
    },
    dataType: "number",
    // searchSpan: 4,
    // search: true,
    hide: true,
    addDisplay: false,
    editDisplay: false,
    viewDisplay: false,
    rules: [{
        required: true,
        message: "请选择汇报类别",
        trigger: "blur"
    }]
}, {
},
//  {
//     label: "汇报类别",
//     prop: "category",
//     type: "select",
//     dicUrl: "/api/blade-system/dict-biz/dictionary?code=workReportCategory",
//     props: {
//         label: "dictValue",
//         value: "dictKey"
//     },
//     dataType: "number",
//     // searchSpan: 4,
//     // search: true,
//     hide: true,
//     addDisplay: false,
//     editDisplay: false,
//     viewDisplay: false,
//     rules: [{
//         required: true,
//         message: "请选择汇报类别",
//         trigger: "blur"
//     }]
// }, 
{
    label: "汇报类型",
    prop: "type",
    type: "select",
@@ -61,7 +63,7 @@
    prop: "receivedIds",
    // span: 12,
    type: "tree",
    dicUrl: "/api/blade-system/dept/lazy-tree-user",
    dicUrl: "/api/blade-system/dept/lazy-tree-users?type=3&deptId=" + this.deptId,
    hide: true,
    leafOnly: true,
    props: {
@@ -162,7 +164,8 @@
        message: "请输入时间",
        trigger: "blur"
    }]
}, {
},
{
    label: "汇报类别",
    prop: "category",
    type: "select",
@@ -178,14 +181,13 @@
    addDisplay: false,
    editDisplay: false,
    viewDisplay: false,
    hide: true,
    editDisplay: false,
    rules: [{
        required: true,
        message: "请选择汇报类别",
        trigger: "blur"
    }]
}, {
},
{
    label: "汇报类型",
    prop: "type",
    type: "select",

 src/views/workreport/workreply.vue

@@ -101,9 +101,9 @@
    permissionList() {
      return {
        addBtn: this.vaildData(null, false),
        viewBtn: this.vaildData(this.permission.notice_view, false),
        viewBtn: this.vaildData(this.permission.workreply_view, false),
        delBtn: this.vaildData(null, false),
        editBtn: this.vaildData(this.permission.notice_edit, false),
        editBtn: this.vaildData(this.permission.workreply_say, false),
      };
    },
    ids() {

 src/views/workreport/workreport.vue

@@ -27,6 +27,7 @@
          size="small"
          icon="el-icon-delete"
          plain
          v-if="permission.workreport_delete"
          @click="handleDelete"
          >删 除
        </el-button>
@@ -41,7 +42,6 @@
</template>

<script>
import { workreportColumn } from "./data";
import {
  getListPage,
  remove,
@@ -51,6 +51,8 @@
} from "@/api/workreport/workreport";
import { getDept } from "@/api/system/dept";
import { mapGetters } from "vuex";
import { mapState } from "vuex";
import { workreportColumn } from "./data";

export default {
  data() {
@@ -89,7 +91,7 @@
        excelBtn: false,
        menuWidth: 320,
        dialogClickModal: false,
        column: workreportColumn,
        column:workreportColumn,
      },
      data: [],
    };
@@ -98,10 +100,10 @@
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.notice_add, false),
        viewBtn: this.vaildData(this.permission.notice_view, false),
        delBtn: this.vaildData(this.permission.notice_delete, false),
        editBtn: this.vaildData(this.permission.notice_edit, false),
        addBtn: this.vaildData(this.permission.workreport_add, false),
        viewBtn: this.vaildData(this.permission.workreport_view, false),
        delBtn: this.vaildData(this.permission.workreport_delete, false),
        editBtn: this.vaildData(this.permission.workreport_edit, false),
      };
    },
    ids() {
@@ -111,6 +113,9 @@
      });
      return ids.join(",");
    },
    ...mapState({
      userInfo: (state) => state.user.userInfo,
    }),
  },
  mounted() {},
  methods: {
@@ -139,6 +144,7 @@
    rowUpdate(row, index, done, loading) {
      row.deptId = this.deptId;
      row.userId = this.userId;
      row.category = 3;
      // row.receivedIds = row.receivedIds.join(",");
      update(row).then(
        () => {
@@ -238,36 +244,22 @@
      ).content.user_id;

      var that = this;
      getDept(this.deptId).then((res) => {
        var deptCategory = res.data.data.deptCategory;
        deptCategory == 1
          ? (that.deptCategory = true)
          : (that.deptCategory = false);
      getDept(this.deptId).then(() => {
        const columnReceivedIds = that.findObject(that.option.column, "receivedIds");
        columnReceivedIds.dicUrl = "/api/blade-system/dept/lazy-tree-users?type=3&deptId="+that.deptId;
        params["deptId"] = that.deptId;
        params["userId"] = that.userId;

        // const { releaseTimeRange } = this.query;
        // if (that.deptCategory) {
        params["deptId"] = this.deptId;
        params["userId"] = this.userId;
        // }
        let values = {
          ...params,
        };
        // if (releaseTimeRange) {
        //   values = {
        //     ...params,
        //     startTime: releaseTimeRange[0],
        //     endTime: releaseTimeRange[1],
        //     ...this.query,
        //   };
        //   values.releaseTimeRange = null;
        // }
        this.loading = true;
        that.loading = true;
        getListPage(page.currentPage, page.pageSize, values).then((res) => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;
          this.loading = false;
          this.selectionClear();
          that.page.total = data.total;
          that.data = data.records;
          that.loading = false;
          that.selectionClear();
        });
      });
    },

 vue.config.js

@@ -30,10 +30,10 @@
        // target: 'http://192.168.0.109:1',
        //远程演示服务地址,可用于直接启动项目
        // target: 'http://2h3f861221.wicp.vip:58646',
        target: 'http://s16s652780.51mypc.cn/api',
        // target: 'http://s16s652780.51mypc.cn/api',
        // target: 'http://192.168.0.114:82',
        // target: 'http://192.168.0.109:82',
        // target: 'http://s16s652780.51mypc.cn/api',
        target: 'http://s16s652780.51mypc.cn/api',
        // 服务器使用
        // target: 'http://localhost:82',
        ws: true,