From 06f3288fe2add882234fe4ac904f885280c0699b Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Fri, 16 Jul 2021 15:08:36 +0800
Subject: [PATCH] 任务追踪和树形背景
---
src/views/policeTracking/policeTracking.vue | 879 +++++++++++++++++++++++++++++-----------------------------
src/styles/element-ui.scss | 2
2 files changed, 439 insertions(+), 442 deletions(-)
diff --git a/src/styles/element-ui.scss b/src/styles/element-ui.scss
index 2441bbf..5dfd8d8 100644
--- a/src/styles/element-ui.scss
+++ b/src/styles/element-ui.scss
@@ -171,7 +171,7 @@
color: $fontColor !important;
}
.el-tree {
- background-color: $inputB !important;
+ background-color: $mainB !important;
color: $fontColor !important;
}
.el-table th {
diff --git a/src/views/policeTracking/policeTracking.vue b/src/views/policeTracking/policeTracking.vue
index 66b3cd2..ec3fc8c 100644
--- a/src/views/policeTracking/policeTracking.vue
+++ b/src/views/policeTracking/policeTracking.vue
@@ -30,7 +30,6 @@
class="policeForm"
label-width="100px"
style="
- background: #fff;
margin-top: 20px;
margin-left: 10px;
margin-right: 10px;
@@ -61,10 +60,7 @@
<el-row>
<el-col span="24">
<el-form-item label="备注">
- <el-input
- v-model="form.bz"
- autocomplete="off"
- ></el-input>
+ <el-input v-model="form.bz" autocomplete="off"></el-input>
</el-form-item>
</el-col>
</el-row>
@@ -85,24 +81,29 @@
</el-row>
<el-row>
<el-col span="12">
- <avue-form :option="securityArritem" v-model="form"></avue-form>
+ <avue-form
+ :option="securityArritem"
+ v-model="form"
+ ></avue-form>
</el-col>
-<!-- <el-col span="12">-->
-<!-- <el-form-item label="派发人">-->
-<!-- <el-input-->
-<!-- disabled="true"-->
-<!-- v-model="form.alarmPeople"-->
-<!-- autocomplete="off"-->
-<!-- ></el-input>-->
-<!-- </el-form-item>-->
-<!-- </el-col>-->
+ <!-- <el-col span="12">-->
+ <!-- <el-form-item label="派发人">-->
+ <!-- <el-input-->
+ <!-- disabled="true"-->
+ <!-- v-model="form.alarmPeople"-->
+ <!-- autocomplete="off"-->
+ <!-- ></el-input>-->
+ <!-- </el-form-item>-->
+ <!-- </el-col>-->
</el-row>
</el-form>
- <div class="grid-content bg-purple-light" style="text-align: center">
+ <div
+ class="grid-content bg-purple-light"
+ style="text-align: center"
+ >
<el-button @click="onSubmit()" type="primary">派发</el-button>
</div>
-
</el-card>
<div
@@ -131,7 +132,6 @@
size="mini"
label-width="100px"
style="
- background: #fff;
margin-top: 20px;
margin-left: 10px;
margin-right: 10px;
@@ -300,239 +300,202 @@
</template>
<script>
- import axios from "axios";
- import {getList, getclient} from "@/api/real/real";
- import {update} from "@/api/real/real";
+import axios from "axios";
+import { getList, getclient } from "@/api/real/real";
+import { update } from "@/api/real/real";
- export default {
- inject: ["reload"],
- data() {
- return {
- flag: true,
- selectOptions: [],
- receivingList: [],
- security: {},
- imgSrc: [],
- srcList: [],
- form: {},
- itemOption: {
- menuBtn: false,
- column: [
- {
- disabled: true,
- row: false,
- prop: "province",
- type: "select",
- placeholder: "省份",
- props: {
- label: "name",
- value: "code",
- },
- cascaderItem: ["city", "district"],
- dicUrl: "/api/blade-system/region/select",
- span: 1,
- labelWidth: "0",
- className: "cityClassSelect",
+export default {
+ inject: ["reload"],
+ data() {
+ return {
+ flag: true,
+ selectOptions: [],
+ receivingList: [],
+ security: {},
+ imgSrc: [],
+ srcList: [],
+ form: {},
+ itemOption: {
+ menuBtn: false,
+ column: [
+ {
+ disabled: true,
+ row: false,
+ prop: "province",
+ type: "select",
+ placeholder: "省份",
+ props: {
+ label: "name",
+ value: "code",
},
- {
- disabled: true,
- row: false,
- prop: "city",
- type: "select",
- placeholder: "地市",
- props: {
- label: "name",
- value: "code",
- },
- dicUrl: "/api/blade-system/region/select?code={{key}}",
- span: 1,
- labelWidth: "0",
- className: "cityClassSelect",
+ cascaderItem: ["city", "district"],
+ dicUrl: "/api/blade-system/region/select",
+ span: 1,
+ labelWidth: "0",
+ className: "cityClassSelect",
+ },
+ {
+ disabled: true,
+ row: false,
+ prop: "city",
+ type: "select",
+ placeholder: "地市",
+ props: {
+ label: "name",
+ value: "code",
},
- {
- disabled: true,
- row: false,
- prop: "district",
- type: "select",
- placeholder: "区县",
- props: {
- label: "name",
- value: "code",
- },
- dicUrl: "/api/blade-system/region/select?code={{key}}",
- span: 1,
- labelWidth: "0",
- className: "cityClassSelect",
+ dicUrl: "/api/blade-system/region/select?code={{key}}",
+ span: 1,
+ labelWidth: "0",
+ className: "cityClassSelect",
+ },
+ {
+ disabled: true,
+ row: false,
+ prop: "district",
+ type: "select",
+ placeholder: "区县",
+ props: {
+ label: "name",
+ value: "code",
},
- ],
- }, securityArritem: {
- menuBtn: false,
- column: [
- {
- label: "处警员",
- prop: "securityArr",
- type: "tree",
- multiple: true,
- leafOnly: "",
- span: 24,
- dicUrl: "/api/catalogs/catalogs/getBigTree",
- props: {
- label: "title"
- },
- rules: [{
+ dicUrl: "/api/blade-system/region/select?code={{key}}",
+ span: 1,
+ labelWidth: "0",
+ className: "cityClassSelect",
+ },
+ ],
+ },
+ securityArritem: {
+ menuBtn: false,
+ column: [
+ {
+ label: "处警员",
+ prop: "securityArr",
+ type: "tree",
+ multiple: true,
+ leafOnly: "",
+ span: 24,
+ dicUrl: "/api/catalogs/catalogs/getBigTree",
+ props: {
+ label: "title",
+ },
+ rules: [
+ {
required: true,
message: "请选择处警员",
- trigger: "blur"
- }],
- },
- ],
- },
- tableData: [],
- multipleSelection: [],
- ensureNames: "",
- ensureId: "",
- baseUrl: "",
- oldVideoSatart: false,
- vaddress: null,
- audios: [],
- feedbackVideo: "",
- };
- },
- created() {
- this.form = this.$route.query;
- if (
- !(
- this.form.securityArr &&
- this.form.securityArr != null &&
- this.form.securityArr != undefined &&
- this.form.securityArr.length > 0
- )
- ) {
- this.form.securityArr = [];
- }
- this.updatedPageData();
- this.vaddress = this.form.vaddress;
- this.getReceivingAlarm();
- this.baseUrl = `/map/index.html?ISinit=1&openid=AlertSecurity&id=${this.form.id}&jd=${this.form.jd}&wd=${this.form.wd}&pid=${this.form.deptId}&deptId=${this.form.deptId}&oneId=${this.form.oneId}`;
- },
- mounted() {
- this.getAudios();
- this.getImgAndVideo();
- this.$refs.mapDiv.onload = () => {
- window.frames[1].init("AlertSecurity", {
- x: this.form.jd,
- y: this.form.wd,
- });
- };
- },
- updated() {
- var arr = [];
- this.tableData.forEach((item) => {
- if (item.id == this.form.oneId) {
- arr.push(item);
- }
+ trigger: "blur",
+ },
+ ],
+ },
+ ],
+ },
+ tableData: [],
+ multipleSelection: [],
+ ensureNames: "",
+ ensureId: "",
+ baseUrl: "",
+ oldVideoSatart: false,
+ vaddress: null,
+ audios: [],
+ feedbackVideo: "",
+ };
+ },
+ created() {
+ this.form = this.$route.query;
+ if (
+ !(
+ this.form.securityArr &&
+ this.form.securityArr != null &&
+ this.form.securityArr != undefined &&
+ this.form.securityArr.length > 0
+ )
+ ) {
+ this.form.securityArr = [];
+ }
+ this.updatedPageData();
+ this.vaddress = this.form.vaddress;
+ this.getReceivingAlarm();
+ this.baseUrl = `/map/index.html?ISinit=1&openid=AlertSecurity&id=${this.form.id}&jd=${this.form.jd}&wd=${this.form.wd}&pid=${this.form.deptId}&deptId=${this.form.deptId}&oneId=${this.form.oneId}`;
+ },
+ mounted() {
+ this.getAudios();
+ this.getImgAndVideo();
+ this.$refs.mapDiv.onload = () => {
+ window.frames[1].init("AlertSecurity", {
+ x: this.form.jd,
+ y: this.form.wd,
});
-
- if (this.form.jtype != 2) {
- this.toggleSelection(arr);
+ };
+ },
+ updated() {
+ var arr = [];
+ this.tableData.forEach((item) => {
+ if (item.id == this.form.oneId) {
+ arr.push(item);
}
- },
- methods: {
- getDate() {
- // 当前时间
- var timestamp = Date.parse(new Date());
- var serverDate = new Date(timestamp);
+ });
- // 本周周一的时间
- var mondayTime =
- timestamp - (serverDate.getDay() - 1) * 24 * 60 * 60 * 1000;
- var mondayData = new Date(mondayTime);
- //年
- var mondayY = mondayData.getFullYear();
- //月
- var mondayM =
- mondayData.getMonth() + 1 < 10
- ? "0" + (mondayData.getMonth() + 1)
- : mondayData.getMonth() + 1;
- //日
- var mondayD =
- mondayData.getDate() < 10
- ? "0" + mondayData.getDate()
- : mondayData.getDate();
- // 当前时间
- var currentData = new Date(timestamp);
- //年
- var currentY = currentData.getFullYear();
- //月
- var currentM =
- currentData.getMonth() + 1 < 10
- ? "0" + (currentData.getMonth() + 1)
- : currentData.getMonth() + 1;
- //日
- var currentD =
- currentData.getDate() < 10
- ? "0" + currentData.getDate()
- : currentData.getDate();
- //时
- var currenH =
- currentData.getHours() < 10
- ? "0" + currentData.getHours()
- : currentData.getHours();
- //分
- var currenM =
- currentData.getMinutes() < 10
- ? "0" + currentData.getMinutes()
- : currentData.getMinutes();
- //秒
- var currenS =
- currentData.getSeconds() < 10
- ? "0" + currentData.getSeconds()
- : currentData.getSeconds();
+ if (this.form.jtype != 2) {
+ this.toggleSelection(arr);
+ }
+ },
+ methods: {
+ getDate() {
+ // 当前时间
+ var timestamp = Date.parse(new Date());
+ var serverDate = new Date(timestamp);
- return {
- day: {
- beginTime: currentY + "-" + currentM + "-" + currentD + " 00:00:00",
- endTime:
- currentY +
- "-" +
- currentM +
- "-" +
- currentD +
- " " +
- currenH +
- ":" +
- currenM +
- ":00",
- },
- week: {
- beginTime: mondayY + "-" + mondayM + "-" + mondayD + " 00:00:00",
- endTime:
- currentY +
- "-" +
- currentM +
- "-" +
- currentD +
- " " +
- currenH +
- ":" +
- currenM +
- ":00",
- },
- month: {
- beginTime: mondayY + "-" + mondayM + "-01 00:00:00",
- endTime:
- currentY +
- "-" +
- currentM +
- "-" +
- currentD +
- " " +
- currenH +
- ":" +
- currenM +
- ":00",
- },
- current:
+ // 本周周一的时间
+ var mondayTime =
+ timestamp - (serverDate.getDay() - 1) * 24 * 60 * 60 * 1000;
+ var mondayData = new Date(mondayTime);
+ //年
+ var mondayY = mondayData.getFullYear();
+ //月
+ var mondayM =
+ mondayData.getMonth() + 1 < 10
+ ? "0" + (mondayData.getMonth() + 1)
+ : mondayData.getMonth() + 1;
+ //日
+ var mondayD =
+ mondayData.getDate() < 10
+ ? "0" + mondayData.getDate()
+ : mondayData.getDate();
+ // 当前时间
+ var currentData = new Date(timestamp);
+ //年
+ var currentY = currentData.getFullYear();
+ //月
+ var currentM =
+ currentData.getMonth() + 1 < 10
+ ? "0" + (currentData.getMonth() + 1)
+ : currentData.getMonth() + 1;
+ //日
+ var currentD =
+ currentData.getDate() < 10
+ ? "0" + currentData.getDate()
+ : currentData.getDate();
+ //时
+ var currenH =
+ currentData.getHours() < 10
+ ? "0" + currentData.getHours()
+ : currentData.getHours();
+ //分
+ var currenM =
+ currentData.getMinutes() < 10
+ ? "0" + currentData.getMinutes()
+ : currentData.getMinutes();
+ //秒
+ var currenS =
+ currentData.getSeconds() < 10
+ ? "0" + currentData.getSeconds()
+ : currentData.getSeconds();
+
+ return {
+ day: {
+ beginTime: currentY + "-" + currentM + "-" + currentD + " 00:00:00",
+ endTime:
currentY +
"-" +
currentM +
@@ -542,216 +505,250 @@
currenH +
":" +
currenM +
+ ":00",
+ },
+ week: {
+ beginTime: mondayY + "-" + mondayM + "-" + mondayD + " 00:00:00",
+ endTime:
+ currentY +
+ "-" +
+ currentM +
+ "-" +
+ currentD +
+ " " +
+ currenH +
":" +
- currenS,
- };
- },
- onSubmit() {
- var that = this;
-
- var userId = JSON.parse(
- window.localStorage.getItem("群防群控后台管理系统-userInfo")
- ).content.real_name;
-
- if (that.form.securityArr != null && that.form.securityArr != ""){
- that.form.jtype = "1";
- if (typeof that.form.securityArr != "string"){
- var security = "";
- that.form.securityArr.forEach((item) => {
- security = security + item + ",";
- });
- that.form.securityArr = security.substring(0, security.length - 1);
- }
-
- if (that.form.securityArr == "" || that.form.securityArr == null) {
- that.form.jtype = "0";
- that.form.alarmPeople = "";
- }else {
- that.form.jtype = "1";
- //已派发保安
- that.form.alarmPeople = userId;
- }
-
- axios({
- url: '/api/alarm/alarm/submit',
- method: 'post',
- data: that.form
- }).then((resdata) => {
- that.$message({
- message: '派遣完成',
- type: 'success'
- });
- });
-
- }else {
- that.$message({
- message: '未选择保安，请重试',
- type: 'warning'
- });
- }
-
-
-
- },
-
- getReceivingAlarm() {
- axios
- .get(`/api/operation/list?jid=${this.form.id}`)
- .then((res) => {
- this.receivingList = res.data.data.records;
- });
- },
-
- getList() {
- var that = this;
- },
-
- handleSelectionChange(val) {
- this.ensureNames = "";
- this.ensureId = "";
- val.forEach((item, index) => {
- this.ensureId += item.id;
- this.ensureId += ",";
- if (index == val.length - 1) {
- this.ensureNames += item.name;
- this.ensureNames += "。";
- } else {
- this.ensureNames += item.name;
- this.ensureNames += "、";
- }
- });
-
- this.multipleSelection = val;
- },
-
- toggleSelection(rows) {
- if (rows) {
- rows.forEach((row) => {
- this.$refs.multipleTable.toggleRowSelection(row);
- });
- } else {
- this.$refs.multipleTable.clearSelection();
- }
- },
-
- getAudios() {
- axios({
- method: "get",
- url: "/api/avideo/list",
- params: {
- jid: this.form.id,
- },
- }).then((resdata) => {
- if (resdata.data.data.records.length > 0)
- this.audios = resdata.data.data.records;
- });
- },
- getImgAndVideo() {
- axios({
- method: "post",
- url: "/api/feedback/feedback/selectFeedEdit",
- params: {
- jid: this.form.id,
- },
- }).then((resdata) => {
- if (resdata.data.data.length > 0) {
- if (resdata.data.data[0].List.length > 0)
- this.security = resdata.data.data[0].List[0];
- if (resdata.data.data[0].tp.length > 0) {
- this.imgSrc = resdata.data.data[0].tp;
- this.srcList = resdata.data.data[0].tp;
- }
- if (resdata.data.data[0].sp.length > 0) {
- this.feedbackVideo = resdata.data.data[0].sp[0];
- }
- }
- });
- },
-
- oldOpenVideo() {
- getclient(this.form.id).then((res) => {
- if (res.data.data.vaddress != "") {
- this.vaddress = res.data.data.vaddress;
- }
- this.oldVideoSatart = true;
- });
- },
-
- updatedPageData() {
- var that = this;
- axios({
- method: "get",
- url: "/api/alarm/alarm/page",
- params: {
- id: that.form.id,
- },
- }).then(function (res) {
- that.form = res.data.data.records[0];
- if (
- !(
- that.form.securityArr &&
- that.form.securityArr != null &&
- that.form.securityArr != undefined &&
- that.form.securityArr.length > 0
- )
- ) {
- that.form.securityArr = [];
- }
- that.getList(); //报错deptId格式不对liu.2021.5.7
- });
- },
+ currenM +
+ ":00",
+ },
+ month: {
+ beginTime: mondayY + "-" + mondayM + "-01 00:00:00",
+ endTime:
+ currentY +
+ "-" +
+ currentM +
+ "-" +
+ currentD +
+ " " +
+ currenH +
+ ":" +
+ currenM +
+ ":00",
+ },
+ current:
+ currentY +
+ "-" +
+ currentM +
+ "-" +
+ currentD +
+ " " +
+ currenH +
+ ":" +
+ currenM +
+ ":" +
+ currenS,
+ };
},
- };
+ onSubmit() {
+ var that = this;
+
+ var userId = JSON.parse(
+ window.localStorage.getItem("群防群控后台管理系统-userInfo")
+ ).content.real_name;
+
+ if (that.form.securityArr != null && that.form.securityArr != "") {
+ that.form.jtype = "1";
+ if (typeof that.form.securityArr != "string") {
+ var security = "";
+ that.form.securityArr.forEach((item) => {
+ security = security + item + ",";
+ });
+ that.form.securityArr = security.substring(0, security.length - 1);
+ }
+
+ if (that.form.securityArr == "" || that.form.securityArr == null) {
+ that.form.jtype = "0";
+ that.form.alarmPeople = "";
+ } else {
+ that.form.jtype = "1";
+ //已派发保安
+ that.form.alarmPeople = userId;
+ }
+
+ axios({
+ url: "/api/alarm/alarm/submit",
+ method: "post",
+ data: that.form,
+ }).then((resdata) => {
+ that.$message({
+ message: "派遣完成",
+ type: "success",
+ });
+ });
+ } else {
+ that.$message({
+ message: "未选择保安，请重试",
+ type: "warning",
+ });
+ }
+ },
+
+ getReceivingAlarm() {
+ axios.get(`/api/operation/list?jid=${this.form.id}`).then((res) => {
+ this.receivingList = res.data.data.records;
+ });
+ },
+
+ getList() {
+ var that = this;
+ },
+
+ handleSelectionChange(val) {
+ this.ensureNames = "";
+ this.ensureId = "";
+ val.forEach((item, index) => {
+ this.ensureId += item.id;
+ this.ensureId += ",";
+ if (index == val.length - 1) {
+ this.ensureNames += item.name;
+ this.ensureNames += "。";
+ } else {
+ this.ensureNames += item.name;
+ this.ensureNames += "、";
+ }
+ });
+
+ this.multipleSelection = val;
+ },
+
+ toggleSelection(rows) {
+ if (rows) {
+ rows.forEach((row) => {
+ this.$refs.multipleTable.toggleRowSelection(row);
+ });
+ } else {
+ this.$refs.multipleTable.clearSelection();
+ }
+ },
+
+ getAudios() {
+ axios({
+ method: "get",
+ url: "/api/avideo/list",
+ params: {
+ jid: this.form.id,
+ },
+ }).then((resdata) => {
+ if (resdata.data.data.records.length > 0)
+ this.audios = resdata.data.data.records;
+ });
+ },
+ getImgAndVideo() {
+ axios({
+ method: "post",
+ url: "/api/feedback/feedback/selectFeedEdit",
+ params: {
+ jid: this.form.id,
+ },
+ }).then((resdata) => {
+ if (resdata.data.data.length > 0) {
+ if (resdata.data.data[0].List.length > 0)
+ this.security = resdata.data.data[0].List[0];
+ if (resdata.data.data[0].tp.length > 0) {
+ this.imgSrc = resdata.data.data[0].tp;
+ this.srcList = resdata.data.data[0].tp;
+ }
+ if (resdata.data.data[0].sp.length > 0) {
+ this.feedbackVideo = resdata.data.data[0].sp[0];
+ }
+ }
+ });
+ },
+
+ oldOpenVideo() {
+ getclient(this.form.id).then((res) => {
+ if (res.data.data.vaddress != "") {
+ this.vaddress = res.data.data.vaddress;
+ }
+ this.oldVideoSatart = true;
+ });
+ },
+
+ updatedPageData() {
+ var that = this;
+ axios({
+ method: "get",
+ url: "/api/alarm/alarm/page",
+ params: {
+ id: that.form.id,
+ },
+ }).then(function (res) {
+ that.form = res.data.data.records[0];
+ if (
+ !(
+ that.form.securityArr &&
+ that.form.securityArr != null &&
+ that.form.securityArr != undefined &&
+ that.form.securityArr.length > 0
+ )
+ ) {
+ that.form.securityArr = [];
+ }
+ that.getList(); //报错deptId格式不对liu.2021.5.7
+ });
+ },
+ },
+};
</script>
<style scoped lang="scss">
- .el-col {
- height: calc(100% - 5px);
+.el-col {
+ height: calc(100% - 5px);
+}
+
+.trackClass {
+ height: 100%;
+ overflow: auto;
+ overflow-x: hidden;
+}
+
+.receiving-alarm-box {
+ line-height: 32px !important;
+ height: 200px;
+ overflow-y: auto;
+
+ .el-card__body {
+ padding: 0 10px !important;
}
+}
- .trackClass {
- height: 100%;
- overflow: auto;
- overflow-x: hidden;
- }
+.audios-box,
+.scene-image-box {
+ line-height: 32px !important;
+ height: auto;
+ max-height: 200px;
+ overflow-y: auto;
- .receiving-alarm-box {
- line-height: 32px !important;
- height: 200px;
- overflow-y: auto;
+ .el-card__body {
+ display: flex;
+ padding: 0 10px !important;
+ flex-wrap: wrap;
+ justify-content: center;
+ align-items: center;
- .el-card__body {
- padding: 0 10px !important;
+ .x-audio-wrap.inline {
+ margin: 10px;
+ }
+
+ .el-image {
+ margin: 10px;
+ width: 160px;
+ height: 80px;
}
}
+}
- .audios-box,
- .scene-image-box {
- line-height: 32px !important;
- height: auto;
- max-height: 200px;
- overflow-y: auto;
-
- .el-card__body {
- display: flex;
- padding: 0 10px !important;
- flex-wrap: wrap;
- justify-content: center;
- align-items: center;
-
- .x-audio-wrap.inline {
- margin: 10px;
- }
-
- .el-image {
- margin: 10px;
- width: 160px;
- height: 80px;
- }
- }
- }
-
- #old_video::-webkit-media-controls-timeline {
- display: block;
- }
+#old_video::-webkit-media-controls-timeline {
+ display: block;
+}
</style>
--
Gitblit v1.9.3