hjs 1 год назад
Родитель
Сommit
a15a4b7e79

+ 2 - 2
public/config.js

@@ -1,5 +1,5 @@
 window.g = {
-  ApiUrl: 'http://192.168.11.11:9100/yx-fyzd', //本地
-  // ApiUrl: 'https://tx.hz-hanghui.com:8088/yx-fyzd', //线上
+  // ApiUrl: 'http://192.168.11.11:9100/yx-fyzd', //本地
+  ApiUrl: 'https://tx.hz-hanghui.com:8088/yx-fyzd', //线上
 
 }

+ 43 - 0
src/api/area.js

@@ -0,0 +1,43 @@
+import request from '@/utils/request'
+// 获取区域列表分页
+export function getAreaPageList(data) {
+  return request({
+    url: '/admin/third/platform/page',
+    method: 'post',
+    data
+  })
+}
+
+// 获取区域列表
+export function getAreaList(data) {
+  return request({
+    url: '/admin/third/platform/list',
+    method: 'post',
+    data
+  })
+}
+
+// 添加/编辑区域
+export function addOrUpdate(data) {
+  return request({
+    url: '/admin/third/platform/create',
+    method: 'post',
+    data
+  })
+}
+
+// 删除指定区域
+export function deleteArea(areaId) {
+  return request({
+    url: `admin/third/platform/zone/delete/${areaId}`,
+    method: 'get'
+  })
+}
+
+// 删除指定区域的设备
+export function deleteDeviceOfArea(areaId, deviceId) {
+  return request({
+    url: `admin/third/platform/zone/sn/delete/${areaId}/${deviceId}`,
+    method: 'get'
+  })
+}

+ 1 - 1
src/api/exception_model.js

@@ -39,7 +39,7 @@ export function deleteCattle(id) {
     url: '/admin/userBlackList/deleteCattle',
     method: 'get',
     params: {
-       id
+      id
     }
   })
 }

+ 2 - 3
src/api/user_manage.js

@@ -8,7 +8,6 @@ export function getAdminListNew(data) {
   })
 }
 
