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