林火综合应急信息管理系统前端
guoshilong
2023-03-06 85cec9a000cae214496feaea25f71c66f5663c2a
机构管理、用户管理完成;火灾管理详情页显示,添加地图
9 files modified
1 files renamed
1 files added
618 ■■■■ changed files
package.json 1 ●●●● patch | view | raw | blame | history
src/api/device/device.js 2 ●●● patch | view | raw | blame | history
src/api/fireSupplement/fireSupplement.js 4 ●●●● patch | view | raw | blame | history
src/components/OpenLayersMap/index.vue 150 ●●●●● patch | view | raw | blame | history
src/config/website.js 2 ●●● patch | view | raw | blame | history
src/views/fire/fireAdd.vue 28 ●●●● patch | view | raw | blame | history
src/views/fire/fireManage.vue 146 ●●●● patch | view | raw | blame | history
src/views/fire/fireSupplement.vue 178 ●●●●● patch | view | raw | blame | history
src/views/system/dept.vue 4 ●●●● patch | view | raw | blame | history
src/views/system/user.vue 101 ●●●● patch | view | raw | blame | history
vue.config.js 2 ●●● patch | view | raw | blame | history
package.json
@@ -23,6 +23,7 @@
    "mockjs": "^1.0.1-beta3",
    "node-gyp": "^5.0.6",
    "nprogress": "^0.2.0",
    "ol": "^7.3.0",
    "portfinder": "^1.0.23",
    "script-loader": "^0.7.2",
    "vue": "^2.6.10",