-
 // 获得管理员列表
 export function getUserList(data) {
   return request({
@@ -22,7 +21,7 @@ export function getUserList(data) {
 export function getUserListSearch() {
   return request({
     url: '/admin/auth/getAdminlist',
-    method: 'post',
+    method: 'post'
   })
 }
 
@@ -445,7 +444,7 @@ export function getPlaceAreas(data) {
   return request({
     url: '/admin/auth/getPlaceAreas',
     method: 'get',
-    params:{}
+    params: {}
   })
 }
 // -------------获取商户平台列表-------------

BIN
src/icons/images/ic_plus.png


+ 0 - 2
src/main.js

@@ -16,8 +16,6 @@ import router from './router'
 import '@/icons' // icon
 import '@/permission' // permission control
 
-
-
 /**
  * If you don't want to use mock-server
  * you want to use MockJs for mock api

+ 61 - 0
src/mixins/tableMixins.js

@@ -0,0 +1,61 @@
+const tableMixins = {
+  data() {
+    return {
+      labelCol: { span: 4 }, // label宽
+      wrapperCol: { span: 20 }, // item宽
+      tableData: [], // table数据
+      tableLoading: false, // 是否加载中
+      sortOrder: 'descend', // 排序
+      pagination: { // 分页
+        current: 1, // 当前页码
+        pageSize: 10, // 每页条数
+        total: 0, // 总数
+        showTotal: total => `共有${total}条数据`, // 显示总数
+        pageSizeOptions: [10, 20, 50, 100], // 分页选项
+        layout: 'total, sizes, prev, pager, next, jumper'
+      }
+    }
+  },
+  mounted() {
+    this.initData()
+  },
+  methods: {
+    getFilterParams() {
+      const params = {
+        pageNumber: this.pagination.current,
+        pageSize: this.pagination.pageSize,
+        data: { ...this.transformFilterForm() }
+      }
+      return params
+    },
+    transformFilterForm() {
+      return {}
+    },
+    setDataList(data) {
+      this.pagination.total = data.total || 0
+      this.tableData = data.list || []
+    },
+    handleSizeChange(current, size) {
+      this.getTableList()
+    },
+    async resetFilterFormParams() {
+      this.form = {}
+      this.clearPageParams()
+      await this.getTableList()
+    },
+    clearPageParams() {
+      this.sortOrder = 'descend'
+      this.pagination.current = 1
+      this.pagination.pageSize = 10
+    },
+    onTableChange(pagination, filters, sorter) {
+      this.sortOrder = sorter.order === 'descend' ? 'descend' : 'ascend'
+      this.pagination = pagination
+      this.tableChange(pagination, filters, sorter)
+      this.getTableList()
+    },
+    tableChange(pagination, filters, sorter) {}
+  }
+}
+
+export default tableMixins

+ 12 - 0
src/router/index.js

@@ -66,6 +66,18 @@ export const constantRoutes = [
       }
     ]
   },
+  {
+    path: '/area',
+    component: Layout,
+    children: [
+      {
+        path: 'index',
+        name: 'area_manage',
+        component: () => import('@/views/area/index'),
+        meta: { title: '区域名称列表', role: [5], icon: 'el-icon-map-location' }
+      }
+    ]
+  },
   {
     path: '/enterprise',
     component: Layout,

+ 349 - 0
src/views/area/index.vue

@@ -0,0 +1,349 @@
+<template>
+  <div class="app-container">
+    <addModal ref="addModel" :machine-list="machineList" @success="modalSuccess" />
+    <!--搜索区-->
+    <el-select v-model="form.zoneId" filterable clearable placeholder="请选择区域" class="input" no-data-text="“选择区域”为空">
+      <el-option
+        v-for="(item, index) in areaPreviewList"
+        :key="index"
+        :label="item.name"
+        :value="item.id"
+      />
+    </el-select>
+    <el-select
+      v-model="form.sn"
+      filterable
+      clearable
+      placeholder="请选择设备编号"
+      class="margin-left input"
+    >
+      <el-option
+        v-for="(item, index) in machineList"
+        :key="index"
+        :label="item.sn"
+        :value="item.sn"
+      />
+    </el-select>
+    <el-select
+      v-model="form.sn"
+      filterable
+      clearable
+      placeholder="请选择设备地点"
+      class="margin-left input"
+    >
+      <el-option
+        v-for="(item, index) in machineList"
+        :key="index"
+        :label="item.name"
+        :value="item.sn"
+      />
+    </el-select>
+    <el-button type="primary" icon="el-icon-search" class="margin-left" @click="query">搜索</el-button>
+    <!--主表格-->
+    <div class="table-wrap">
+      <div class="table-add" @click="handleCreate">
+        <img src="@/icons/images/ic_plus.png">
+      </div>
+      <div v-for="(item, index) in tableData" :key="index" class="table-item">
+        <div class="table-item-head">
+          <div class="head-title">{{ item.name }}</div>
+          <div style="flex:auto;" />
+          <el-button type="primary" size="small" round @click="handleUpdate(item)">编辑</el-button>
+          <el-button type="danger" icon="el-icon-delete" size="small" circle plain @click="handleAreaDelete(item)" />
+        </div>
+        <div class="table-item-content">
+          <div v-for="(itemS, indexS) in item.devices" :key="indexS" class="content-item">
+            <div class="content-item-id">{{ itemS.sn }}</div>
+            <div class="content-item-name">{{ itemS.name }}</div>
+            <div class="content-item-status">
+              <el-tag v-if="itemS.online === 1" type="success">在线</el-tag>
+              <el-tag v-else type="info">离线</el-tag>
+              <el-button type="danger" icon="el-icon-close" size="mini" class="content-item-status-delete" circle @click="handleDeviceDelete(item.id, itemS)" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!--分页栏-->
+    <pagination
+      :total="pagination.total"
+      :page.sync="pagination.current"
+      :limit.sync="pagination.pageSize"
+      :page-sizes="pagination.pageSizeOptions"
+      :layout="pagination.layout"
+      @pagination="handleSizeChange"
+    />
+  </div>
+</template>
+
+<script>
+import { getAreaPageList, getAreaList, deleteArea, deleteDeviceOfArea } from '@/api/area'
+import { getFaceDeviceList } from '@/api/old_api_pengwenbing'
+import tableMixins from '@/mixins/tableMixins'
+import Pagination from '@/components/Pagination'
+import AddModal from './modal/AddModal.vue'
+
+export default {
+  components: { Pagination, AddModal },
+  mixins: [tableMixins],
+  data() {
+    return {
+      form: {
+        zoneId: null,
+        adminId: null,
+        sn: null
+      },
+      areaPreviewList: [],
+      // 设备列表_搜索
+      machineList: []
+    }
+  },
+  methods: {
+    initData() {
+      this.form.adminId = this.$store.getters.adminId
+      this.getAreaList()
+      this.getFaceDeviceList()
+      this.getTableList()
+    },
+    // 返回所有的区域列表概览
+    async getAreaList() {
+      try {
+        const result = await getAreaList(this.form)
+        this.areaPreviewList = result.data
+      } catch (e) {
+        console.log(e)
+        this.areaPreviewList = []
+      }
+    },
+    // 获取设备列表-搜索
+    getFaceDeviceList() {
+      getFaceDeviceList().then((res) => {
+        this.machineList = res.data
+      })
+    },
+    // 获取表格数据
+    async getTableList() {
+      this.tableLoading = true
+      try {
+        const result = await getAreaPageList(this.getFilterParams())
+        this.setDataList(result.data)
+      } catch (e) {
+        console.log(e)
+      } finally {
+        this.tableLoading = false
+      }
+    },
+    // 获取筛选信息
+    query() {
+      this.clearPageParams()
+      this.getTableList()
+    },
+    // 增加筛选条件
+    transformFilterForm() {
+      return this.form
+    },
+    modalSuccess(isEdit) {
+      if (!isEdit) {
+        this.clearPageParams()
+      }
+      this.getTableList()
+    },
+    handleCreate() {
+      this.$refs.addModel.open()
+    },
+    handleUpdate(row) {
+      this.$refs.addModel.open(Object.assign({}, row))
+    },
+    handleAreaDelete(row) {
+      const that = this
+      this.$confirm('确定要删除此区域吗?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        showClose: false,
+        type: 'warning',
+        beforeClose: async(action, instance, done) => {
+          if (action === 'confirm') {
+            instance.confirmButtonLoading = true
+            instance.cancelButtonLoading = true
+            instance.confirmButtonText = '提交中...'
+            try {
+              await deleteArea(row.id)
+              this.$message({
+                type: 'success',
+                message: '删除成功!'
+              })
+              that.getAreaList()
+              that.getTableList()
+            } catch (e) {
+              // this.$message({
+              //   type: 'error',
+              //   message: '删除失败!'
+              // })
+            } finally {
+              done()
+              setTimeout(() => {
+                instance.confirmButtonLoading = false
+                instance.cancelButtonLoading = false
+              }, 300)
+            }
+          } else {
+            done()
+          }
+        }
+      }).then(() => {}).catch(() => {})
+    },
+    handleDeviceDelete(areaId, row) {
+      const that = this
+      this.$confirm('确定要解绑此设备吗?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        showClose: false,
+        type: 'warning',
+        beforeClose: async(action, instance, done) => {
+          if (action === 'confirm') {
+            instance.confirmButtonLoading = true
+            instance.cancelButtonLoading = true
+            instance.confirmButtonText = '提交中...'
+            try {
+              await deleteDeviceOfArea(areaId, row.sn)
+              this.$message({
+                type: 'success',
+                message: '解绑成功!'
+              })
+              that.getTableList()
+            } catch (e) {
+              // this.$message({
+              //   type: 'error',
+              //   message: '解绑失败!'
+              // })
+            } finally {
+              done()
+              setTimeout(() => {
+                instance.confirmButtonLoading = false
+                instance.cancelButtonLoading = false
+              }, 300)
+            }
+          } else {
+            done()
+          }
+        }
+      }).then(() => {}).catch(() => {})
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+  .table{
+    margin-top: 15px;
+  }
+  .flex {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+  }
+  .margin-left {
+    margin: 10px 0 0 10px;
+  }
+  .input {
+    width: 200px;
+  }
+  ::-webkit-scrollbar{
+    width: 6px;
+    height: 6px;
+    background-color: #F1F2F5;
+  }
+
+::-webkit-scrollbar-thumb{
+  background-color:#BFC6D4;
+  border-radius: 10px;
+}
+::-webkit-scrollbar-track{
+  background-color: transparent;
+}
+  .table-wrap {
+    display: flex;
+    flex-wrap: wrap;
+    & > div {
+      margin-top: 28px;
+      margin-left: 1%;
+      min-width: 375px;
+      width: 32%;
+      height: 256px;
+      flex: none;
+      overflow: hidden;
+      border: 1px solid #E3E9F8;
+      border-radius: 8px;
+    }
+    & > div:nth-of-type(3n+1) {
+      margin-left: 0;
+    }
+    .table-add {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      background-color: #F8FAFF;
+      cursor: pointer;
+      & img {
+        width: 80px;
+        height: 80px;
+      }
+    }
+    .table-item {
+      display: flex;
+      flex-direction: column;
+      .table-item-head {
+        width: 100%;
+        height: 62px;
+        display: flex;
+        align-items: center;
+        padding: 0 14px 0 20px;
+        background-color: #E3EBFF57;
+        .head-title {
+          font-size: 20px;
+          color: #1B55AB;
+        }
+      }
+      .table-item-content {
+        width: 100%;
+        padding: 0 12px;
+        height: calc(256px - 62px);
+        overflow: auto;
+        .content-item {
+          margin-top: 12px;
+          padding: 4px 6px;
+          display: flex;
+          align-items: center;
+          font-size: 14xp;
+          color: #606266;
+          &:last-of-type {
+            margin-bottom: 12px;
+          }
+          &:hover {
+            background-color: #F5F8FF;
+            border-radius: 5px;
+            .content-item-status .content-item-status-delete {
+              visibility: visible;
+            }
+          }
+          .content-item-id {
+            width: 160px;
+            flex: none;
+          }
+          .content-item-name {
+            flex: auto;
+          }
+          .content-item-status {
+            flex: none;
+            display: flex;
+            align-items: center;
+            .content-item-status-delete {
+              margin-left: 15px;
+              visibility: hidden;
+              padding: 3px !important;
+            }
+          }
+        }
+      }
+    }
+  }
+</style>

+ 121 - 0
src/views/area/modal/AddModal.vue

@@ -0,0 +1,121 @@
+// 添加/修改商户
+<template>
+  <el-dialog
+    :title="isEdit ? '编辑区域' : '添加区域'"
+    width="766px"
+    :visible.sync="visible"
+    :destroy-on-close="false"
+    :close-on-click-modal="false"
+  >
+    <el-form ref="form" :rules="rules" :model="form" label-position="left" label-width="100px">
+      <el-form-item prop="id" style="margin-bottom: 0;">&nbsp;</el-form-item>
+      <el-form-item label="区域名称" prop="name" required>
+        <el-input v-model="form.name" placeholder="请输入区域名称" />
+      </el-form-item>
+      <el-form-item label="绑定设备" prop="snJson" required>
+        <el-select v-model="form.snJson" class="filter-item" placeholder="请选择设备进行绑定" clearable multiple filterable>
+          <el-option v-for="(item, index) in machineList" :key="index" :label="item.sn" :value="item.sn" />
+        </el-select>
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">
+        取消
+      </el-button>
+      <el-button type="primary" :loading="submitLoading" @click="submit">
+        确定
+      </el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { addOrUpdate } from '@/api/area'
+
+export default {
+  props: {
+    machineList: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      form: {
+        id: null,
+        name: null,
+        snJson: null
+      },
+      rules: {
+        name: [
+          { required: true, whitespace: true, message: '不能为空!', trigger: ['change', 'blur'] }
+        ],
+        snJson: [
+          { required: true, type: 'array', message: '不能为空!', trigger: ['change', 'blur'] }
+        ]
+      },
+      visible: false,
+      submitLoading: false,
+      isEdit: false
+    }
+  },
+  methods: {
+    open(obj) {
+      this.visible = true
+      this.submitLoading = false
+      this.$nextTick(() => {
+        this.$refs.form.resetFields()
+        if (obj && Object.keys(obj).length > 0) {
+          this.form.id = obj.id
+          this.form.name = obj.name
+          if (obj.snJson) {
+            this.form.snJson = obj.snJson.split(',')
+          } else {
+            this.form.snJson = null
+          }
+          this.isEdit = true
+        } else {
+          this.isEdit = false
+        }
+      })
+    },
+    submit(e) {
+      console.info('form-->', this.form)
+      e.preventDefault()
+      this.$refs.form.validate(async(valid) => {
+        if (!valid) {
+          return false
+        }
+        if (this.submitLoading) {
+          return
+        }
+        if (this.form.snJson && this.form.snJson.length > 0) {
+          this.form.snJson = this.form.snJson.join(',')
+        } else {
+          this.form.snJson = null
+        }
+        this.submitLoading = true
+        try {
+          await addOrUpdate({ ...this.form, adminId: this.$store.getters.adminId })
+          this.visible = false
+          this.$emit('success', this.isEdit)
+        } catch (e) {
+          this.$refs.form.resetFields()
+          console.info('add', e)
+        } finally {
+          this.submitLoading = false
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+::v-deep .el-select {
+  width: 100%;
+}
+::v-deep .el-dialog__body {
+  padding-bottom: 0;
+}
+</style>

+ 325 - 93
src/views/basic_setup/index.vue

@@ -188,8 +188,8 @@
       </div>
       <div class="flex">
         <el-form-item
+          v-if="user_form.placeType === 0 && user_form.type === 5"
           label="实名认证年龄区间"
-          v-if="user_form.placeType == 0 && user_form.type === 5"
           class="item-margin-bottom"
         >
           <el-tooltip
@@ -243,11 +243,23 @@
           </el-select>
         </el-form-item>
       </div>
-
+      <div v-if="user_form.clockWayType === '1'" class="flex">
+        <el-form-item
+          label-width="200px"
+          style="margin-left:0;"
+          label="打卡方式-通用推送地址"
+          class="form-item-style"
+        >
+          <el-input
+            v-model="user_form.clockWayPushUrl"
+            placeholder="请输入"
+          />
+        </el-form-item>
+      </div>
       <!-- 设备显示配置 -->
       <div v-if="user_form.type === 5">
         <div class="title">
-          <div class="line"></div>
+          <div class="line" />
           <span>设备显示配置</span>
         </div>
         <div class="flex">
@@ -262,18 +274,120 @@
               placeholder="请输入顶部标题"
               maxlength="8"
               show-word-limit
-            ></el-input>
+            />
           </el-form-item>
+        </div>
+        <div v-if="user_form.openThirdLinkPlatform" class="interfaceAddress-layout">
+          <div v-for="(interfaceAddressItem, index) in user_form.interfaceAddresses" :key="index" style="width:100%;display: flex;align-items: center;">
+            <el-form-item
+              label-width="110px"
+              :label="`联动地址${index+1}`"
+              class="form-item-style"
+              style="width: 533px;flex:none;"
+              :prop="`interfaceAddresses.${index}.interfAddr`"
+            >
+              <el-input
+                v-model="interfaceAddressItem.interfAddr"
+                placeholder="请输入联动地址"
+              />
+            </el-form-item>
+            <el-form-item
+              label-width="120px"
+              label="绑定区域"
+              class="form-item-style"
+              style="margin-left:60px;width:455px;flex:none;"
+              :prop="`interfaceAddresses.${index}.zoneId`"
+            >
+              <el-select
+                v-model="interfaceAddressItem.zoneId"
+                filterable
+                style="width:100%;"
+                placeholder="请绑定区域"
+                @change="e => areaSelectChange(e, index)"
+              >
+                <el-option
+                  v-for="item in platformAreaList"
+                  :key="item.id"
+                  :label="item.name"
+                  :value="item.id"
+                  :disabled="selectedPlatformAreaList && selectedPlatformAreaList.length > 0 && selectedPlatformAreaList.includes(item.id)"
+                />
+              </el-select>
+            </el-form-item>
+            <el-button v-if="user_form.interfaceAddresses && user_form.interfaceAddresses.length > 1" icon="el-icon-close" size="small" circle style="align-self: flex-start;margin:4px 0 0 6px;" @click.prevent="removeInterfaceAddress(index, interfaceAddressItem.zoneId)" />
+            <el-button icon="el-icon-plus" size="small" circle style="align-self: flex-start;margin:4px 0 0 6px;" @click.prevent="addInterfaceAddress" />
+          </div>
+        </div>
+        <div class="flex">
           <el-form-item
             label-width="120px"
-            label="二维码码值"
-            class="form-item-style special"
-            prop="qrcodeText"
+            label="成功通行结果"
+            class="form-item-style"
+            prop="subLineSuccess"
           >
             <el-input
-              v-model="user_form.qrcodeText"
-              placeholder="二维码码值"
-            ></el-input>
+              v-model="user_form.subLineSuccess"
+              placeholder="请输入成功通行结果"
+            />
+          </el-form-item>
+          <el-form-item
+            label-width="120px"
+            label="失败通行结果"
+            class="form-item-style"
+            prop="subLineFail"
+          >
+            <el-input
+              v-model="user_form.subLineFail"
+              placeholder="请输入失败通行结果"
+            />
+          </el-form-item>
+        </div>
+        <div class="flex">
+          <el-form-item
+            label-width="120px"
+            label="左副框上层"
+            class="form-item-style"
+            prop="mainLineLeft"
+          >
+            <el-input
+              v-model="user_form.mainLineLeft"
+              placeholder="请输入左副框上层"
+            />
+          </el-form-item>
+          <el-form-item
+            label-width="120px"
+            label="左副框下层"
+            class="form-item-style"
+            prop="subLineLeft"
+          >
+            <el-input
+              v-model="user_form.subLineLeft"
+              placeholder="请输入左副框下层"
+            />
+          </el-form-item>
+        </div>
+        <div class="flex">
+          <el-form-item
+            label-width="120px"
+            label="右副框上层"
+            class="form-item-style"
+            prop="mainLineRight"
+          >
+            <el-input
+              v-model="user_form.mainLineRight"
+              placeholder="请输入右副框上层"
+            />
+          </el-form-item>
+          <el-form-item
+            label-width="120px"
+            label="右副框下层"
+            class="form-item-style"
+            prop="subLineRight"
+          >
+            <el-input
+              v-model="user_form.subLineRight"
+              placeholder="请输入右副框下层"
+            />
           </el-form-item>
         </div>
         <div class="flex">
@@ -288,6 +402,44 @@
               <el-radio :label="true">是</el-radio>
             </el-radio-group>
           </el-form-item>
+          <el-form-item
+            label-width="120px"
+            label="二维码码值"
+            class="form-item-style special"
+            prop="qrcodeText"
+          >
+            <el-input
+              v-model="user_form.qrcodeText"
+              placeholder="二维码码值"
+            />
+          </el-form-item>
+        </div>
+        <div class="flex">
+          <el-form-item
+            label-width="120px"
+            label="成功语音播报"
+            class="form-item-style"
+            prop="openVoiceMsgSuccess"
+          >
+            <el-input
+              v-model="user_form.openVoiceMsgSuccess"
+              placeholder="请输入成功语音播报"
+            />
+          </el-form-item>
+          <el-form-item
+            label-width="120px"
+            label="失败语音播报"
+            class="form-item-style"
+            prop="openVoiceMsgFail"
+          >
+            <el-input
+              v-model="user_form.openVoiceMsgFail"
+              placeholder="请输入失败语音播报"
+            />
+          </el-form-item>
+        </div>
+
+        <div class="flex">
           <el-form-item
             label-width="120px"
             :label="
@@ -321,24 +473,54 @@
                   user_form.showQrcode ? 'upload-img1' : 'upload-img2',
                 ]"
               >
-                <i class="el-icon-picture-outline"></i>上传图片
+                <i class="el-icon-picture-outline" />上传图片
               </div>
               <div
+                v-else
                 :class="[
                   'upload-img',
                   user_form.showQrcode ? 'upload-img1' : 'upload-img2',
                 ]"
-                v-else
               >
-                <img :src="user_form.advertise" />
-                <span @click.stop="handleRemove('advertise')" class="del-img"
-                  >x</span
-                >
+                <img :src="user_form.advertise">
+                <span class="del-img" @click.stop="handleRemove('advertise')">x</span>
+              </div>
+            </el-upload>
+          </el-form-item>
+          <el-form-item
+            label-width="120px"
+            label="首页图片配置"
+            class="form-item-style item-margin-bottom special"
+            prop="homeImgUrl"
+          >
+            <el-upload
+              ref="upload"
+              name="file"
+              class="avatar-uploader"
+              :action="doUpload"
+              :show-file-list="false"
+              :http-request="
+                (event) => {
+                  doUploadAvatar1(event, 'homeImgUrl');
+                }
+              "
+              :before-upload="beforeAvatarUpload"
+              :auto-upload="true"
+              accept="image/png,image/gif,image/jpg,image/jpeg"
+            >
+              <img
+                v-if="!user_form.homeImgUrl"
+                src="../../assets/default-img-home.jpg"
+                class="upload-img3"
+              >
+              <div v-else class="upload-img3">
+                <img :src="user_form.homeImgUrl">
+                <span @click.stop="handleRemove('homeImgUrl')" class="del-img">x</span>
               </div>
             </el-upload>
           </el-form-item>
         </div>
-        <div class="flex">
+        <div v-if="false" class="flex">
           <el-form-item
             label-width="120px"
             label="屏保图片配置"
@@ -368,41 +550,6 @@
               </div>
             </el-upload>
           </el-form-item>
-          <el-form-item
-            label-width="120px"
-            label="首页图片配置"
-            class="form-item-style item-margin-bottom special"
-            prop="homeImgUrl"
-          >
-            <el-upload
-              ref="upload"
-              name="file"
-              class="avatar-uploader"
-              :action="doUpload"
-              :show-file-list="false"
-              :http-request="
-                (event) => {
-                  doUploadAvatar1(event, 'homeImgUrl');
-                }
-              "
-              :before-upload="beforeAvatarUpload"
-              :auto-upload="true"
-              accept="image/png,image/gif,image/jpg,image/jpeg"
-            >
-              <img
-                src="../../assets/default-img-home.jpg"
-                alt=""
-                v-if="!user_form.homeImgUrl"
-                class="upload-img3"
-              />
-              <div class="upload-img3" v-else>
-                <img :src="user_form.homeImgUrl" />
-                <span @click.stop="handleRemove('homeImgUrl')" class="del-img"
-                  >x</span
-                >
-              </div>
-            </el-upload>
-          </el-form-item>
         </div>
       </div>
     </el-form>
@@ -416,13 +563,14 @@
 </template>
 
 <script>
-import { checkRole } from "@/utils/checkRole";
-import { getInfo } from "@/api/user";
+import { checkRole } from "@/utils/checkRole"
+import { getInfo } from "@/api/user"
+import { getAreaList } from '@/api/area'
 import { doEditSelf, pictureLocal } from "@/api/ordinary_user";
 import { getFaceDeviceList } from "@/api/old_api_pengwenbing";
 
 export default {
-  name: "",
+  name: '',
   components: {},
   data() {
     return {
@@ -435,6 +583,9 @@ export default {
         userVisiterEffectiveTime: 0.3, //访客有效期
         isPush: 0,
         cardPhysics: 2,
+        clockWayPushUrl: null,
+        clockWayType: 0,
+        openThirdLinkPlatform: false,
         whiteVisitorType: ["1", "2"],
         nucleicExpirationTime: null,
         realAuthenticationAgeStart: null,
@@ -443,11 +594,21 @@ export default {
         notAllowAgeStart: 0,
         screenShowPhotos: [],
         topTitle: null,
+        interfaceAddresses: [{
+          interfAddr: null,
+          zoneId: null
+        }],
+        subLineSuccess: null,
+        subLineFail: null,
+        mainLineLeft: null,
+        subLineLeft: null,
+        mainLineRight: null,
+        subLineRight: null,
         examDeviceList: [], //考试设备列表
         qrcodeText: null, //二维码码值
         showQrcode: false, //二维码是否显示
         advertise: null, //广告图片
-        homeImgUrl: null, //首页图片配置
+        homeImgUrl: null //首页图片配置
       },
 
       // 验证规则
@@ -522,25 +683,93 @@ export default {
       doUpload: "",
       // 设备列表_搜索
       machine_list: [],
-    };
+      // 弹框区域列表
+      platformAreaList: [],
+      // 选中的区域列表
+      selectedPlatformAreaList: []
+    }
+  },
+  mounted() {
+    this.getInfo()
+  },
+  created() {
+    this.getFaceDeviceList()
   },
-
   methods: {
     // 查询权限
     checkRole,
     getInfo(type) {
       getInfo().then((res) => {
-        this.user_form = JSON.parse(JSON.stringify(res.data));
+        this.user_form = JSON.parse(JSON.stringify(res.data))
         if (type) {
-          this.$message.success("重置成功!");
+          this.$message.success("重置成功!")
+        } else {
+          if (this.user_form.openThirdLinkPlatform) {
+            this.selectedPlatformAreaList = []
+            this.getPlatformList(this.$store.getters.adminId)
+          }
+          if (!this.user_form.interfaceAddresses || this.user_form.interfaceAddresses.length <= 0) {
+            this.user_form.interfaceAddresses = []
+            this.user_form.interfaceAddresses.push({
+              interfAddr: null,
+              zoneId: null
+            })
+          }
         }
-      });
+      })
+    },
+    // 获取区域列表
+    getPlatformList(adminId) {
+      getAreaList({ adminId }).then((res) => {
+        this.platformAreaList = res.data
+        this.platformAreaList.unshift({
+          id: 0,
+          name: '全部'
+        })
+        if (this.user_form.interfaceAddresses && this.user_form.interfaceAddresses.length > 0) {
+          for (let i = 0; i < this.user_form.interfaceAddresses.length; i++) {
+            if (this.user_form.interfaceAddresses[i].zoneId !== null) {
+              this.selectedPlatformAreaList.push(this.user_form.interfaceAddresses[i].zoneId)
+            }
+          }
+        }
+      })
+    },
+    areaSelectChange(value, index) {
+      if (this.selectedPlatformAreaList[index] !== null) {
+        this.selectedPlatformAreaList[index] = value
+      } else {
+        this.selectedPlatformAreaList.push(value)
+      }
+    },
+    removeInterfaceAddress(index, value) {
+      this.user_form.interfaceAddresses.splice(index, 1)
+      this.selectedPlatformAreaList = this.selectedPlatformAreaList.filter(function(item) {
+        return item !== value
+      })
+    },
+    addInterfaceAddress() {
+      this.user_form.interfaceAddresses.push({
+        interfAddr: null,
+        zoneId: null
+      })
     },
     // 修改
     updateAdmin() {
       if (!this.user_form.homeImgUrl) {
         this.user_form.homeImgUrl =
-          "https://tx.hz-hanghui.com:8088/yx-fyzd/file/icon/face.jpg";
+          "https://tx.hz-hanghui.com:8088/yx-fyzd/file/icon/face.jpg"
+      }
+      if (!this.user_form.openThirdLinkPlatform) {
+        this.user_form.interfaceAddresses = null
+      }
+      if (this.user_form.interfaceAddresses && this.user_form.interfaceAddresses.length > 0) {
+        this.user_form.interfaceAddresses = this.user_form.interfaceAddresses.filter(item => {
+          return item.interfAddr !== null && item.zoneId !== null
+        })
+        if (this.user_form.interfaceAddresses.length <= 0) {
+          this.user_form.interfaceAddresses = null
+        }
       }
       doEditSelf(this.user_form).then((res) => {
         this.$message({
@@ -579,49 +808,41 @@ export default {
       if (!isLt2M) {
         this.$notify.warning({
           title: "警告",
-          message: "图片大小必须小于2M",
-        });
-        return;
+          message: "图片大小必须小于2M"
+        })
+        return
       }
     },
     doUploadAvatar(obj) {
-      this.user_form.screenShowPhotos = [];
-      var avatar = new FormData();
-      avatar.append("file", obj.file);
+      this.user_form.screenShowPhotos = []
+      var avatar = new FormData()
+      avatar.append('file', obj.file)
       pictureLocal(avatar).then((res) => {
-        let data = {
+        const data = {
           name: obj.file.name,
-          url: res.data,
-        };
-        this.user_form.screenShowPhotos.push(data);
-      });
+          url: res.data
+        }
+        this.user_form.screenShowPhotos.push(data)
+      })
     },
     doUploadAvatar1(obj, type) {
-      this.listLoading = true;
-      var avatar = new FormData();
-      avatar.append("file", obj.file);
+      this.listLoading = true
+      var avatar = new FormData()
+      avatar.append('file', obj.file)
       pictureLocal(avatar).then((res) => {
-        this.value = res.data;
-        this.listLoading = false;
-        this.$set(this.user_form, type, res.data);
-      });
+        this.value = res.data
+        this.listLoading = false
+        this.$set(this.user_form, type, res.data)
+      })
     },
     // 获取设备列表-搜索
     getFaceDeviceList() {
       getFaceDeviceList().then((res) => {
-        this.machine_list = res.data;
-      });
-    },
-  },
-  computed: {},
-  watch: {},
-  created() {
-    this.getFaceDeviceList();
-  },
-  mounted() {
-    this.getInfo();
-  },
-};
+        this.machine_list = res.data
+      })
+    }
+  }
+}
 </script>
 
 <style scoped lang="scss">
@@ -630,6 +851,9 @@ export default {
   justify-content: flex-start;
   align-items: start;
   width: 1150px;
+  & > div:nth-child(1) {
+    margin-right: 60px;
+  }
 }
 .sure {
   margin-left: 520px;
@@ -752,6 +976,14 @@ export default {
 .custom-css-item:last-child {
   border-bottom: none;
 }
+.interfaceAddress-layout {
+  width: 1155px;
+  padding: 0 10px;
+  border: 1px solid #D6EAFF;
+  border-radius: 6px;
+  padding-top: 18px;
+  margin-bottom: 17px;
+}
 </style>
 <style lang="scss">
 //修改element原生样式

+ 256 - 174
src/views/user_manage/index.vue

@@ -356,9 +356,9 @@
       :close-on-click-modal="false"
     >
       <el-form
+        ref="user_form"
         :model="user_form"
         :rules="rules"
-        ref="user_form"
         label-width="150px"
         label-position="left"
       >
@@ -529,10 +529,10 @@
           </div>
           <div class="flex">
             <el-form-item
+              v-if="dialogType === 'add'"
               label="账号级别"
               class="form-item-style"
               prop="type"
-              v-if="dialogType === 'add'"
             >
               <el-select
                 v-model="user_form.type"
@@ -542,12 +542,11 @@
               >
                 <el-option
                   v-for="item in type_list"
-                  :disabled="item.disabled"
                   :key="item.id"
+                  :disabled="item.disabled"
                   :label="item.name"
                   :value="item.id"
-                >
-                </el-option>
+                />
               </el-select>
             </el-form-item>
             <el-form-item
@@ -563,12 +562,11 @@
               >
                 <el-option
                   v-for="item in tag_list"
-                  :disabled="item.disabled"
                   :key="item.id"
+                  :disabled="item.disabled"
                   :label="item.name"
                   :value="item.id"
-                >
-                </el-option>
+                />
               </el-select>
             </el-form-item>
           </div>
@@ -647,11 +645,11 @@
                 placement="bottom"
               >
                 <el-input-number
-                  size="mini"
-                  :precision="1"
                   v-model="user_form.userWhitelistEffectiveTime"
+                  :precision="1"
                   :min="0"
-                ></el-input-number>
+                  size="mini"
+                />
               </el-tooltip>
             </el-form-item>
             <el-form-item
@@ -667,11 +665,11 @@
                 placement="bottom"
               >
                 <el-input-number
-                  size="mini"
-                  :precision="1"
                   v-model="user_form.userVisiterEffectiveTime"
+                  :precision="1"
                   :min="0"
-                ></el-input-number>
+                  size="mini"
+                />
               </el-tooltip>
             </el-form-item>
           </div>
@@ -689,10 +687,10 @@
                 placement="bottom"
               >
                 <el-input-number
-                  size="mini"
                   v-model="user_form.realAuthenticationAgeStart"
                   :min="0"
-                ></el-input-number>
+                  size="mini"
+                />
               </el-tooltip>
               <el-tooltip
@@ -703,10 +701,10 @@
                 placement="bottom"
               >
                 <el-input-number
-                  size="mini"
                   v-model="user_form.realAuthenticationAgeEnd"
                   :min="0"
-                ></el-input-number>
+                  size="mini"
+                />
               </el-tooltip>
             </el-form-item>
             <el-form-item
@@ -722,10 +720,10 @@
                 placement="bottom"
               >
                 <el-input-number
-                  size="mini"
                   v-model="user_form.notAllowAgeStart"
                   :min="0"
-                ></el-input-number>
+                  size="mini"
+                />
               </el-tooltip>
               <el-tooltip
@@ -736,10 +734,10 @@
                 placement="bottom"
               >
                 <el-input-number
-                  size="mini"
                   v-model="user_form.notAllowAgeEnd"
                   :min="0"
-                ></el-input-number>
+                  size="mini"
+                />
               </el-tooltip>
             </el-form-item>
           </div>
@@ -1242,14 +1240,16 @@
                   class="el-icon-download form-item-style"
                   type="text"
                   @click="getAppKeyAndAppSecret(true)"
-                  >密钥</el-button
                 >
+                  密钥
+                </el-button>
                 <el-button
                   class="el-icon-download form-item-style"
                   type="text"
                   @click="getAppKeyAndAppSecret(false)"
-                  >文档</el-button
                 >
+                  文档
+                </el-button>
               </span>
             </el-form-item>
             <el-form-item
@@ -1263,10 +1263,11 @@
                 placeholder="请输入顶部标题"
                 maxlength="8"
                 show-word-limit
-              ></el-input>
+              />
             </el-form-item>
           </div>
           <el-form-item
+            v-if="false"
             label-width="120px"
             label="地址"
             class="form-item-style"
@@ -1275,42 +1276,48 @@
             <el-input
               v-model="user_form.interfaceAddress"
               placeholder="请输入地址"
-            ></el-input>
+            />
           </el-form-item>
-          <div class="flex interfaceAddress-layout" v-if="false">
-            <el-form-item
-              label-width="120px"
-              label="联动地址"
-              class="form-item-style"
-              :prop="user_form.openThirdLinkPlatform?'interfaceAddressInterfAddr':''"
-            >
-              <el-input
-                v-model="user_form.interfaceAddress"
-                placeholder="请输入联动地址"
-              ></el-input>
-            </el-form-item>
-            <el-form-item
-              label-width="120px"
-              label="绑定区域"
-              class="form-item-style"
-              :prop="user_form.openThirdLinkPlatform?'interfaceAddressZoneId':''"
-            >
-              <el-select
-                filterable
-                clearable
-                v-model="user_form.interfaceAddress"
-                placeholder="请绑定区域"
-                class="input"
+          <div v-if="user_form.openThirdLinkPlatform" class="interfaceAddress-layout">
+            <div v-for="(interfaceAddressItem, index) in user_form.interfaceAddresses" :key="index" style="width:100%;display: flex;align-items: center;">
+              <el-form-item
+                label-width="110px"
+                :label="`联动地址${index+1}`"
+                class="form-item-style"
+                style="width: 533px;flex:none;"
+                :prop="`interfaceAddresses.${index}.interfAddr`"
               >
-                <el-option
-                  v-for="item in scene_list"
-                  :key="item.id"
-                  :label="item.name"
-                  :value="item.id"
+                <el-input
+                  v-model="interfaceAddressItem.interfAddr"
+                  placeholder="请输入联动地址"
+                />
+              </el-form-item>
+              <el-form-item
+                label-width="120px"
+                label="绑定区域"
+                class="form-item-style"
+                style="margin-left:60px;width:455px;flex:none;"
+                :prop="`interfaceAddresses.${index}.zoneId`"
+              >
+                <el-select
+                  v-model="interfaceAddressItem.zoneId"
+                  filterable
+                  style="width:100%;"
+                  placeholder="请绑定区域"
+                  @change="e => areaSelectChange(e, index)"
                 >
-                </el-option>
-              </el-select>
-            </el-form-item>
+                  <el-option
+                    v-for="item in platformAreaList"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id"
+                    :disabled="selectedPlatformAreaList && selectedPlatformAreaList.length > 0 && selectedPlatformAreaList.includes(item.id)"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-button v-if="user_form.interfaceAddresses && user_form.interfaceAddresses.length > 1" icon="el-icon-close" size="small" circle style="align-self: flex-start;margin:4px 0 0 6px;border:none;" @click.prevent="removeInterfaceAddress(index, interfaceAddressItem.zoneId)" />
+              <el-button type="info" icon="el-icon-plus" size="small" circle plain style="align-self: flex-start;margin:4px 0 0 6px;" @click.prevent="addInterfaceAddress" />
+            </div>
           </div>
           <div class="flex">
             <el-form-item
@@ -1322,7 +1329,7 @@
               <el-input
                 v-model="user_form.subLineSuccess"
                 placeholder="请输入成功通行结果"
-              ></el-input>
+              />
             </el-form-item>
             <el-form-item
               label-width="120px"
@@ -1333,7 +1340,7 @@
               <el-input
                 v-model="user_form.subLineFail"
                 placeholder="请输入失败通行结果"
-              ></el-input>
+              />
             </el-form-item>
           </div>
           <div class="flex">
@@ -1346,7 +1353,7 @@
               <el-input
                 v-model="user_form.mainLineLeft"
                 placeholder="请输入左副框上层"
-              ></el-input>
+              />
             </el-form-item>
             <el-form-item
               label-width="120px"
@@ -1357,7 +1364,7 @@
               <el-input
                 v-model="user_form.subLineLeft"
                 placeholder="请输入左副框下层"
-              ></el-input>
+              />
             </el-form-item>
           </div>
           <div class="flex">
@@ -1370,7 +1377,7 @@
               <el-input
                 v-model="user_form.mainLineRight"
                 placeholder="请输入右副框上层"
-              ></el-input>
+              />
             </el-form-item>
             <el-form-item
               label-width="120px"
@@ -1381,7 +1388,7 @@
               <el-input
                 v-model="user_form.subLineRight"
                 placeholder="请输入右副框下层"
-              ></el-input>
+              />
             </el-form-item>
           </div>
           <div class="flex">
@@ -1542,10 +1549,10 @@
       destroy-on-close
     >
       <el-table
-        class="table"
         ref="table_form_result"
         v-loading="false"
         :data="result_list"
+        class="table"
         element-loading-text="Loading"
         border
         fit
@@ -1585,13 +1592,14 @@ import {
   getTagList,
   getContextById,
   fieldOptions,
-  getPlaceAreas,
-} from "@/api/user_manage";
-import Pagination from "@/components/Pagination";
-import { checkRole } from "@/utils/checkRole";
-import { uploadAdminInfoExcel, pictureLocal } from "@/api/ordinary_user";
-import { batchDownload } from "@/utils/batchDownload";
-import { saveAs } from "file-saver"; //字符串保存成 TXT 文件保存到电脑
+  getPlaceAreas
+} from '@/api/user_manage'
+import { getAreaList } from '@/api/area'
+import Pagination from '@/components/Pagination'
+import { checkRole } from '@/utils/checkRole'
+import { uploadAdminInfoExcel, pictureLocal } from '@/api/ordinary_user'
+import { batchDownload } from '@/utils/batchDownload'
+import { saveAs } from 'file-saver' // 字符串保存成 TXT 文件保存到电脑
 
 // secondary package based on el-pagination
 
@@ -1600,11 +1608,11 @@ export default {
   filters: {
     matchNull(str) {
       if (!str) {
-        return "未填写";
+        return '未填写'
       } else {
-        return str;
+        return str
       }
-    },
+    }
   },
   computed: {
     regularCode() {
@@ -1797,6 +1805,10 @@ export default {
         homeImgUrl: null, //首页图片配置
         openThirdLinkPlatform: false,
         interfaceAddress: null,
+        interfaceAddresses: [{
+          interfAddr: null,
+          zoneId: null
+        }],
         subLineSuccess: null,
         subLineFail: null,
         mainLineLeft: null,
@@ -1804,7 +1816,7 @@ export default {
         mainLineRight: null,
         subLineRight: null,
         openVoiceMsgSuccess: null,
-        openVoiceMsgFail: null,
+        openVoiceMsgFail: null
       },
       user_form_copy: {},
       scene_list: [
@@ -2018,7 +2030,7 @@ export default {
           { required: true, message: "请输入钉钉密钥", trigger: "blur" },
         ],
         clockWayPushUrl: [
-          { required: true, message: "请输入推送地址", trigger: "blur" },
+          { required: false, message: "请输入推送地址", trigger: "blur" },
         ],
         disinfectFlag: [{ required: true, message: "请选择", trigger: "blur" }],
         problemReportFlag: [
@@ -2048,25 +2060,15 @@ export default {
             message: '请输入',
             trigger: 'blur'
           }
-        ],
-        interfaceAddressInterfAddr: [
-          {
-            required: true,
-            message: '请输入联动地址',
-            trigger: 'blur'
-          }
-        ],
-        interfaceAddressZoneId: [
-          {
-            required: true,
-            message: '请绑定区域',
-            trigger: 'blur'
-          }
         ]
       },
       // 批量导入结果返回
       resultVisible: false,
       result_list: [],
+      // 弹框区域列表
+      platformAreaList: [],
+      // 选中的区域列表
+      selectedPlatformAreaList: [],
       // 字段类型
       customType_list: [
         { id: 1, name: "文本" },
@@ -2085,145 +2087,188 @@ export default {
     };
   },
   created() {
-    this.fetchData();
-    this.getUserListSearch();
-    this.getAddressList(1);
-    this.getAddressListSearch(1);
-    this.fieldOptions();
+    this.fetchData()
+    this.getUserListSearch()
+    this.getAddressList(1)
+    this.getAddressListSearch(1)
+    this.fieldOptions()
     // 如果为省级账号则锁定省份的选择
     if (checkRole([2])) {
-      this.getAddressList(2, this.$store.getters.provinceId);
-      this.getAddressListSearch(2, this.$store.getters.provinceId);
-      this.getTagList(this.$store.getters.provinceId);
-      this.user_form.provinceId = this.$store.getters.provinceId;
-      this.page.data.provinceId = this.$store.getters.provinceId;
-      this.type_list[0].disabled = true;
+      this.getAddressList(2, this.$store.getters.provinceId)
+      this.getAddressListSearch(2, this.$store.getters.provinceId)
+      this.getTagList(this.$store.getters.provinceId)
+      this.user_form.provinceId = this.$store.getters.provinceId
+      this.page.data.provinceId = this.$store.getters.provinceId
+      this.type_list[0].disabled = true
     }
-    this.user_form_copy = JSON.parse(JSON.stringify(this.user_form));
+    this.user_form_copy = JSON.parse(JSON.stringify(this.user_form))
   },
   watch: {
-    "user_form.type": {
+    'user_form.type': {
       handler(n, o) {
-        if (this.dialogType == "add") {
-          this.user_form.placeType = 0;
-          this.user_form.codeType = ["0"];
+        if (this.dialogType === 'add') {
+          this.user_form.placeType = 0
+          this.user_form.codeType = ['0']
         }
-        if (n != 5) {
-          this.user_form.addCustomList = [];
+        if (n !== 5) {
+          this.user_form.addCustomList = []
         }
       },
     },
-    "user_form.whiteVisitorType": {
+    'user_form.whiteVisitorType': {
       handler(n, o) {
         if (this.user_form.whiteVisitorType.length === 0) {
-          this.user_form.addCustomList = [];
+          this.user_form.addCustomList = []
         }
-      },
+      }
     },
-    "user_form.placeType"(n, o) {
-      if (n == 1) {
-        this.user_form.isShowCustomWord = false;
+    'user_form.placeType'(n, o) {
+      if (n === 1) {
+        this.user_form.isShowCustomWord = false
       }
     },
-    "user_form.clockWayType"(n) {
+    'user_form.clockWayType'(n) {
       // 选择钉钉或通用清除另一个
-      if (n != 2) {
-        this.user_form.dingtalkAppKey = "";
-        this.user_form.dingtalkAppSecret = "";
+      if (n !== 2) {
+        this.user_form.dingtalkAppKey = ''
+        this.user_form.dingtalkAppSecret = ''
       }
-      if (n != 1) {
-        this.user_form.clockWayPushUrl = null;
-        this.user_form.punchReportFieldsConfig = [];
+      if (n !== 1) {
+        this.user_form.clockWayPushUrl = null
+        this.user_form.punchReportFieldsConfig = []
       }
-    },
+    }
   },
   methods: {
     // 查询权限
     checkRole,
     isdisabled(e) {
-      return e == 0 ? true : false;
+      return e === 0
+    },
+    // 获取区域列表
+    getPlatformList(adminId) {
+      getAreaList({ adminId }).then((res) => {
+        this.platformAreaList = res.data
+        this.platformAreaList.unshift({
+          id: 0,
+          name: '全部'
+        })
+        if (this.user_form.interfaceAddresses && this.user_form.interfaceAddresses.length > 0) {
+          for (let i = 0; i < this.user_form.interfaceAddresses.length; i++) {
+            if (this.user_form.interfaceAddresses[i].zoneId !== null) {
+              this.selectedPlatformAreaList.push(this.user_form.interfaceAddresses[i].zoneId)
+            }
+          }
+        }
+      })
+    },
+    areaSelectChange(value, index) {
+      if (this.selectedPlatformAreaList[index] !== null) {
+        this.selectedPlatformAreaList[index] = value
+      } else {
+        this.selectedPlatformAreaList.push(value)
+      }
+    },
+    removeInterfaceAddress(index, value) {
+      this.user_form.interfaceAddresses.splice(index, 1)
+      this.selectedPlatformAreaList = this.selectedPlatformAreaList.filter(function(item) {
+        return item !== value
+      })
+    },
+    addInterfaceAddress() {
+      this.user_form.interfaceAddresses.push({
+        interfAddr: null,
+        zoneId: null
+      })
     },
     // 添加自定义
     addCustom(index) {
       this.user_form.addCustomList.splice(index + 1, 0, {
-        customName: "",
-        prompt: "",
+        customName: '',
+        prompt: '',
         isEditable: 1,
         isShow: 1,
         configurationOptions: null,
         customType: null,
-        customNameVal: null,
-      });
+        customNameVal: null
+      })
     },
     // 删除自定义
     delCustom(index) {
-      this.user_form.addCustomList.splice(index, 1);
+      this.user_form.addCustomList.splice(index, 1)
     },
     // 获取列表数据
     fetchData() {
-      this.listLoading = true;
+      this.listLoading = true
       getUserList(this.page).then((res) => {
-        this.list = res.data.list;
-        this.total = res.data.total;
-        this.listLoading = false;
-      });
+        this.list = res.data.list
+        this.total = res.data.total
+        this.listLoading = false
+      })
     },
     // 打开添加账号对话框
     create() {
-      this.user_form = JSON.parse(JSON.stringify(this.user_form_copy));
-      this.dialogType = "add";
-      this.dialogVisible = true;
+      this.user_form = JSON.parse(JSON.stringify(this.user_form_copy))
+      this.dialogType = 'add'
+      this.dialogVisible = true
       this.$nextTick(() => {
-        this.$refs["user_form"].clearValidate();
-      });
+        this.$refs['user_form'].clearValidate()
+      })
+      this.platformAreaList = []
+      this.selectedPlatformAreaList = []
+      // this.getPlatformList()
+      this.platformAreaList.push({
+        id: 0,
+        name: '全部'
+      })
     },
     // 选择账号权限
     changeType(e) {
       if (e > 2) {
-        this.rules.tagId[0].required = true;
+        this.rules.tagId[0].required = true
       } else {
-        this.rules.tagId[0].required = false;
+        this.rules.tagId[0].required = false
       }
-      this.user_form.tagId = null;
+      this.user_form.tagId = null
     },
     // 获得标签列表
     getTagList(provinceId) {
       getTagList(provinceId).then((res) => {
-        this.tag_list = res.data;
-      });
+        this.tag_list = res.data
+      })
     },
     // 获取账号列表数据_搜索
     getUserListSearch() {
       getUserListSearch().then((res) => {
-        this.user_list = res.data;
-      });
+        this.user_list = res.data
+      })
     },
     // 获取推送字段
     fieldOptions() {
       fieldOptions().then((res) => {
-        this.pushField = res.data;
-      });
+        this.pushField = res.data
+      })
     },
     // 获得省市县列表_搜索
     getAddressListSearch(type, code) {
       switch (type) {
         case 1:
           getProvince().then((res) => {
-            this.province_list_search = res.data;
-          });
-          break;
+            this.province_list_search = res.data
+          })
+          break
         case 2:
           getCity(code).then((res) => {
-            this.city_list_search = res.data;
-          });
-          break;
+            this.city_list_search = res.data
+          })
+          break
         case 3:
           getArea(code).then((res) => {
-            this.area_list_search = res.data;
-          });
-          break;
+            this.area_list_search = res.data
+          })
+          break
         default:
-          break;
+          break
       }
     },
     // 选择省份_搜索
@@ -2306,6 +2351,17 @@ export default {
     add() {
       this.$refs["user_form"].validate((valid) => {
         if (valid) {
+          if(!this.user_form.openThirdLinkPlatform) {
+            this.user_form.interfaceAddresses = null
+          }
+          if(this.user_form.interfaceAddresses && this.user_form.interfaceAddresses.length > 0) {
+            this.user_form.interfaceAddresses = this.user_form.interfaceAddresses.filter(item => {
+              return item.interfAddr !== null && item.zoneId !== null
+            })
+            if (this.user_form.interfaceAddresses.length <= 0) {
+              this.user_form.interfaceAddresses = null
+            }
+          }
           doEditAdmin(this.user_form).then((res) => {
             this.dialogVisible = false;
             this.fetchData();
@@ -2336,30 +2392,39 @@ export default {
     },
     // 打开编辑
     update(row) {
-      this.user_form = Object.assign(this.user_form, row);
-      this.row = row;
+      this.selectedPlatformAreaList = []
+      this.user_form = Object.assign(this.user_form, row)
+      this.row = row
       if (this.user_form.realAuthenticationAgeStart == null) {
-        this.user_form.realAuthenticationAgeStart = 0;
+        this.user_form.realAuthenticationAgeStart = 0
       }
       if (this.user_form.realAuthenticationAgeEnd == null) {
-        this.user_form.realAuthenticationAgeEnd = 200;
+        this.user_form.realAuthenticationAgeEnd = 200
       }
-      this.user_form.password = "";
-      this.getAddressList(2, this.user_form.provinceId);
-      this.getTagList(this.user_form.provinceId);
-      this.getAddressList(3, this.user_form.cityId);
-      this.getAddressList(4, this.user_form.areaId);
-      this.dialogType = "update";
-      this.dialogVisible = true;
+      this.user_form.password = ""
+      this.getAddressList(2, this.user_form.provinceId)
+      this.getTagList(this.user_form.provinceId)
+      this.getAddressList(3, this.user_form.cityId)
+      this.getAddressList(4, this.user_form.areaId)
+      this.dialogType = "update"
+      this.dialogVisible = true
       this.$nextTick(() => {
-        this.$refs["user_form"].clearValidate();
-      });
+        this.$refs["user_form"].clearValidate()
+      })
       getContextById(row.adminId).then((res) => {
-        this.user_form.addCustomList = res.data;
+        this.user_form.addCustomList = res.data
         // 初始化是否显示自定义字段
         this.user_form.isShowCustomWord =
-          this.user_form.addCustomList.length > 0;
-      });
+          this.user_form.addCustomList.length > 0
+      })
+      if(!this.user_form.interfaceAddresses || this.user_form.interfaceAddresses.length <= 0) {
+        this.user_form.interfaceAddresses = []
+        this.user_form.interfaceAddresses.push({
+          interfAddr: null,
+          zoneId: null
+        })
+      }
+      this.getPlatformList(this.user_form.adminId)
     },
     // 选择是否显示自定义字段
     changeCustomWord(e) {
@@ -2382,6 +2447,17 @@ export default {
             this.user_form.homeImgUrl =
               "https://tx.hz-hanghui.com:8088/yx-fyzd/file/icon/face.jpg";
           }
+          if(!this.user_form.openThirdLinkPlatform) {
+            this.user_form.interfaceAddresses = null
+          }
+          if(this.user_form.interfaceAddresses && this.user_form.interfaceAddresses.length > 0) {
+            this.user_form.interfaceAddresses = this.user_form.interfaceAddresses.filter(item => {
+              return item.interfAddr !== null && item.zoneId !== null
+            })
+            if (this.user_form.interfaceAddresses.length <= 0) {
+              this.user_form.interfaceAddresses = null
+            }
+          }
           doEditAdmin(this.user_form).then((res) => {
             this.dialogVisible = false;
             this.fetchData();
@@ -2593,12 +2669,18 @@ export default {
   width: 100%;
   display: flex;
   justify-content: flex-start;
+  & > div:nth-child(1) {
+    margin-right: 60px;
+  }
   // align-items: center;
 }
 .interfaceAddress-layout {
+  width: 100%;
+  padding: 0 10px;
   border: 1px solid #D6EAFF;
   border-radius: 6px;
   padding-top: 18px;
+  margin-bottom: 17px;
 }
 .margin-left {
   margin: 10px 0 0 10px;