From a4e06ccd3cd976fbe4eef99e188d42ec9f3ad054 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Thu, 08 Apr 2021 09:32:05 +0800
Subject: [PATCH] 样式修改
---
src/views/distribution/index.vue | 427 +++++++++++++++++++++++++++++++---------------------
1 files changed, 255 insertions(+), 172 deletions(-)
diff --git a/src/views/distribution/index.vue b/src/views/distribution/index.vue
index 2d8cfa3..d5355b9 100644
--- a/src/views/distribution/index.vue
+++ b/src/views/distribution/index.vue
@@ -1,151 +1,203 @@
<template>
- <el-form
- :model="form"
- label-position="right"
- size="mini"
- label-width="100px"
- style="background: #fff; margin-left: 10px; margin-right: 10px; height: calc(100% - 40px); width: calc(100% - 20px)"
- >
- <el-row>
- <el-col span="12"
- ><el-form-item label="报警人姓名">
- <el-input
- disabled="true"
- v-model="form.galarmPeople"
- autocomplete="off"
- ></el-input> </el-form-item
- ></el-col>
- <el-col span="12"
- ><el-form-item label="联系方式">
- <el-input
- disabled="true"
- v-model="form.phoneNumber"
- autocomplete="off"
- ></el-input> </el-form-item
- ></el-col>
- </el-row>
- <el-row>
- <el-col span="12"
- ><el-form-item label="事发地址">
- <el-input
- disabled="true"
- v-model="form.place"
- autocomplete="off"
- ></el-input> </el-form-item
- ></el-col>
- <el-col span="12"
- ><el-form-item label="行政区">
- <el-input
- disabled="true"
- v-model="form.addvnm"
- autocomplete="off"
- ></el-input> </el-form-item
- ></el-col>
- </el-row>
- <el-row>
- <el-col span="12"
- ><el-form-item label="报警时间">
- <el-input
- disabled="true"
- v-model="form.galarmTime"
- autocomplete="off"
- ></el-input> </el-form-item
- ></el-col>
- <el-col span="12"
- ><el-form-item label="报警内容">
- <el-input
- disabled="true"
- v-model="form.content"
- autocomplete="off"
- ></el-input> </el-form-item
- ></el-col>
- </el-row>
- <el-row>
- <el-col span="12"
- ><el-form-item label="警情级别">
- <el-input
- disabled="true"
- v-model="form.level"
- autocomplete="off"
- ></el-input> </el-form-item
- ></el-col>
- <el-col span="12"
- ><el-form-item label="警情类别">
- <el-input
- disabled="true"
- v-model="form.waringType"
- autocomplete="off"
- ></el-input> </el-form-item
- ></el-col>
- </el-row>
- <el-row>
- <el-col span="12"
- ><el-form-item label="处理方式">
- <el-radio-group
- @change="processChange"
- v-model="processmode"
- :disabled="this.form.type == 0 ? false : true"
- >
- <el-radio label="派发保安"></el-radio>
- <el-radio label="提示业主"></el-radio>
- </el-radio-group> </el-form-item
- ></el-col>
- <el-col span="12"
- ><el-form-item label="处理人">
- <el-select
- v-model="form.handName"
- @change="selectChange"
- placeholder="请选择处理人"
- :disabled="
- this.form.type == 0
- ? this.form.handletype == 1
- ? true
- : false
- : true
- "
- >
- <el-option
- v-for="item in selectOptions"
- :key="item.value"
- :label="item.label"
- :value="item.snumber"
- >
- </el-option>
- </el-select> </el-form-item
- ></el-col>
- </el-row>
- <el-row>
- <el-col span="12"
- ><el-form-item label="是否上报110">
- <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.deviceNumber"
- autocomplete="off"
- ></el-input> </el-form-item
- ></el-col>
- </el-row>
- <el-form-item style="text-align: center; margin: 0" class="dispose">
- <el-button
- :style="
- this.form.type == 0
- ? 'background:#66b1ff; border-color:#66b1ff'
- : 'background:#cfcfcf; border-color:#cfcfcf'
+ <el-row>
+ <el-col :span="12">
+ <el-form
+ :model="form"
+ label-position="right"
+ size="mini"
+ label-width="100px"
+ style="
+ background: #fff;
+ margin-left: 10px;
+ margin-right: 10px;
+ height: calc(100% - 40px);
+ width: calc(100% - 20px);
"
- type="primary"
- @click="onSubmit"
>
- 保 存
- </el-button>
- </el-form-item>
- </el-form>
+ <el-row>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="报警人姓名">
+ <el-input
+ disabled="true"
+ v-model="form.galarmPeople"
+ autocomplete="off"
+ ></el-input> </el-form-item
+ ></el-col>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="联系方式">
+ <el-input
+ disabled="true"
+ v-model="form.phoneNumber"
+ autocomplete="off"
+ ></el-input> </el-form-item
+ ></el-col>
+ </el-row>
+ <el-row>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="事发地址">
+ <el-input
+ disabled="true"
+ v-model="form.place"
+ autocomplete="off"
+ ></el-input> </el-form-item
+ ></el-col>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="要求处置时间">
+ <el-input
+ disabled="true"
+ v-model="form.czTime"
+ autocomplete="off"
+ ></el-input> </el-form-item
+ ></el-col>
+ </el-row>
+ <el-row>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="报警时间">
+ <el-input
+ disabled="true"
+ v-model="form.galarmTime"
+ autocomplete="off"
+ ></el-input> </el-form-item
+ ></el-col>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="报警内容">
+ <el-input
+ disabled="true"
+ v-model="form.content"
+ autocomplete="off"
+ ></el-input> </el-form-item
+ ></el-col>
+ </el-row>
+ <el-row>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="警情级别">
+ <el-input
+ disabled="true"
+ v-model="form.level"
+ autocomplete="off"
+ ></el-input> </el-form-item
+ ></el-col>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="警情类别"
+ >
+ <el-input
+ disabled="true"
+ v-model="form.$waringType"
+ autocomplete="off"
+ ></el-input> </el-form-item
+ ></el-col>
+ </el-row>
+ <el-row>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="处理方式">
+ <el-radio-group @change="processChange" v-model="processmode">
+ <el-radio
+ class="distribution-form-label"
+ label="派发保安"
+ ></el-radio>
+ <el-radio
+ class="distribution-form-label"
+ label="提示业主"
+ ></el-radio>
+ </el-radio-group> </el-form-item
+ ></el-col>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="处理人">
+ <el-select
+ style="width: 100%"
+ v-model="handName"
+ @change="selectChange"
+ placeholder="请选择处理人"
+ :disabled="this.processmode == '派发保安' ? false : true"
+ >
+ <el-option
+ v-for="item in selectOptions"
+ :key="item.value"
+ :label="item.label"
+ :value="item.snumber"
+ >
+ </el-option>
+ </el-select> </el-form-item
+ ></el-col>
+ </el-row>
+ <el-row>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="是否上报110">
+ <el-input
+ disabled="true"
+ v-model="form.alarmPeople"
+ autocomplete="off"
+ ></el-input> </el-form-item
+ ></el-col>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="设备编号">
+ <el-input
+ disabled="true"
+ v-model="form.deviceNumber"
+ autocomplete="off"
+ ></el-input> </el-form-item
+ ></el-col>
+ </el-row>
+
+ <el-row>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="省份">
+ <el-input
+ disabled="true"
+ v-model="form.$province"
+ autocomplete="off"
+ ></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="地市">
+ <el-input
+ disabled="true"
+ v-model="form.$city"
+ autocomplete="off"
+ ></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col span="12"
+ ><el-form-item class="distribution-form-label" label="行政区">
+ <el-input
+ disabled="true"
+ v-model="form.$district"
+ autocomplete="off"
+ ></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+
+ <el-form-item
+ class="distribution-form-save"
+ style="text-align: center; margin: 0"
+ >
+ <el-button
+ :style="
+ this.form.type == 0
+ ? 'background:#66b1ff; border-color:#66b1ff'
+ : 'background:#cfcfcf; border-color:#cfcfcf'
+ "
+ type="primary"
+ @click="onSubmit"
+ >
+ 保 存
+ </el-button>
+ </el-form-item>
+ </el-form></el-col
+ >
+ <el-col :span="12">
+ <iframe
+ id="DistributionMapDiv"
+ ref="DistributionMapDiv"
+ :src="baseUrl"
+ frameborder="0"
+ width="100%"
+ height="100%"
+ ></iframe>
+ </el-col>
+ </el-row>
</template>
<script>
@@ -153,20 +205,51 @@
export default {
data() {
return {
+ handName: '',
selectOptions: [],
form: {},
- processmode: "提示业主"
+ baseUrl: "",
+ processmode: "派发保安",
+ ref: this.$refs,
};
},
created() {
this.form = this.$route.query;
- this.form.handletype = 1;
+ this.form.handletype = 0;
+
+
if (this.form.type == 0) {
this.form.handleP = "";
this.form.handName = "";
}
this.getSelectOptions();
+
+ this.baseUrl = `/map/index.html?ISinit=1&openid=AlertSecurity&id=${this.form.id}&jd=${this.form.jd}&wd=${this.form.wd}`;
+
+ var arr = [];
+ var flag = false;
+
+ this.$store.state.tags.tagList.forEach((item) => {
+ if (item.label != "警情分发处置") {
+ arr.push(item);
+ } else if (item.label == "警情分发处置" && flag == false) {
+ arr.push(item);
+ flag = true;
+ }
+ });
+
+ this.$store.state.tags.tagList = arr;
},
+
+ mounted() {
+ this.$refs.DistributionMapDiv.onload = () => {
+ window.frames[0].init("AlertSecurity", {
+ x: this.form.jd,
+ y: this.form.wd,
+ });
+ };
+ },
+
methods: {
onSubmit() {
if (this.form.type == 1 || this.form.type == 2) return;
@@ -179,9 +262,9 @@
}
var newAxios = axios.create({
- baseURL: "https://s16s652780.51mypc.cn",
+ baseURL: "https://web.byisf.com",
withCredentials: false,
- headers: {}
+ headers: {},
});
newAxios
@@ -194,14 +277,14 @@
handleP: this.form.handleP,
handName: this.form.handName,
handletype: this.form.handletype,
- type: "1"
- }
+ type: "1",
+ },
}
)
- .then(res => {
+ .then((res) => {
if (res.data.msg == "修改成功") {
var arr = [];
- this.$store.state.tags.tagList.forEach(item => {
+ this.$store.state.tags.tagList.forEach((item) => {
if (item.value != this.$store.state.tags.tag.value) {
arr.push(item);
}
@@ -214,9 +297,9 @@
getSelectOptions() {
var newAxios = axios.create({
- baseURL: "https://s16s652780.51mypc.cn",
+ baseURL: "https://web.byisf.com",
withCredentials: false,
- headers: {}
+ headers: {},
});
newAxios
@@ -228,57 +311,57 @@
this.form.wd +
")"
)
- .then(res => {
- res.data.data.forEach(item => {
+ .then((res) => {
+ res.data.data.forEach((item) => {
this.selectOptions.push({
value: item.sname,
label: item.sname,
- snumber: item.snumber
+ snumber: item.snumber,
});
});
});
},
selectChange(value) {
- this.selectOptions.forEach(item => {
+
+ this.selectOptions.forEach((item) => {
if (item.snumber == value) {
this.form.handName = item.value;
+ this.handName = item.value;
this.form.handleP = value;
}
});
+
},
processChange(value) {
+
value == "提示业主"
? (this.form.handletype = 1)
: (this.form.handletype = 0);
- }
- }
+
+ },
+ },
};
</script>
-<style spend="lang">
+<style scoped>
.el-form .el-row {
- padding: 0 40px !important;
+ padding: 0 20px !important;
}
.el-form .el-col {
- padding: 0 40px !important;
+ padding: 0 20px !important;
}
.el-form .el-col,
.el-form .el-col .el-form-item__label,
.el-form .el-col .el-form-item__content {
height: 50px !important;
- line-height: 50px !important;
- /* margin: 0 !important; */
+
+ margin: 0 !important;
}
.el-form .el-col .el-form-item {
height: 100% !important;
-
- margin: 0 !important;
-}
-
-.dispose .el-form-item__content {
- margin: 0 !important;
+ line-height: 1.2 !important;
}
</style>
--
Gitblit v1.9.3