src/api/device/device.js
@@ -2,7 +2,7 @@
export const getList = (current, size, params) => {
  return request({
    url: '/api/blade-device/device/list',
    url: '/api/blade-device/device/page',
    method: 'get',
    params: {
      ...params,
src/api/fireSupplement/fireSupplement.js
File was renamed from src/views/fireSupplement/fireSupplement.js
@@ -12,12 +12,12 @@
  })
}
export const getDetail = (id) => {
export const getDetail = (fireId) => {
  return request({
    url: '/api/blade-fireSupplement/fireSupplement/detail',
    method: 'get',
    params: {
      id
      fireId
    }
  })
}
src/components/OpenLayersMap/index.vue
New file
@@ -0,0 +1,150 @@
<template>
  <div>
    <div id='map' style="width: 100%;height: 83vh"></div>
    <div style="position: absolute;right:1%;top:2%;z-index: 999999;background-color: white;width: 210px">
      <div style="margin: 10px;width: 190px">
        <el-form ref="form" :model="searchForm" label-width="80px" label-position="top" size="small" @submit.native.prevent>
          <el-form-item label="请输入关键字:">
<!--            <el-input v-model="searchForm.key" @keyup.enter.native="search"></el-input>-->
            <el-autocomplete
              class="inline-input"
              v-model="searchForm.key"
              :fetch-suggestions="querySearch"
              placeholder="请输入内容"
              :trigger-on-focus="false"
              @select="handleSelect"
            ></el-autocomplete>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>
<script>
import 'ol/ol.css'
import {Map, View, Feature} from 'ol'
import VectorSource from 'ol/source/Vector'
import Cluster from 'ol/source/Cluster'
import {Vector as VectorLayer, Tile as TileLayer} from 'ol/layer'
import LineString from "ol/geom/LineString";
import Point from 'ol/geom/Point';
import Icon from 'ol/style/Icon';
import {Style, Fill as StyleFill, Stroke as StyleStroke, Text as StyleText, Circle as StyleCircle} from 'ol/style'
import {Circle as GeomCircle, Point as GeomPoint, LineString as GeomLineString, Polygon as GeomPolygon} from 'ol/geom'
import Draw from 'ol/interaction/Draw'
import XYZ from "ol/source/XYZ";
import 'ol/ol.css'
import axios from '../../../src/router/axios'
export default {
  name: 'OpenLayersMap',
  props: [],
  data() {
    return {
      map: null,
      points: [],
      // 线条点数组
      linePoints: [],
      // 多边形数组
      polygonPoints: [],
      draw: null,
      drawLayer: null,
      lineVector: null,
      pointVector: null,
      coordinates: [],// 保存绘画坐标地址   [[115.90490549080435, 28.746101718722358],[115.93151300423209, 28.741123538790717]]
      toData: null,// 保存数据库格式坐标地址,
      searchForm:{},
      searchData:[],
      region:[],
    }
  },
  methods: {
    //地图初始化
    createMap() {
      let _this = this
      _this.map = new Map({
        target: 'map',
        layers: [
          new TileLayer({
            source: new XYZ({
              url: "https://webmap-tile.sf-express.com/MapTileService/rt?fetchtype=static&x={x}&y={y}&z={z}&project=sfmap&pic_size=256&pic_type=png8&data_name=361100&data_format=merged-dat&data_type=normal", // 行政区划
            })
          }),
        ],
        view: new View({
          // 设置中心点,默认南昌,用于规划南昌市的路线
          center: [115.9032747077233, 28.67433116990186],
          projection: 'EPSG:4326',
          // 设置缩放倍数
          zoom: 13,
          minZoom: 8,
          maxZoom: 19
        })
      })
    },
    //调用高德地图提供的地点搜索
    search(keyWord,cb){
      const that = this
      //默认南昌
      let cityCode = "36"
      if (this.region){
        cityCode = this.region[2]
      }
      AMap.service(["AMap.PlaceSearch"], function() {
        //构造地点查询类
        var placeSearch = new AMap.PlaceSearch({
          pageSize: 99999999, // 单页显示结果条数
          pageIndex: 1, // 页码
          city: cityCode, // 兴趣点城市
          citylimit: true,  //是否强制限制在设置的城市内搜索
          autoFitView: true // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
        });
        //关键字查询
        placeSearch.search(keyWord,function (status, result) {
          that.searchData  = result.poiList.pois
          that.searchData.forEach(e=>{
            e.value = e.name
          })
          cb(that.searchData)
        });
      });
    },
    //获取从父组件传递的行政区code
    getLocation(data){
      this.region = data
    },
    //搜索框选择
    handleSelect(item) {
      this.setCenter(item.location.lng,item.location.lat)
    },
    //搜索
    querySearch(queryString, cb) {
      this.search(queryString,cb)
    },
    //设置中心点
    setCenter(lon,lat){
      const view = this.map.getView()
      view.setCenter([lon, lat]);
      view.setZoom(20);
    }
  },
  mounted() {
    this.createMap()
  }
}
</script>
<style>
.mapTip {
  background-color: rgb(168, 168, 168);
  padding: 5px;
  border: 1px solid #000;
  position: absolute;
  z-index: 10 !important;
  border-radius: 5px;
}
</style>
src/config/website.js
@@ -10,7 +10,7 @@
  clientSecret: 'saber_secret', // 客户端密钥
  tenantMode: true, // 是否开启租户模式
  tenantId: "000000", // 管理组租户编号
  captchaMode: true, // 是否开启验证码模式
  captchaMode: false, // 是否开启验证码模式
  switchMode: false, // 是否开启部门切换模式
  lockPage: '/lock',
  tokenTime: 3000,
src/views/fire/fireAdd.vue
@@ -5,16 +5,19 @@
        <avue-form ref="form" v-model="form" :option="option" @submit="submit"></avue-form>
      </el-col>
      <el-col :span="12">
        <OpenLayersMap ref="olMap"></OpenLayersMap>
<!--        <avue-input-map v-model="form"></avue-input-map>-->
      </el-col>
    </el-row>
  </basic-container>
</template>
<script>
import axios from '@/router/axios';
import {add} from "@/api/fire/fire";
import OpenLayersMap from "@/components/OpenLayersMap/index";
export default {
  name: "fireAdd",
  components: {OpenLayersMap},
  data() {
    let baseUrl = '/api/blade-system/region/lazy-tree?parentCode='
    return {
@@ -36,7 +39,7 @@
              label: 'title',
              value: 'key'
            },
            separator:'',
            separator: '',
            lazy: true,
            lazyLoad(node, resolve) {
              let stop_level = 2;
@@ -56,7 +59,7 @@
                  list = res.data.data;
                  callback()
                })
              }else if (level == 1) {
              } else if (level == 1) {
                axios.get(`${baseUrl}${code}`).then(res => {
                  list = res.data.data;
                  callback()
@@ -66,7 +69,7 @@
                  list = res.data.data;
                  callback()
                })
              }else{
              } else {
                callback()
              }
            }
@@ -126,7 +129,8 @@
            label:'火灾描述',
            prop:'description',
            span:24,
            type:'textarea'
            type:'textarea',
            minRows:3,
          },
          {
            label: '现场图片',
@@ -146,6 +150,15 @@
  },
  mounted() {
  },
  watch:{
    "form.location":{
      handler(newVal){
        if (newVal){
          this.$refs.olMap.getLocation(newVal)
        }
      }
    }
  },
  methods: {
    submit(form,done){
      add(form).then(res=>{
@@ -163,7 +176,10 @@
          });
          done();
        }
      })
      }),error=>{
        window.console.log(error);
        done();
      }
    }
  }
}
src/views/fire/fireManage.vue
@@ -1,48 +1,58 @@
<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-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="menuLeft">
        <el-button type="danger"
                   size="small"
                   icon="el-icon-delete"
                   plain
                   v-if="permission.fire_delete"
                   @click="handleDelete">删 除
        </el-button>
      </template>
      <template slot-scope="{type,size,row,index}" slot="menu">
        <el-button icon="el-icon-edit" :size="size" :type="type" @click="goToViewDetail">详 情</el-button>
        <el-button icon="el-icon-delete" :size="size" :type="type" @click="goToFireSupplement(row)">补 录</el-button>
      </template>
    </avue-crud>
  </basic-container>
  <div>
    <basic-container v-if="!isDetail">
      <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">
        <template slot="menuLeft">
          <el-button type="danger"
                     size="small"
                     icon="el-icon-delete"
                     plain
                     v-if="permission.fire_delete"
                     @click="handleDelete">删 除
          </el-button>
        </template>
        <!--      <template slot-scope="{row}" slot="location">-->
        <!--        {{row.$location.split("|").join("")}}-->
        <!--      </template>-->
        <template slot-scope="{type,size,row,index}" slot="menu">
          <el-button icon="el-icon-edit" :size="size" :type="type" @click="goToViewDetail(row)">详 情</el-button>
          <el-button icon="el-icon-delete" :size="size" :type="type" @click="goToFireSupplement(row)">补 录</el-button>
        </template>
      </avue-crud>
    </basic-container>
    <FireSupplieMent ref="supplement" v-if="isDetail" :info="info" @goToList="goToList"></FireSupplieMent>
  </div>
