From 098a75c8574ae1d49a71a0a5f12ab653af222f31 Mon Sep 17 00:00:00 2001
From: ZZJ <10913410+zzj2100@user.noreply.gitee.com>
Date: 星期五, 23 九月 2022 19:08:31 +0800
Subject: [PATCH] 添加页面 数据推送

---
 src/views/manageCenter/index.vue                          |    8 
 src/api/report.ts                                         |   42 +
 src/views/personalCenter/components/components/point.vue  |  813 +++++++++++++++++++++++++++++++
 src/views/personalCenter/components/components/device.vue |  553 +++++++++++++++++++++
 src/router/index.js                                       |    8 
 src/views/personalCenter/components/dataPush.vue          |   55 ++
 src/views/dataPush/index.vue                              |   71 ++
 7 files changed, 1,550 insertions(+), 0 deletions(-)

diff --git a/src/api/report.ts b/src/api/report.ts
index 415c291..4d1424a 100644
--- a/src/api/report.ts
+++ b/src/api/report.ts
@@ -62,3 +62,45 @@
     params: query
   })
 }
+
+/**
+ * 
+ * 鏁版嵁鎺ㄩ�� 璁惧淇℃伅缁存姢
+鏌ヨ璁惧
+ */
+export const getDevicesList = (query: any) => {
+  return request({
+    url: "/api-a/v1/devices/list",
+    method: "get",
+    params: query
+  })
+}
+
+// 娣诲姞璁惧
+// 鍙傛暟 json
+export const devicesCreate = (query: any) => {
+  return request({
+    url: "/api-a/v1/devices/create",
+    method: "post",
+    // data: qs.stringify(query)
+    data: query
+  })
+}
+
+// 淇敼锛屽弬鏁帮細杩斿洖鍊肩殑鎵�鏈夊睘鎬�
+export const devicesUpdate = (query: any) => {
+  return request({
+    url: "/api-a/v1/devices/update",
+    method: "post",
+    data: query
+  })
+}
+
+// 鍒犻櫎锛屽弬鏁� id
+export const devicesDelete = (query: any) => {
+  return request({
+    url: "/api-a/v1/devices/delete",
+    method: "get",
+    params: query
+  })
+}
diff --git a/src/router/index.js b/src/router/index.js
index 38e5a70..208257e 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -131,6 +131,14 @@
     }
   },
   {
+    path: "/dataPush",
+    name: "dataPush",
+    component: () => import(/* webpackChunkName: "about" */ "../views/dataPush"),
+    meta: {
+      title: "鏁版嵁鎺ㄩ��"
+    }
+  },
+  {
     // 瀹炴椂鐩戞帶
     path: "/video",
     name: "video",
diff --git a/src/views/dataPush/index.vue b/src/views/dataPush/index.vue
new file mode 100644
index 0000000..9dbc7e8
--- /dev/null
+++ b/src/views/dataPush/index.vue
@@ -0,0 +1,71 @@
+<template>
+  <div class="data-report">
+    <!-- 椤靛ご -->
+    <IndexHeader :opacity="false"></IndexHeader>
+    <!-- 闈㈠寘灞� -->
+    <div class="breadcrumb">
+      <!-- <el-breadcrumb separator=">">
+        <el-breadcrumb-item :to="{ path: '/manageCenter' }">绠$悊涓績</el-breadcrumb-item>
+        <el-breadcrumb-item>鎺ㄩ�佺鐞�</el-breadcrumb-item>
+      </el-breadcrumb> -->
+    </div>
+
+    <!-- 涓昏鍐呭 -->
+    <div class="content">
+      <dataPush></dataPush>
+    </div>
+
+    <!-- 椤靛熬 -->
+    <!-- <Footer :isBlack="true"></Footer> -->
+  </div>
+</template>
+
+<script>
+import IndexHeader from "@/components/IndexHeader"
+// import DevList from "@/views/report/components/DevList"
+import dataPush from "@/views/personalCenter/components/dataPush.vue"
+// import SettingBox from "@/views/report/components/SettingBox"
+import Footer from "@/components/Footer"
+
+export default {
+  components: {
+    IndexHeader,
+    dataPush
+    // SettingBox,
+    // Footer
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.data-report {
+  background-color: rgb(243, 245, 248);
+  position: relative;
+  min-height: 50vh;
+
+  .breadcrumb {
+    height: 10px;
+  }
+  .el-breadcrumb {
+    margin-top: 48px;
+    margin-bottom: 24px;
+
+    ::v-deep span {
+      color: #666;
+    }
+  }
+  .content {
+    min-height: 856px;
+    box-sizing: border-box;
+    background-color: #fff;
+    width: 1036px;
+    margin: 0 auto;
+  }
+  .Footer {
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: 0;
+  }
+}
+</style>
diff --git a/src/views/manageCenter/index.vue b/src/views/manageCenter/index.vue
index c514585..8331a65 100644
--- a/src/views/manageCenter/index.vue
+++ b/src/views/manageCenter/index.vue
@@ -322,6 +322,14 @@
         },
 
         {
+          name: "鏁版嵁鎺ㄩ��",
+          icon: "/images/manageCenter/push.png",
+          openPath: "/dataPush",
+          path: "/dataPush",
+          permission: "dataPush"
+        },
+
+        {
           name: "瀹炴椂鐩戞帶",
           icon: "/images/manageCenter/video.png",
           openPath: "/video",
diff --git a/src/views/personalCenter/components/components/device.vue b/src/views/personalCenter/components/components/device.vue
new file mode 100644
index 0000000..4844177
--- /dev/null
+++ b/src/views/personalCenter/components/components/device.vue
@@ -0,0 +1,553 @@
+<template>
+  <div class="sub-account" v-if="!isShowAdd">
+    <div class="btns">
+      <div class="button add" @click="addDevice">
+        <span class="iconfont">&#xe614;</span>
+        <span>娣诲姞璁惧</span>
+      </div>
+    </div>
+
+    <div class="table-area">
+      <el-table
+        id="multipleTable"
+        ref="multipleTable"
+        :data="dataList"
+        :fit="true"
+        :default-sort="{ prop: 'createTime', order: 'descending' }"
+      >
+        <el-table-column prop="devName" label="璁惧鍚嶇О" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="devId" label="璁惧ID" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="devIp" label="璁惧IP" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="devCode" label="璁惧缂栫爜" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="companyCode" label="浼佷笟缂栫爜" show-overflow-tooltip></el-table-column>
+
+        <el-table-column label="鎿嶄綔" align="center" width="100px">
+          <template slot-scope="scope">
+            <span class="iconfont option" @click="editUser(scope.row)">缂栬緫</span>
+            <span class="iconfont option" style="color:red" @click="delUser(scope.row)">鍒犻櫎</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div>
+        <el-pagination
+          @current-change="refrash"
+          @size-change="handleSizeChange"
+          :current-page="page"
+          :page-size="size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :page-sizes="[5, 10, 15, 20, 25]"
+          :total="total"
+          background
+        ></el-pagination>
+      </div>
+    </div>
+  </div>
+  <div class="sub-account" v-else-if="isShowAdd">
+    <!-- <div class="add-title" @click="isShowAdd = false">
+      <span class="iconfont">&#xe614;</span>
+      <span>瀛愯处鎴风鐞�</span>
+    </div> -->
+    <div class="head-name" style="margin-bottom:20px">缂栬緫璁惧</div>
+    <el-form
+      :model="ruleForm"
+      :rules="rules"
+      :label-position="'left'"
+      ref="ruleForm"
+      label-width="100px"
+      class="add-ruleForm"
+    >
+      <el-form-item label="璁惧鍚嶇О" prop="devName">
+        <el-input v-model="ruleForm.devName" placeholder="璇疯緭鍏ヨ澶囧悕绉�" style="width: 350px"></el-input>
+      </el-form-item>
+      <el-form-item label="璁惧ID" prop="devId">
+        <el-input v-model="ruleForm.devId" placeholder="璇疯緭鍏ヨ澶嘔D" style="width: 350px"></el-input>
+      </el-form-item>
+      <el-form-item label="璁惧IP" prop="devIp">
+        <el-input v-model="ruleForm.devIp" placeholder="璇疯緭鍏ヨ澶嘔P" style="width: 350px"></el-input>
+      </el-form-item>
+      <el-form-item label="璁惧缂栫爜" prop="devCode">
+        <el-input v-model="ruleForm.devCode" placeholder="璇疯緭鍏ヨ澶囩紪鐮�" style="width: 350px"></el-input>
+      </el-form-item>
+      <el-form-item label="浼佷笟缂栫爜" prop="companyCode">
+        <el-input v-model="ruleForm.companyCode" placeholder="璇疯緭鍏ヤ紒涓氱紪鐮�" style="width: 350px"></el-input>
+      </el-form-item>
+    </el-form>
+    <div class="right">
+      <div class="button searchBtn" @click="saveUser">淇濆瓨</div>
+      <div class="button resetBtn" @click="resetUser">閲嶇疆</div>
+      <div class="button resetBtn" style="margin-left:20px" @click="goback">杩斿洖</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getDevicesList, devicesCreate, devicesUpdate, devicesDelete } from "@/api/report"
+
+export default {
+  data() {
+    return {
+      isShowAdd: false, //鏄惁灞曠ず鏂板寮圭獥
+      dataList: [],
+      tip: 1,
+      ruleForm: {
+        //y
+        devName: "",
+        devId: "",
+        devIp: "",
+        devCode: "",
+        companyCode: "",
+
+        id: "",
+        createdAt: "",
+        state: "",
+        updatedAt: ""
+      },
+      rules: {
+        devName: [{ required: true, message: "璇疯緭鍏ヨ澶囧悕绉�", trigger: "blur" }],
+        devId: [{ required: true, message: "璇疯緭鍏ヨ澶嘔D", trigger: "blur" }],
+        devIp: [{ required: true, message: "璇疯緭鍏ヨ澶嘔P", trigger: "blur" }],
+        devCode: [{ required: true, message: "璇疯緭鍏ヨ澶囩紪鐮�", trigger: "blur" }],
+        companyCode: [{ required: true, message: "璇疯緭鍏ヤ紒涓氱紪鐮�", trigger: "blur" }]
+      },
+      page: 1,
+      size: 10, //鍒嗛〉鐩稿叧
+      total: 0 //鎬绘暟,
+    }
+  },
+  created() {
+    this.fetchDevicesList()
+  },
+  mounted() {},
+  methods: {
+    async fetchDevicesList() {
+      let res = await getDevicesList({ pageIndex: this.page, pageSize: this.size })
+      this.dataList = res.data
+      this.total = res.total
+    },
+    delUser(row) {
+      console.log(row, "row")
+      this.$confirm("纭瑕佸垹闄よ鐢ㄦ埛鍚�, 鏄惁缁х画?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning"
+      }).then(async () => {
+        let rsp = await devicesDelete({ id: row.id })
+        if (rsp && rsp.success) {
+          this.$message({
+            type: "success",
+            message: "鍒犻櫎鎴愬姛!"
+          })
+        }
+        this.fetchDevicesList()
+      })
+    },
+    //鍒嗛〉鍔熻兘
+    handleSizeChange(size) {
+      this.size = size
+      this.fetchDevicesList()
+    },
+    //鍒嗛〉鍔熻兘
+    refrash(page) {
+      this.page = page
+      this.fetchDevicesList()
+    },
+
+    addDevice() {
+      this.isShowAdd = true
+      this.tip = 1
+      this.resetUser()
+    }, //y
+    resetUser() {
+      //devName , devId , devIp, devCode, companyCode
+      this.ruleForm = {
+        devName: "",
+        devId: "",
+        devIp: "",
+        devCode: "",
+        companyCode: ""
+      }
+    },
+    saveUser() {
+      this.$refs["ruleForm"].validate((valid) => {
+        if (valid) {
+          if (this.tip === 1) {
+            let params = {
+              devName: this.ruleForm.devName,
+              devId: this.ruleForm.devId,
+              devIp: this.ruleForm.devIp,
+              devCode: this.ruleForm.devCode,
+              companyCode: this.ruleForm.companyCode
+            }
+            // console.log(params, "params")
+            devicesCreate(params).then((res) => {
+              // console.log(res, "res")
+              if (res && res.success) {
+                // Notification({
+                //   title: "鎴愬姛",
+                //   showClose: true,
+                //   message: res.data,
+                //   type: "success"
+                // })
+                this.$message({
+                  type: "success",
+                  message: res.data
+                })
+                this.goback()
+              }
+            })
+          } else if (this.tip === 2) {
+            let params = {
+              devName: this.ruleForm.devName,
+              devId: this.ruleForm.devId,
+              devIp: this.ruleForm.devIp,
+              devCode: this.ruleForm.devCode,
+              companyCode: this.ruleForm.companyCode,
+              id: this.ruleForm.id,
+              createdAt: this.ruleForm.createdAt,
+              state: this.ruleForm.state,
+              updatedAt: this.ruleForm.updatedAt
+            }
+            devicesUpdate(params).then((res) => {
+              console.log(res, "res")
+              if (res && res.success) {
+                this.$message({
+                  type: "success",
+                  message: res.msg
+                })
+                this.goback()
+              }
+            })
+          }
+        } else {
+          return false
+        }
+      })
+    },
+    goback() {
+      this.isShowAdd = false
+    },
+    async editUser(row) {
+      this.tip = 2
+      this.isShowAdd = true
+      this.ruleForm.devName = row.devName
+      this.ruleForm.devId = row.devId
+      this.ruleForm.devIp = row.devIp
+      this.ruleForm.devCode = row.devCode
+      this.ruleForm.companyCode = row.companyCode
+      this.ruleForm.id = row.id
+      this.ruleForm.createdAt = row.createdAt
+      this.ruleForm.state = row.state
+      this.ruleForm.updatedAt = row.updatedAt
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.sub-account {
+  padding: 20px;
+  .head-name {
+    font-weight: 700;
+    font-size: 16px;
+    line-height: 22px;
+    color: #3d3d3d;
+    border-left: 4px solid #0065ff;
+    padding-left: 10px;
+  }
+  .add-title {
+    font-weight: 700;
+    font-size: 16px;
+    cursor: pointer;
+    line-height: 22px;
+    color: #3d3d3d;
+    margin-bottom: 30px;
+    .iconfont {
+      margin-right: 10px;
+    }
+  }
+  .add-ruleForm::v-deep {
+    .el-input__inner {
+      color: #3d3d3d;
+      border-radius: 4px;
+      border-color: #c0c5cc;
+      height: 32px;
+      line-height: 32px;
+      border-color: #c0c5cc;
+    }
+    .user-tree {
+      .el-form-item__label:before {
+        content: "*";
+        color: #f52323;
+        margin-right: 4px;
+      }
+      .el-form-item__content {
+        display: flex;
+        .tree-box {
+          .t {
+            height: 32px;
+            background: #f0f5fa;
+            border-radius: 3px 3px 0px 0px;
+            line-height: 32px;
+            text-align: center;
+            border-bottom: 1px solid #c0c5cc;
+          }
+          width: 336px;
+          height: 480px;
+          border: 1px solid #c0c5cc;
+          margin-right: 20px;
+          box-sizing: border-box;
+        }
+      }
+    }
+  }
+  .searchBtn {
+    width: 50px;
+    height: 25px;
+    line-height: 25px;
+    font-size: 14px;
+    text-align: center;
+    color: #fff;
+    background: #0065ff;
+    margin-right: 20px;
+  }
+  .right {
+    display: flex;
+  }
+  .resetBtn {
+    width: 50px;
+    height: 25px;
+    line-height: 25px;
+    font-size: 14px;
+    text-align: center;
+    color: #0065ff;
+    box-sizing: border-box;
+    border: 1px solid #0065ff;
+  }
+  .search {
+    display: flex;
+    font-size: 14px;
+    border-bottom: 1px solid #e9ebee;
+    margin-top: 30px;
+    padding-bottom: 20px;
+    .left,
+    .right,
+    .id,
+    .time,
+    .cluster {
+      display: flex;
+      align-items: center;
+      .el-select {
+        width: auto;
+      }
+    }
+
+    .id .el-input ::v-deep {
+      width: 200px;
+    }
+
+    .cluster::v-deep .el-input {
+      width: 300px;
+
+      margin-left: 10px;
+      margin-right: 20px;
+      .el-input__icon {
+        line-height: 32px;
+      }
+      input {
+        border-radius: 0;
+
+        &::-webkit-input-placeholder {
+          color: #999;
+        }
+
+        &:focus {
+          border-color: #0065ff;
+        }
+      }
+    }
+
+    .el-input ::v-deep {
+      width: 200px;
+      margin-left: 10px;
+      margin-right: 20px;
+      height: 32px;
+      line-height: 32px;
+      input {
+        border-radius: 0;
+        height: 32px;
+        line-height: 32px;
+        &::-webkit-input-placeholder {
+          color: #999;
+        }
+
+        &:focus {
+          border-color: #0065ff;
+        }
+      }
+    }
+
+    .el-date-editor {
+      width: 318px;
+      height: 40px;
+      margin-left: 10px;
+      margin-right: 20px;
+      border-radius: 0;
+
+      &::-webkit-input-placeholder {
+        color: #999;
+      }
+
+      &.is-active {
+        border-color: #0065ff;
+      }
+    }
+  }
+
+  .btns {
+    display: flex;
+    margin: 20px 0;
+    text-align: center;
+    .add {
+      margin-right: 20px;
+      width: 126px;
+      height: 32px;
+      background: #0065ff;
+      color: #fff;
+      span {
+        margin-right: 5px;
+        line-height: 32px;
+        font-size: 14px;
+      }
+    }
+
+    .export {
+      width: 126px;
+      height: 32px;
+      border: 1px solid #0065ff;
+      color: #0065ff;
+      box-sizing: border-box;
+      span {
+        margin-right: 5px;
+        line-height: 32px;
+        font-size: 14px;
+      }
+    }
+  }
+
+  .el-table ::v-deep {
+    background-color: rgb(233, 235, 238);
+    padding: 1px;
+
+    &::after {
+      display: none;
+    }
+
+    td.index .cell {
+      padding-left: 16px;
+      padding-right: 4px;
+    }
+
+    .has-gutter tr th {
+      background: #f0f3f5;
+      font-size: 16px;
+      color: #3d3d3d;
+      font-weight: 700;
+    }
+
+    td .cell {
+      color: #3d3d3d;
+    }
+
+    tr:hover > td.el-table__cell {
+      background-color: #fff;
+    }
+
+    .el-table__row--striped .el-table__cell {
+      background-color: #f0f5fa !important;
+    }
+    tr:hover > td.el-table__cell {
+      background-color: #fff;
+    }
+
+    .el-table__row--striped .el-table__cell {
+      background-color: #f0f5fa !important;
+    }
+
+    .status {
+      color: #ff4b33;
+
+      &.green {
+        color: #36b24a;
+      }
+    }
+
+    .option {
+      margin-right: 10px;
+      font-size: 14px;
+      color: rgb(0, 101, 255);
+      cursor: pointer;
+    }
+  }
+
+  .el-pagination ::v-deep {
+    margin-top: 30px;
+    text-align: center;
+    height: 24px;
+    .el-pagination__sizes {
+      margin-right: 0;
+    }
+
+    button {
+      margin: 0;
+      background-color: #fff;
+      border: 1px solid #c0c5cc;
+      border-radius: 2px;
+    }
+
+    .number {
+      background-color: #fff;
+
+      &:not(.disabled):hover {
+        color: #0065ff;
+      }
+
+      &:not(.disabled).active {
+        background-color: #0065ff;
+        color: #fff;
+      }
+    }
+
+    .el-input .el-input__inner {
+      padding-left: 0;
+
+      &:hover,
+      &:focus {
+        border-color: #0065ff;
+      }
+    }
+  }
+
+  .el-select ::v-deep {
+    .el-select__tags-text {
+      color: #3d3d3d;
+    }
+  }
+}
+</style>
+
+<style>
+.el-date-table td.start-date span,
+.el-date-table td.end-date span {
+  background-color: #0065ff;
+}
+
+.el-button--text span {
+  color: #0065ff;
+}
+
+.el-button.is-plain:hover,
+.el-button.is-plain:focus {
+  color: #0065ff;
+  border-color: #0065ff;
+}
+</style>
diff --git a/src/views/personalCenter/components/components/point.vue b/src/views/personalCenter/components/components/point.vue
new file mode 100644
index 0000000..ef048c4
--- /dev/null
+++ b/src/views/personalCenter/components/components/point.vue
@@ -0,0 +1,813 @@
+<template>
+  <div class="sub-account" v-if="!isShowAdd">
+    <div class="btns">
+      <div class="button add" @click="addPoint">
+        <span class="iconfont">&#xe614;</span>
+        <span>娣诲姞鐐逛綅</span>
+      </div>
+    </div>
+
+    <div class="table-area">
+      <el-table
+        id="multipleTable"
+        ref="multipleTable"
+        :data="dataList"
+        :fit="true"
+        :default-sort="{ prop: 'createTime', order: 'descending' }"
+      >
+        <el-table-column prop="a" label="鐐逛綅鍚嶇О" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="b" label="鎶ヨ閫氶亾缂栫爜" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="c" label="浼佷笟缂栫爜" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="d" label="鎺ㄩ�佸満鏅�" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="e" label="鎺ㄥ姩鏃堕棿" show-overflow-tooltip></el-table-column>
+
+        <el-table-column label="鎿嶄綔" align="center" width="100px">
+          <template slot-scope="scope">
+            <span class="iconfont option" style="color:red" @click="delUser(scope.row)">鍒犻櫎</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div>
+        <el-pagination
+          @current-change="refrash"
+          @size-change="handleSizeChange"
+          :current-page="page"
+          :page-size="size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :page-sizes="[5, 10, 15, 20, 25]"
+          :total="total"
+          background
+        ></el-pagination>
+      </div>
+    </div>
+  </div>
+  <div class="sub-account" v-else-if="isShowAdd">
+    <!-- <div class="add-title" @click="isShowAdd = false">
+      <span class="iconfont">&#xe614;</span>
+      <span>瀛愯处鎴风鐞�</span>
+    </div> -->
+    <div class="head-name" style="margin-bottom:20px">缂栬緫鐐逛綅</div>
+    <el-form
+      :model="ruleForm"
+      :rules="rules"
+      :label-position="'left'"
+      ref="ruleForm"
+      label-width="100px"
+      class="add-ruleForm"
+    >
+      <el-form-item label="鐐逛綅鍚嶇О" prop="a">
+        <el-input v-model="ruleForm.a" placeholder="璇疯緭鍏ョ偣浣嶅悕绉�" style="width: 350px"></el-input>
+      </el-form-item>
+      <el-form-item label="鎶ヨ閫氶亾缂栫爜" prop="b">
+        <el-input v-model="ruleForm.b" placeholder="璇疯緭鍏ユ姤璀﹂�氶亾缂栫爜" style="width: 350px"></el-input>
+      </el-form-item>
+      <el-form-item label="浼佷笟缂栫爜" prop="c">
+        <el-input v-model="ruleForm.c" placeholder="璇疯緭鍏ヤ紒涓氱紪鐮�" style="width: 350px"></el-input>
+      </el-form-item>
+      <el-form-item label="鎺ㄩ�佸満鏅�" prop="d">
+        <el-input v-model="ruleForm.d" placeholder="璇疯緭鍏ユ帹閫佸満鏅�" style="width: 350px"></el-input>
+      </el-form-item>
+      <el-form-item label="鎺ㄥ姩鏃堕棿" prop="e">
+        <el-input v-model="ruleForm.e" placeholder="璇疯緭鍏ユ帹鍔ㄦ椂闂�" style="width: 350px"></el-input>
+      </el-form-item>
+    </el-form>
+    <div class="right">
+      <div class="button searchBtn" @click="saveUser">淇濆瓨</div>
+      <div class="button resetBtn" @click="resetUser">閲嶇疆</div>
+      <div class="button resetBtn" style="margin-left:20px" @click="goback">杩斿洖</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { findUserList, saveSubUser, getMenu, getDataTree, deleteUser } from "@/api/user"
+import { findTaskById, updateTask } from "@/api/report"
+import { getAreas, getDic } from "@/api/login"
+
+export default {
+  computed: {
+    taskOptions() {
+      return this.VideoPhotoData.tasks.filter((item) => !item.isDelete)
+    }
+  },
+  data() {
+    const validateTree = (rule, value, callback) => {
+      if (
+        this.ruleForm.menuIds &&
+        this.ruleForm.dataIds &&
+        this.ruleForm.menuIds.length > 0 &&
+        this.ruleForm.dataIds.length > 0
+      ) {
+        callback()
+      } else {
+        callback(new Error("璇烽�夎彍鍗曟潈闄愬拰鏁版嵁鏉冮檺"))
+      }
+    }
+    return {
+      searchTime: [this.$moment().format("YYYY-MM-DD 00:00:00"), this.$moment().format("YYYY-MM-DD HH:mm:ss")], //鎼滅储鏃堕棿
+      page: 1,
+      size: 10, //鍒嗛〉鐩稿叧
+      total: 0, //鎬绘暟,
+      inputText: "", //杈撳叆妗嗗唴瀹�
+      activeStep: 0,
+      activeIndex: 0,
+      industrys: [],
+      treeHeight: 750,
+      treeData: [],
+      treeSettings: {
+        check: {
+          enable: true
+        }
+      },
+      options: {
+        lazy: true,
+        lazyLoad(node, resolve) {
+          // 鎳掑姞杞借妭鐐圭渷甯傛暟鎹�
+          const { level } = node
+          let nodes
+          getAreas({ parentId: level == 0 ? 0 : node.value })
+            .then((json) => {
+              nodes = json.data.list
+              nodes = nodes.map((item) => ({
+                value: item.id,
+                label: item.name,
+                level: item.level,
+                leaf: level >= 1
+              }))
+              resolve(nodes)
+            })
+            .catch((err) => {
+              console.log(err)
+            })
+        }
+      },
+      dataList: [],
+      isShowAdd: false, //鏄惁灞曠ず鏂板寮圭獥
+      isShowUnbind: false, //鏄惁灞曠ず瑙g粦寮圭獥
+      isShowRelate: false,
+      isEditing: false,
+      unbindId: "",
+      durationArr: [
+        {
+          value: 1,
+          label: "1骞�"
+        },
+        {
+          value: 2,
+          label: "2骞�"
+        },
+        {
+          value: 3,
+          label: "3骞�"
+        }
+      ], //鎵�灞為泦缇や笅鎷夋
+      timeLength: null, //閫変腑鐨勬巿鏉冩椂闀�
+      showQuit: false, //灞曠ず閫�鍑洪泦缇ょ殑寮圭獥
+      showJoin: false, //灞曠ず鍔犲叆闆嗙兢鐨勫脊绐�
+      activeEquipment: null, //澶勭悊涓殑璁惧
+      checkedData: [],
+      checkedMenu: [],
+      ruleForm: {
+        //y
+        a: "",
+        b: "",
+        c: "",
+        d: "",
+        e: "",
+        id: "",
+        username: "",
+        userType: "",
+        password: "",
+        trueName: "",
+        companyName: "",
+        phoneNum: "",
+        email: "basic",
+        isChangePwd: false,
+        industryId: "",
+        address: [],
+        authDuration: 3,
+        areaId: "",
+        provinceId: "",
+        menuIds: [],
+        dataIds: []
+      },
+      rules: {
+        //y
+        a: [{ required: true, message: "璇疯緭鍏ョ偣浣嶅悕绉�", trigger: "blur" }],
+        b: [{ required: true, message: "璇疯緭鍏ユ姤璀﹂�氶亾缂栫爜", trigger: "blur" }],
+        c: [{ required: true, message: "璇疯緭鍏ヤ紒涓氱紪鐮�", trigger: "blur" }],
+        d: [{ required: true, message: "璇疯緭鍏ユ帹閫佸満鏅�", trigger: "blur" }],
+        e: [{ required: true, message: "璇疯緭鍏ユ帹鍔ㄦ椂闂�", trigger: "blur" }]
+      },
+      sysMenus: [],
+      DataTree: [],
+      smsSceneConfig: [],
+      smsLevelConfig: [],
+      smsEnable: false,
+      userInfo: {},
+      curEditId: "",
+      defaultProp: {
+        children: "children",
+        label: "name"
+      },
+      levelOptions: [
+        { value: "涓�绾�", label: "涓�绾�" },
+        { value: "浜岀骇", label: "浜岀骇" },
+        { value: "涓夌骇", label: "涓夌骇" },
+        { value: "鍥涚骇", label: "鍥涚骇" },
+        { value: "浜旂骇", label: "浜旂骇" }
+      ]
+    }
+  },
+  // created() {
+  //   this.userInfo = JSON.parse(sessionStorage.getItem("userInfo"))
+  //   this.findUserList()
+  //   this.getIndustrys()
+  //   this.fetchSysMenus()
+  //   this.fetchDataTree()
+  // },
+  // mounted() {
+  //   this.TreeDataPool.reset()
+  //   this.TreeDataPool.multiple = true
+  //   this.VideoPhotoData.queryTaskList()
+  // },
+  methods: {
+    fetchDataTree() {
+      getDataTree({ userId: this.userInfo.id }).then((res) => {
+        this.DataTree = res.data.dataTree
+      })
+    },
+    fetchSysMenus() {
+      getMenu().then((rsp) => {
+        if (rsp && rsp.success) {
+          this.sysMenus = rsp.data.menus
+          // this.userMenus = [];
+        }
+      })
+    },
+    selectDevice(node, checked, hasChildren) {
+      if (checked) {
+        sessionStorage.setItem("clusterId", node.id)
+        this.TreeDataPool.fetchTreeData()
+        this.treeData = this.TreeDataPool.treeData
+      } else {
+        this.treeData = []
+        this.TreeDataPool.reset()
+      }
+    },
+    addPoint() {
+      this.isShowAdd = true
+      this.resetUser()
+    },
+    async editUser(row) {
+      this.isShowAdd = true
+      this.isEditing = true
+      this.ruleForm.id = row.id
+      this.ruleForm.username = row.username
+      this.ruleForm.userType = row.userType
+      this.ruleForm.password = row.password
+      this.ruleForm.trueName = row.trueName
+      this.ruleForm.companyName = row.companyName
+      this.ruleForm.phoneNum = row.phoneNum
+      this.ruleForm.email = row.email
+      this.ruleForm.isChangePwd = false
+      this.ruleForm.industryId = row.industryId
+      this.ruleForm.areaId = row.areaId
+      this.ruleForm.address = [row.provinceId, row.areaId]
+      this.ruleForm.provinceId = row.provinceId
+      this.ruleForm.authDuration = row.authDuration
+      this.checkedMenu = row.menuIds
+      this.checkedData = row.dataIds
+
+      this.smsSceneConfig = []
+      this.smsLevelConfig = []
+      this.smsEnable = false
+      findTaskById({ id: row.id }).then((rsp) => {
+        if (rsp && rsp.success && rsp.data != "") {
+          if (rsp.data.taskName != "") {
+            this.smsSceneConfig = rsp.data.taskName.split(",")
+          }
+          if (rsp.data.level != "") {
+            this.smsLevelConfig = rsp.data.level.split(",")
+          }
+          this.smsEnable = rsp.data.enable
+        }
+      })
+
+      // 鏌ヨ褰撳墠鐢ㄦ埛鏉冮檺涓嬫墍鏈夊彲绠$悊鐨勬憚鍍忔満
+      if (row.dataIds) {
+        sessionStorage.setItem("clusterId", row.dataIds[0])
+        await this.TreeDataPool.fetchTreeData()
+      }
+
+      // 鐢╡mail瀛楁鏆傛椂浠f浛鎽勫儚鏈洪泦鍚堝瓧娈�
+      let checkedCameras = row.email
+
+      // basic 涓哄瓙璐︽埛榛樿鐨勭┖瀛楁,琛ㄧず鍙鐞嗙殑鎽勫儚鏈虹洰褰曚负绌�
+      if (checkedCameras == "basic") {
+        return
+      }
+
+      // 鍙嶉�夋憚鍍忔満
+      if (checkedCameras.length) {
+        let cameraIds = checkedCameras.split(",")
+        this.$refs.ztreeMenus.updateNodes(cameraIds)
+      }
+    },
+    delUser(row) {
+      this.$confirm("纭瑕佸垹闄よ鐢ㄦ埛鍚�, 鏄惁缁х画?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning"
+      }).then(async () => {
+        let rsp = await deleteUser({ id: row.id })
+        if (rsp && rsp.success) {
+          this.$message({
+            type: "success",
+            message: "鍒犻櫎鎴愬姛!"
+          })
+        }
+
+        this.findUserList()
+      })
+    },
+    resetUser() {
+      this.ruleForm = {
+        id: "",
+        username: "",
+        userType: "",
+        password: "",
+        trueName: "",
+        companyName: "",
+        phoneNum: "",
+        email: "",
+        isChangePwd: false,
+        address: [],
+        industryId: "",
+        areaId: "",
+        provinceId: "",
+        authDuration: 1
+      }
+      this.smsSceneConfig = []
+      this.smsLevelConfig = []
+      this.smsEnable = false
+      this.$nextTick(() => {
+        this.$refs.treeMenus.setCheckedKeys([])
+        this.$refs.treeData.setCheckedKeys([])
+      })
+    },
+    async getIndustrys() {
+      let res = await getDic()
+      if (res.success) {
+        this.industrys = res.data.dics
+      } else {
+        console.log("鏌ヨ琛屼笟鍒楄〃澶辫触锛�")
+      }
+    },
+    saveUser() {
+      let _this = this
+      this.ruleForm.menuIds = this.$refs.treeMenus.getCheckedKeys()
+      this.ruleForm.dataIds = this.$refs.treeData.getCheckedKeys()
+      this.$refs["ruleForm"].validate((valid) => {
+        if (valid) {
+          let json = {
+            id: this.isEditing ? this.ruleForm.id : "",
+            username: this.ruleForm.username,
+            password: this.ruleForm.password,
+            isChangePwd: this.ruleForm.isChangePwd,
+            userType: this.ruleForm.userType,
+            trueName: this.ruleForm.trueName,
+            companyName: this.ruleForm.companyName,
+            phoneNum: this.ruleForm.phoneNum,
+            industryId: this.ruleForm.industryId,
+            areaId: this.ruleForm.address.length == 2 ? this.ruleForm.address[1] : "",
+            authDuration: this.ruleForm.authDuration,
+            menuIds: this.ruleForm.menuIds,
+            dataIds: this.ruleForm.dataIds
+          }
+
+          // 鑾峰彇瀛愯处鎴烽�変腑鐨勬憚鍍忔満鍒楄〃
+          let cameraIds = this.TreeDataPool.selectedNodes
+          if (cameraIds.length == 0) {
+            json.email = "basic"
+          } else {
+            json.email = cameraIds.join(",")
+          }
+
+          // 缂栬緫涓嶆彁浜ゅ瘑鐮�
+          if (this.isEditing) {
+            delete json.password
+            json.isChangePwd = false
+          }
+
+          if (typeof json.areaId === "string") {
+            delete json.areaId
+          }
+
+          if (typeof json.authDuration === "string") {
+            delete json.authDuration
+          }
+
+          // return
+          saveSubUser(json)
+            .then((res) => {
+              if (res.success) {
+                // 淇濆瓨娑堟伅鎺ㄩ��
+                if (_this.isEditing) {
+                  let smsTaskInfo = {
+                    id: _this.ruleForm.id,
+                    taskName: _this.smsSceneConfig.join(","),
+                    level: _this.smsLevelConfig.join(","),
+                    cameras: json.email,
+                    person: json.trueName,
+                    tel: json.phoneNum,
+                    enable: _this.smsEnable,
+                    IsDel: "0"
+                  }
+
+                  updateTask(smsTaskInfo).then((rsp) => {
+                    // console.log(rsp)
+                  })
+                }
+
+                _this.$notify.success(res.data)
+                _this.isShowAdd = false
+                _this.isEditing = false
+                _this.findUserList()
+              } else {
+                _this.$notify.error(res.msg)
+              }
+            })
+            .catch((err) => {
+              _this.$notify.error(err.data.msg)
+            })
+        } else {
+          return false
+        }
+      })
+    },
+    findUserList() {
+      findUserList({
+        inputText: this.inputText,
+        page: this.page,
+        size: this.size,
+        authDuration: this.timeLength
+      })
+        .then((res) => {
+          if (res.success) {
+            this.dataList = res.data.dataList
+            this.total = res.data.total
+          } else {
+            this.$notify.error("鍔犺浇瀛愯处鎴峰垪琛ㄥけ璐�")
+          }
+        })
+        .catch((e) => {
+          this.$notify.error(e.msg)
+        })
+    },
+    goback() {
+      this.isShowAdd = false
+      this.isEditing = false
+      this.isShowRelate = false
+      this.activeIndex = 0
+    },
+    goto(i) {
+      this.activeIndex = i
+    },
+    reset() {
+      this.inputText = ""
+      this.timeLength = null
+    },
+
+    //鍒嗛〉鍔熻兘
+    handleSizeChange(size) {
+      this.size = size
+      this.findUserList()
+    },
+    //鍒嗛〉鍔熻兘
+    refrash(page) {
+      this.page = page
+      this.findUserList()
+    },
+
+    // 鐢熸垚uuid
+    getUuid() {
+      let originStr = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
+      let originChar = "0123456789abcdef"
+      let len = originChar.length
+      return originStr.replace(/x/g, function(match) {
+        return originChar.charAt(Math.floor(Math.random() * len))
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.sub-account {
+  padding: 20px;
+  .head-name {
+    font-weight: 700;
+    font-size: 16px;
+    line-height: 22px;
+    color: #3d3d3d;
+    border-left: 4px solid #0065ff;
+    padding-left: 10px;
+  }
+  .add-title {
+    font-weight: 700;
+    font-size: 16px;
+    cursor: pointer;
+    line-height: 22px;
+    color: #3d3d3d;
+    margin-bottom: 30px;
+    .iconfont {
+      margin-right: 10px;
+    }
+  }
+  .add-ruleForm::v-deep {
+    .el-input__inner {
+      color: #3d3d3d;
+      border-radius: 4px;
+      border-color: #c0c5cc;
+      height: 32px;
+      line-height: 32px;
+      border-color: #c0c5cc;
+    }
+    .user-tree {
+      .el-form-item__label:before {
+        content: "*";
+        color: #f52323;
+        margin-right: 4px;
+      }
+      .el-form-item__content {
+        display: flex;
+        .tree-box {
+          .t {
+            height: 32px;
+            background: #f0f5fa;
+            border-radius: 3px 3px 0px 0px;
+            line-height: 32px;
+            text-align: center;
+            border-bottom: 1px solid #c0c5cc;
+          }
+          width: 336px;
+          height: 480px;
+          border: 1px solid #c0c5cc;
+          margin-right: 20px;
+          box-sizing: border-box;
+        }
+      }
+    }
+  }
+  .searchBtn {
+    width: 50px;
+    height: 25px;
+    line-height: 25px;
+    font-size: 14px;
+    text-align: center;
+    color: #fff;
+    background: #0065ff;
+    margin-right: 20px;
+  }
+  .right {
+    display: flex;
+  }
+  .resetBtn {
+    width: 50px;
+    height: 25px;
+    line-height: 25px;
+    font-size: 14px;
+    text-align: center;
+    color: #0065ff;
+    box-sizing: border-box;
+    border: 1px solid #0065ff;
+  }
+  .search {
+    display: flex;
+    font-size: 14px;
+    border-bottom: 1px solid #e9ebee;
+    margin-top: 30px;
+    padding-bottom: 20px;
+    .left,
+    .right,
+    .id,
+    .time,
+    .cluster {
+      display: flex;
+      align-items: center;
+      .el-select {
+        width: auto;
+      }
+    }
+
+    .id .el-input ::v-deep {
+      width: 200px;
+    }
+
+    .cluster::v-deep .el-input {
+      width: 300px;
+
+      margin-left: 10px;
+      margin-right: 20px;
+      .el-input__icon {
+        line-height: 32px;
+      }
+      input {
+        border-radius: 0;
+
+        &::-webkit-input-placeholder {
+          color: #999;
+        }
+
+        &:focus {
+          border-color: #0065ff;
+        }
+      }
+    }
+
+    .el-input ::v-deep {
+      width: 200px;
+      margin-left: 10px;
+      margin-right: 20px;
+      height: 32px;
+      line-height: 32px;
+      input {
+        border-radius: 0;
+        height: 32px;
+        line-height: 32px;
+        &::-webkit-input-placeholder {
+          color: #999;
+        }
+
+        &:focus {
+          border-color: #0065ff;
+        }
+      }
+    }
+
+    .el-date-editor {
+      width: 318px;
+      height: 40px;
+      margin-left: 10px;
+      margin-right: 20px;
+      border-radius: 0;
+
+      &::-webkit-input-placeholder {
+        color: #999;
+      }
+
+      &.is-active {
+        border-color: #0065ff;
+      }
+    }
+  }
+
+  .btns {
+    display: flex;
+    margin: 20px 0;
+    text-align: center;
+    .add {
+      margin-right: 20px;
+      width: 126px;
+      height: 32px;
+      background: #0065ff;
+      color: #fff;
+      span {
+        margin-right: 5px;
+        line-height: 32px;
+        font-size: 14px;
+      }
+    }
+
+    .export {
+      width: 126px;
+      height: 32px;
+      border: 1px solid #0065ff;
+      color: #0065ff;
+      box-sizing: border-box;
+      span {
+        margin-right: 5px;
+        line-height: 32px;
+        font-size: 14px;
+      }
+    }
+  }
+
+  .el-table ::v-deep {
+    background-color: rgb(233, 235, 238);
+    padding: 1px;
+
+    &::after {
+      display: none;
+    }
+
+    td.index .cell {
+      padding-left: 16px;
+      padding-right: 4px;
+    }
+
+    .has-gutter tr th {
+      background: #f0f3f5;
+      font-size: 16px;
+      color: #3d3d3d;
+      font-weight: 700;
+    }
+
+    td .cell {
+      color: #3d3d3d;
+    }
+
+    tr:hover > td.el-table__cell {
+      background-color: #fff;
+    }
+
+    .el-table__row--striped .el-table__cell {
+      background-color: #f0f5fa !important;
+    }
+    tr:hover > td.el-table__cell {
+      background-color: #fff;
+    }
+
+    .el-table__row--striped .el-table__cell {
+      background-color: #f0f5fa !important;
+    }
+
+    .status {
+      color: #ff4b33;
+
+      &.green {
+        color: #36b24a;
+      }
+    }
+
+    .option {
+      margin-right: 10px;
+      font-size: 14px;
+      color: rgb(0, 101, 255);
+      cursor: pointer;
+    }
+  }
+
+  .el-pagination ::v-deep {
+    margin-top: 30px;
+    text-align: center;
+    height: 24px;
+    .el-pagination__sizes {
+      margin-right: 0;
+    }
+
+    button {
+      margin: 0;
+      background-color: #fff;
+      border: 1px solid #c0c5cc;
+      border-radius: 2px;
+    }
+
+    .number {
+      background-color: #fff;
+
+      &:not(.disabled):hover {
+        color: #0065ff;
+      }
+
+      &:not(.disabled).active {
+        background-color: #0065ff;
+        color: #fff;
+      }
+    }
+
+    .el-input .el-input__inner {
+      padding-left: 0;
+
+      &:hover,
+      &:focus {
+        border-color: #0065ff;
+      }
+    }
+  }
+
+  .el-select ::v-deep {
+    .el-select__tags-text {
+      color: #3d3d3d;
+    }
+  }
+}
+</style>
+
+<style>
+.el-date-table td.start-date span,
+.el-date-table td.end-date span {
+  background-color: #0065ff;
+}
+
+.el-button--text span {
+  color: #0065ff;
+}
+
+.el-button.is-plain:hover,
+.el-button.is-plain:focus {
+  color: #0065ff;
+  border-color: #0065ff;
+}
+</style>
diff --git a/src/views/personalCenter/components/dataPush.vue b/src/views/personalCenter/components/dataPush.vue
new file mode 100644
index 0000000..82ae224
--- /dev/null
+++ b/src/views/personalCenter/components/dataPush.vue
@@ -0,0 +1,55 @@
+<template>
+  <div>
+    <el-tabs v-model="activeName" @tab-click="handleClick">
+      <el-tab-pane label="璁惧淇℃伅缁存姢" name="first">
+        <device></device>
+      </el-tab-pane>
+      <el-tab-pane label="鐐逛綅淇℃伅缁存姢" name="second">
+        <point></point>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+import device from "./components/device.vue"
+import point from "./components/point.vue"
+
+export default {
+  components: {
+    device,
+    point
+  },
+  data() {
+    return {
+      activeName: "first"
+    }
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    handleClick(tab, event) {
+      console.log(tab, event, this.activeName)
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss"></style>
+
+<style>
+.el-date-table td.start-date span,
+.el-date-table td.end-date span {
+  background-color: #0065ff;
+}
+
+.el-button--text span {
+  color: #0065ff;
+}
+
+.el-button.is-plain:hover,
+.el-button.is-plain:focus {
+  color: #0065ff;
+  border-color: #0065ff;
+}
+</style>

--
Gitblit v1.8.0