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"></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"></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"></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"></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