</template>
<script>
import {getList, getDetail, add, update, remove} from "@/api/fire/fire";
import {getDetail as getSupplementDetail} from "@/api/fireSupplement/fireSupplement"
import {mapGetters} from "vuex";
import axios from "@/router/axios";
import FireSupplieMent from "@/views/fire/fireSupplement";
export default {
  components: {FireSupplieMent},
  data() {
    let baseUrl = '/api/blade-system/region/lazy-tree?parentCode='
    return {
      form: {},
      query: {},
@@ -87,48 +97,14 @@
          {
            label: "行政区域",
            prop: "location",
            search: true,
            searchSpan: 4,
            span: 24,
            type: "cascader",
            props: {
              label: 'title',
              value: 'key'
            },
            separator: '',
            lazy: true,
            lazyLoad(node, resolve) {
              let stop_level = 2;
              let level = node.level;
              let data = node.data || {}
              let code = data.key;
              let list = [];
              let callback = () => {
                resolve((list || []).map(ele => {
                  return Object.assign(ele, {
                    leaf: level >= stop_level
                  })
                }));
              }
              if (level == 0) {
                axios.get(`${baseUrl}00`).then(res => {
                  list = res.data.data;
                  callback()
                })
              } else if (level == 1) {
                axios.get(`${baseUrl}${code}`).then(res => {
                  list = res.data.data;
                  callback()
                })
              } else if (level == 2) {
                axios.get(`${baseUrl}${code}`).then(res => {
                  list = res.data.data;
                  callback()
                })
              } else {
                callback()
              }
            }
            dicUrl: 'api/blade-system/region/lazy-tree',
            slot: true
          },
          {
            label: "发现方式",
@@ -259,7 +235,9 @@
          },
        ]
      },
      data: []
      data: [],
      isDetail: false,
      info:{},
    };
  },
  computed: {
@@ -278,7 +256,7 @@
        ids.push(ele.id);
      });
      return ids.join(",");
    }
    },
  },
  methods: {
    rowSave(row, done, loading) {
@@ -393,16 +371,28 @@
        this.selectionClear();
      });
    },
    goToViewDetail(){
    goToViewDetail(data) {
      getSupplementDetail(data.id).then(res => {
        if (res.data.code == 200) {
          let formSupplementData = res.data.data
           this.info = {
            isDetail:true,
            formData:data,
            formSupplementData:formSupplementData,
          }
          this.isDetail = !this.isDetail
        }
      })
    },
    goToFireSupplement(data){
    goToFireSupplement(data) {
      //要使跳转页接收到值,必须用name
      this.$router.push({
        name: '火灾补录',
        params: data
      })
    },
    goToList(){
      this.isDetail = !this.isDetail
    }
  }
};
src/views/fire/fireSupplement.vue
@@ -1,57 +1,64 @@
<template>
  <basic-container>
    <el-card>
      <div slot="header" class="clearfix">
        <span>一、火灾基本信息</span>
      </div>
      <el-row>
        <el-col :span="12">
          <avue-form ref="form" v-model="form" :option="option"></avue-form>
        </el-col>
        <el-col :span="12">
        </el-col>
      </el-row>
    </el-card>
    <el-card>
      <div slot="header" class="clearfix">
        <span>二、火灾调查信息</span>
      </div>
      <avue-form ref="formSupplement" v-model="formSupplement" :option="optionSupplement" @submit="submit">
        <!--经济损失-->
        <template slot="economicLoss">
          <avue-crud :option="economicOption" :data="economicData" v-model="economicForm"
                     @row-save="economicSave"
                     @row-update="economicUpdate"
                     @row-del="economicDel"
          ></avue-crud>
        </template>
        <!--受灾面积-->
        <template slot="damageArea">
          <avue-crud :option="damageAreaOption" :data="damageAreaData" v-model="damageAreaForm"
                     @row-save="damageAreaSave"
                     @row-update="damageAreaUpdate"
                     @row-del="damageAreaDel"></avue-crud>
        </template>
        <!--出动警力-->
        <template slot="policeResources">
          <avue-crud :option="policeResourcesOption" :data="policeResourcesData" v-model="policeResourcesForm"
                     @row-save="policeResourcesSave"
                     @row-update="policeResourcesUpdate"
                     @row-del="policeResourcesDel"
          ></avue-crud>
        </template>
      </avue-form>
    </el-card>
    <div style="margin-bottom: 1%">
      <el-card>
        <div slot="header" class="clearfix">
          <span>一、火灾基本信息</span>
          <el-button v-if="isDetail" size="small" @click="goToList">返回</el-button>
        </div>
        <el-row>
          <el-col :span="12">
            <avue-form ref="form" v-model="form" :option="option"></avue-form>
          </el-col>
          <el-col :span="12">
            <OpenLayersMap></OpenLayersMap>
          </el-col>
        </el-row>
      </el-card>
    </div>
    <div>
      <el-card>
        <div slot="header" class="clearfix">
          <span>二、火灾调查信息</span>
        </div>
        <avue-form ref="formSupplement" v-model="formSupplement" :option="optionSupplement" @submit="submit">
          <!--经济损失-->
          <template slot="economicLoss">
            <avue-crud :option="economicOption" :data="economicData" v-model="economicForm"
                       @row-save="economicSave"
                       @row-update="economicUpdate"
                       @row-del="economicDel"
            ></avue-crud>
          </template>
          <!--受灾面积-->
          <template slot="damageArea">
            <avue-crud :option="damageAreaOption" :data="damageAreaData" v-model="damageAreaForm"
                       @row-save="damageAreaSave"
                       @row-update="damageAreaUpdate"
                       @row-del="damageAreaDel"></avue-crud>
          </template>
          <!--出动警力-->
          <template slot="policeResources">
            <avue-crud :option="policeResourcesOption" :data="policeResourcesData" v-model="policeResourcesForm"
                       @row-save="policeResourcesSave"
                       @row-update="policeResourcesUpdate"
                       @row-del="policeResourcesDel"
            ></avue-crud>
          </template>
        </avue-form>
      </el-card>
    </div>
  </basic-container>
</template>
<script>
import axios from "@/router/axios";
import {add} from "@/views/fireSupplement/fireSupplement";
import {add} from "@/api/fireSupplement/fireSupplement";
import OpenLayersMap from "@/components/OpenLayersMap/index";
export default {
  name: "fireSupplieMent",
  components: {OpenLayersMap},
  props: ['info'],
  data() {
    let baseUrl = '/api/blade-system/region/lazy-tree?parentCode='
    return {
@@ -64,7 +71,8 @@
            label: '火灾编号',
            prop: 'no',
            span: 24,
            type: 'input'
            type: 'input',
            disabled: true,
          },
          {
            label: "行政区域",
@@ -224,6 +232,7 @@
          },
          {
            label: '刑事处罚人数',
            labelWidth: 120,
            prop: 'punishPerson',
            span: 12,
            type: 'input',
@@ -244,7 +253,7 @@
          },
          {
            label: '重伤人数',
            prop: 'SeriouslyInjuredPerson',
            prop: 'seriousInjuredPerson',
            span: 8,
            type: 'input',
            append: '人'
@@ -279,7 +288,7 @@
        column: [
          {
            label: '损失林木',
            prop:'lossForest',
            prop: 'lossForest',
            display: false,
            children: [
              {
@@ -601,10 +610,15 @@
      },
      policeResourcesData: [],
      policeResourcesForm: {},
      isDetail: false,
    }
  },
  created() {
    this.form = this.$route.params
    if (this.info) {
      this.initDetail()
    } else {
      this.form = this.$route.params
    }
  },
  methods: {
    submit(form, done) {
@@ -612,16 +626,19 @@
      form.economicLoss = this.economicData
      form.damageArea = this.damageAreaData
      form.policeResources = this.policeResourcesData
      add(form).then(res=>{
        if (res.data.code == 200){
      add(form).then(res => {
        if (res.data.code == 200) {
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          this.$refs.form.resetForm()
          this.$refs.formSupplement.resetForm()
          this.economicData = []
          this.damageAreaData = []
          this.policeResourcesData = []
          done();
        }else {
        } else {
          this.$message({
            type: "error",
            message: "操作失败!"
@@ -632,16 +649,16 @@
    },
    //经济损失表格增删改方法
    economicSave(form, done, loading) {
      let id = this.economicData.length +1
      let id = this.economicData.length + 1
      this.economicForm.id = id
      this.economicData.push(this.deepClone(this.economicForm))
      loading()
      done()
    },
    economicUpdate(row, index,done, loading) {
    economicUpdate(row, index, done, loading) {
      loading()
      this.economicData.forEach(e=>{
        if (e.id == row.id ){
      this.economicData.forEach(e => {
        if (e.id == row.id) {
          e.adultCommercialForest = row.adultCommercialForest
          e.adultEcologicalForest = row.adultEcologicalForest
          e.juvenileCommercialForest = row.juvenileCommercialForest
@@ -652,23 +669,23 @@
      done()
    },
    economicDel(row) {
      this.economicData = this.economicData.filter(e=>{
      this.economicData = this.economicData.filter(e => {
        return e.id != row.id
      })
    },
    //受灾面积表格增删改方法
    damageAreaSave(form, done, loading) {
      let id = this.damageAreaData.length +1
      let id = this.damageAreaData.length + 1
      this.damageAreaForm.id = id
      this.damageAreaData.push(this.deepClone(this.damageAreaForm))
      loading()
      done()
    },
    damageAreaUpdate(row, index,done, loading) {
    damageAreaUpdate(row, index, done, loading) {
      loading()
      this.damageAreaData.forEach(e=>{
        if (e.id == row.id ){
      this.damageAreaData.forEach(e => {
        if (e.id == row.id) {
          e.fireAreaSum = row.fireAreaSum
          e.fireCommercialForest = row.fireCommercialForest
@@ -686,23 +703,23 @@
      done()
    },
    damageAreaDel(row) {
      this.damageAreaData = this.damageAreaData.filter(e=>{
      this.damageAreaData = this.damageAreaData.filter(e => {
        return e.id != row.id
      })
    },
    //出动警力表格增删改方法
    policeResourcesSave(form, done, loading) {
      let id = this.policeResourcesData.length +1
      let id = this.policeResourcesData.length + 1
      this.policeResourcesForm.id = id
      this.policeResourcesData.push(this.deepClone(this.policeResourcesForm))
      loading()
      done()
    },
    policeResourcesUpdate(row, index,done, loading) {
    policeResourcesUpdate(row, index, done, loading) {
      loading()
      this.policeResourcesData.forEach(e=>{
        if (e.id == row.id ){
      this.policeResourcesData.forEach(e => {
        if (e.id == row.id) {
          e.peopleNumber = row.peopleNumber
          e.vehicleSum = row.vehicleSum
          e.carNumber = row.carNumber
@@ -713,14 +730,39 @@
      done()
    },
    policeResourcesDel(row) {
      this.policeResourcesData = this.policeResourcesData.filter(e=>{
      this.policeResourcesData = this.policeResourcesData.filter(e => {
        return e.id != row.id
      })
    },
    //初始化详情
    initDetail() {
      this.isDetail = this.info.isDetail
      this.form = this.info.formData
      this.formSupplement = this.info.formSupplementData
      this.option.detail = true
      this.optionSupplement.detail = true
      this.economicData = this.info.formSupplementData.economicLoss
      this.damageAreaData = this.info.formSupplementData.damageArea
      this.policeResourcesData = this.info.formSupplementData.policeResources
      this.economicOption.menu = false
      this.damageAreaOption.menu = false
      this.policeResourcesOption.menu = false
    },
    goToList() {
      this.isDetail = false
      this.$emit('goToList')
    }
  }
}
</script>
<style scoped>
.clearfix {
  display: flex;
  justify-content: space-between;
}
</style>
src/views/system/dept.vue
@@ -113,7 +113,7 @@
            }]
          },
          {
            label: '省份',
            label: '省',
            prop: 'province',
            type: 'select',
            props: {
@@ -146,7 +146,7 @@
            }],
          },
          {
            label: '区',
            label: '县/区',
            prop: 'county',
            type: 'select',
            props: {
src/views/system/user.vue
@@ -285,10 +285,32 @@
              display: false
            },
            {
              label: "所属角色",
              prop: "roleId",
              search:true,
              searchOrder:1,
              searchSpan:3,
              multiple: true,
              type: "tree",
              dicData: [],
              props: {
                label: "title"
              },
              checkStrictly: true,
              slot: true,
              hide:true,
              rules: [{
                required: true,
                message: "请选择所属角色",
                trigger: "click"
              }]
            },
            {
              label: "用户名",
              prop: "account",
              search: true,
              searchSpan:4,
              searchOrder:10,
              display: false
            },
            {
@@ -296,10 +318,11 @@
              prop: "realName",
              search: true,
              searchSpan:4,
              searchOrder:9,
              display: false
            },
            {
              label: "用户性别",
              label: "性别",
              prop: "sex",
              type: "select",
              dicData: [
@@ -323,6 +346,7 @@
              prop: "phone",
              search: true,
              searchSpan:4,
              searchOrder:8,
              display: false,
            },
            {
@@ -330,6 +354,27 @@
              prop: "deptName",
              slot: true,
              display: false
            },
            {
              label: "所属单位",
              prop: "deptId",
              search: true,
              searchSpan:3,
              searchOrder:7,
              type: "tree",
              // multiple: true,
              dicData: [],
              props: {
                label: "title",
                value:'id'
              },
              checkStrictly: true,
              slot: true,
              rules: [{
                required: true,
                message: "请选择所属单位",
                trigger: "click"
              }]
            },
          ],
          group: [
@@ -405,7 +450,7 @@
                  overHidden: true
                },
                {
                  label: "用户性别",
                  label: "性别",
                  prop: "sex",
                  type: "select",
                  dicData: [
@@ -453,7 +498,7 @@
                  label: "所属角色",
                  prop: "roleId",
                  search:true,
                  multiple: true,
                  multiple: false,
                  type: "tree",
                  dicData: [],
                  props: {
@@ -674,6 +719,14 @@
      if (!website.tenantMode) {
        this.initData(website.tenantId);
      }
      getRoleTree(this.userInfo.tenant_id).then(res => {
        const column = this.findObject(this.option.column, "roleId");
        column.dicData = res.data.data;
      });
      getDeptTree(this.userInfo.tenant_id).then(res => {
        const column = this.findObject(this.option.column, "deptId");
        column.dicData = res.data.data;
      });
    },
    methods: {
      nodeClick(data) {
@@ -690,10 +743,10 @@
          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;
        });
        // getPostList(tenantId).then(res => {
        //   const column = this.findObject(this.option.group, "postId");
        //   column.dicData = res.data.data;
        // });
      },
      submitRole() {
        const roleList = this.$refs.treeRole.getCheckedKeys().join(",");
@@ -707,9 +760,9 @@
        });
      },
      rowSave(row, done, loading) {
        row.deptId = row.deptId.join(",");
        row.roleId = row.roleId.join(",");
        row.postId = row.postId.join(",");
        // 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);
@@ -724,9 +777,9 @@
        });
      },
      rowUpdate(row, index, done, loading) {
        row.deptId = row.deptId.join(",");
        row.roleId = row.roleId.join(",");
        row.postId = row.postId.join(",");
        // row.deptId = row.deptId.join(",");
        // row.roleId = row.roleId.join(",");
        // row.postId = row.postId.join(",");
        update(row).then(() => {
          this.initFlag = false;
          this.onLoad(this.page);
@@ -888,15 +941,16 @@
        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(",");
            }
            //设置为多选时打开
            // 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;
@@ -913,6 +967,9 @@
      },
      onLoad(page, params = {}) {
        this.loading = true;
        if (this.query.deptId){
          this.treeDeptId = this.query.deptId
        }
        getList(page.currentPage, page.pageSize, Object.assign(params, this.query), this.treeDeptId).then(res => {
          const data = res.data.data;
          this.page.total = data.total;
vue.config.js
@@ -22,7 +22,7 @@
  },
  //开发模式反向代理配置,生产模式请使用Nginx部署并配置反向代理
  devServer: {
    port: 1888,
    port: 2000,
    proxy: {
      '/api': {
        //本地服务接口地址