From 02ce22be65df8b717d5f1614e5d7dbfcdf1ce1b9 Mon Sep 17 00:00:00 2001
From: Oliver <1070107765@qq.com>
Date: 星期三, 14 十二月 2022 09:29:51 +0800
Subject: [PATCH] 预警研判 操作
---
src/views/systemSetting/device/bayonet/create/index.vue | 406 +++++++++++++++++++++++++++++++++++++++++-----------------
1 files changed, 287 insertions(+), 119 deletions(-)
diff --git a/src/views/systemSetting/device/bayonet/create/index.vue b/src/views/systemSetting/device/bayonet/create/index.vue
index a97553f..170d4f3 100644
--- a/src/views/systemSetting/device/bayonet/create/index.vue
+++ b/src/views/systemSetting/device/bayonet/create/index.vue
@@ -1,137 +1,305 @@
<template>
- <div class="create">
- <el-form ref="device" label-position="right" label-width="120px" :model="bayonet" :rule="rules">
- <!-- 鍗″彛鍚嶇О -->
- <div class="device-item">
- <div class="item-left">
- <el-form-item label="鍗″彛鍚嶇О:" prop="name">
- <el-input v-model="bayonet.name" placeholder="璇峰～鍐欏崱鍙ｅ悕绉�"></el-input>
- </el-form-item>
- </div>
- <div class="item-right"></div>
- </div>
- <!-- 缁忕含搴︿綅缃� -->
- <div class="device-item">
- <div class="item-left">
- <el-form-item label="缁忕含搴︿綅缃�:" prop="longitude">
- <el-input v-model="bayonet.longitude" placeholder="璇峰～鍐欑粡搴︿綅缃�"></el-input>
- </el-form-item>
- <el-form-item prop="latitude">
- <el-input v-model="bayonet.latitude" placeholder="璇峰～鍐欑含搴︿綅缃�"></el-input>
- </el-form-item>
- </div>
- <div class="item-right"></div>
- </div>
- <!-- 鎵�灞炲尯鍩� -->
- <div class="device-item">
- <div class="item-left">
- <el-form-item label="鎵�灞炲尯鍩�:" prop="area">
- <el-input v-model="bayonet.area" placeholder="璇峰～鍐欏尯鍩熷悕绉�"></el-input>
- </el-form-item>
- </div>
- <div class="item-right"></div>
- </div>
- <!-- 鍩熷悕/ip -->
- <div class="device-item">
- <div class="item-left">
- <el-form-item label="鍩熷悕/IP:" prop="domainName">
- <el-input v-model="bayonet.domainName" placeholder="璇峰～鍐欏煙鍚嶆垨鑰匢P"></el-input>
- </el-form-item>
- </div>
- <div class="item-right"></div>
- </div>
- <!-- 绔彛鍙� -->
- <div class="device-item">
- <div class="item-left">
- <el-form-item label="绔彛鍙�:" prop="port">
- <el-input v-model="bayonet.port" placeholder="璇疯緭鍏ョ鍙ｅ彿"></el-input>
- </el-form-item>
- </div>
- <div class="item-right"></div>
- </div>
- <!-- 鍓嶇绫诲瀷 -->
- <div class="device-item">
- <div class="item-left">
- <el-form-item label="鍓嶇绫诲瀷:" prop="webType">
- <el-input v-model="bayonet.webType" placeholder="璇疯緭鍏ュ墠绔被鍨�"></el-input>
- </el-form-item>
- </div>
- <div class="item-right"></div>
- </div>
- <!-- 鍑哄叆鍩庣被鍨� -->
- <div class="device-item">
- <div class="item-left">
- <el-form-item label="鍑哄叆鍩庣被鍨�:" prop="cityType">
- <el-input v-model="bayonet.cityType" placeholder="鍑哄煄/鍏ュ煄"></el-input>
- </el-form-item>
- </div>
- <div class="item-right"></div>
- </div>
- <!-- 鎻忚堪 -->
- <div class="device-item">
- <div class="item-left">
- <el-form-item label="鎻忚堪:" prop="description">
- <el-input type="textarea" :rows='5' maxlength="200" v-model="bayonet.description" placeholder="璇疯緭鍏ユ弿杩板唴瀹�200瀛椾互鍐�"></el-input>
- </el-form-item>
- </div>
- <div class="item-right"></div>
- </div>
- <!-- 鎸夐挳 -->
- <div class="device-btn">
- <el-button>杩斿洖</el-button>
- <el-button type="primary">纭畾</el-button>
- </div>
- </el-form>
- </div>
+ <div class="create">
+ <el-form
+ ref="device"
+ label-position="right"
+ label-width="120px"
+ :model="bayonet"
+ :rules="rules"
+ >
+ <!-- 鍗″彛鍚嶇О -->
+ <div class="device-item">
+ <div class="item-left">
+ <el-form-item label="鍗″彛鍚嶇О:" prop="name">
+ <el-input
+ v-model="bayonet.name"
+ placeholder="璇峰～鍐欏崱鍙ｅ悕绉�"
+ ></el-input>
+ </el-form-item>
+ </div>
+ <div class="item-right"></div>
+ </div>
+ <!-- 缁忕含搴︿綅缃� -->
+ <div class="device-item">
+ <div class="item-left">
+ <el-form-item label="缁忕含搴︿綅缃�:" prop="longitude">
+ <el-input
+ v-model="bayonet.longitude"
+ placeholder="璇峰～鍐欑粡搴︿綅缃�"
+ ></el-input>
+ </el-form-item>
+ <el-form-item prop="latitude">
+ <el-input
+ v-model="bayonet.latitude"
+ placeholder="璇峰～鍐欑含搴︿綅缃�"
+ ></el-input>
+ </el-form-item>
+ </div>
+ <div class="item-right"></div>
+ </div>
+ <!-- 鎵�灞炲尯鍩� -->
+ <div class="device-item">
+ <div class="item-left">
+ <el-form-item label="鎵�灞炲尯鍩�:" prop="belongArea">
+ <el-input
+ v-model="bayonet.belongArea"
+ placeholder="璇峰～鍐欏尯鍩熷悕绉�"
+ ></el-input>
+ </el-form-item>
+ </div>
+ <div class="item-right"></div>
+ </div>
+ <!-- 鍩熷悕/ip -->
+ <div class="device-item">
+ <div class="item-left">
+ <el-form-item label="鍩熷悕/IP:" prop="ipAddress">
+ <el-input
+ v-model="bayonet.ipAddress"
+ placeholder="璇峰～鍐欏煙鍚嶆垨鑰匢P"
+ ></el-input>
+ </el-form-item>
+ </div>
+ <div class="item-right"></div>
+ </div>
+ <!-- 绔彛鍙� -->
+ <div class="device-item">
+ <div class="item-left">
+ <el-form-item label="绔彛鍙�:" prop="port">
+ <el-input
+ v-model="bayonet.port"
+ placeholder="璇疯緭鍏ョ鍙ｅ彿"
+ ></el-input>
+ </el-form-item>
+ </div>
+ <div class="item-right"></div>
+ </div>
+ <!-- 鍓嶇绫诲瀷 -->
+ <div class="device-item">
+ <div class="item-left">
+ <el-form-item class="optionItem" label="鍓嶇绫诲瀷:" prop="role">
+ <el-select
+ v-model="bayonet.frontEndType"
+ placeholder="璇疯緭鍏ュ墠绔被鍨�"
+ collapse-tags
+ >
+ <el-option
+ v-for="item in frontEndTypeList"
+ :key="item.id"
+ :label="item.name"
+ :value="item.id"
+ >
+ </el-option>
+ </el-select>
+ </el-form-item>
+ </div>
+ <div class="item-right"></div>
+ </div>
+ <!-- 鍑哄叆鍩庣被鍨� -->
+ <div class="device-item">
+ <div class="item-left">
+ <el-form-item class="optionItem" label="鍑哄叆鍩庣被鍨�:" prop="role">
+ <el-select
+ v-model="bayonet.inOutCityType"
+ placeholder="璇疯緭鍏ュ嚭鍏ュ煄绫诲瀷"
+ collapse-tags
+ >
+ <el-option
+ v-for="item in inOutTypeList"
+ :key="item.id"
+ :label="item.name"
+ :value="item.id"
+ >
+ </el-option>
+ </el-select>
+ </el-form-item>
+ </div>
+ <div class="item-right"></div>
+ </div>
+ <!-- 鎻忚堪 -->
+ <div class="device-item">
+ <div class="item-left">
+ <el-form-item label="鎻忚堪:" prop="description">
+ <el-input
+ type="textarea"
+ :rows="5"
+ maxlength="200"
+ v-model="bayonet.description"
+ placeholder="璇疯緭鍏ユ弿杩板唴瀹�200瀛椾互鍐�"
+ ></el-input>
+ </el-form-item>
+ </div>
+ <div class="item-right"></div>
+ </div>
+ <!-- 鎸夐挳 -->
+ <div class="device-btn">
+ <el-button @click="closeDialog">杩斿洖</el-button>
+ <el-button type="primary" @click="onSubmit">纭畾</el-button>
+ </div>
+ </el-form>
+ </div>
</template>
<script>
-export default {
- data() {
- return {
- bayonet: {
- bayonetName: '',
- latitude: '',
- longitude: '',
- area: '',
- ipAddress: '',
- port: '',
- frontEndType: '',
- inOutCityType: '',
- description: '',
- },
- rules: {
+import bayonet from "@/api/system/bayonet";
+import { deepClone, getTypeList } from "@/utils/helper";
- }
+export default {
+ props: {
+ originalBayonet: {
+ type: Object,
+ default: () => {},
+ },
+ isEdit: {
+ type: Boolean,
+ default: () => false,
+ },
+ },
+
+ data() {
+ return {
+ bayonet: {
+ name: "",
+ latitude: "",
+ longitude: "",
+ belongArea: "",
+ ipAddress: "",
+ port: "",
+ frontEndType: "",
+ inOutCityType: "",
+ description: "",
+ },
+ rules: {
+ name: [{ required: true, trigger: "blur", message: "璇峰～鍐欏崱鍙ｅ悕绉�" }],
+ latitude: [
+ {
+ required: true,
+ trigger: ["blur", "change"],
+ message: "璇峰～鍐欑含搴︿綅缃�",
+ },
+ ],
+ longitude: [
+ {
+ required: true,
+ trigger: ["blur", "change"],
+ message: "璇峰～鍐欑粡搴︿綅缃�",
+ },
+ ],
+ belongArea: [
+ {
+ required: true,
+ trigger: ["blur", "change"],
+ message: "璇峰～鍐欏尯鍩熷悕绉�",
+ },
+ ],
+ ipAddress: [
+ {
+ required: true,
+ trigger: ["blur", "change"],
+ message: "璇峰～鍐欏煙鍚嶆垨鑰匢P",
+ },
+ ],
+ port: [
+ {
+ required: true,
+ trigger: ["blur", "change"],
+ message: "璇疯緭鍏ョ鍙ｅ彿",
+ },
+ ],
+ frontEndType: [
+ {
+ required: true,
+ trigger: ["blur", "change"],
+ message: "璇疯緭鍏ュ墠绔被鍨�",
+ },
+ ],
+ inOutCityType: [
+ {
+ required: true,
+ trigger: ["blur", "change"],
+ message: "璇峰～鍐欏嚭鍩�/鍏ュ煄",
+ },
+ ],
+ },
+ frontEndTypeList: [],
+ inOutTypeList: [],
+ };
+ },
+ beforeCreate() {},
+ created() {
+ this.getInOutCityTypeList();
+ this.getFrontEndTypeList();
+ if (this.originalBayonet) {
+ this.bayonet = this.originalBayonet;
+ }
+ },
+ methods: {
+ onSubmit() {
+ this.$refs.device.validate((valid) => {
+ if (valid) {
+ const copyBayonet = deepClone(this.bayonet);
+ if (!this.isEdit) {
+ bayonet
+ .addBayonet(this.bayonet)
+ .then(() => {
+ this.$message({ type: "success", message: "鎿嶄綔鎴愬姛" });
+ this.$emit("closeDialog");
+ })
+ .catch((err) => {
+ this.$message({ type: "error", message: err });
+ });
+ } else {
+ bayonet
+ .updateBayonet(copyBayonet)
+ .then(() => {
+ this.$message({ type: "success", message: "鎿嶄綔鎴愬姛" });
+ this.$emit("closeDialog");
+ })
+ .catch((err) => {
+ this.$message({ type: "error", message: err });
+ });
+ }
+ } else {
+ this.$message({ type: "warning", message: "璇锋鏌ュ繀濉」" });
}
+ });
+ },
+ async getInOutCityTypeList() {
+ this.inOutTypeList = await getTypeList(1, "14");
},
-}
+ async getFrontEndTypeList() {
+ this.frontEndTypeList = await getTypeList(1, "13");
+ },
+ closeDialog() {
+ this.$emit("closeDialog");
+ },
+ },
+};
</script>
<style lang="scss" scoped>
.create {
- padding: 20px;
+ padding: 20px;
- .device-item {
- display: flex;
+ .device-item {
+ display: flex;
- .item-left {
- flex: 6;
- display: flex;
+ .item-left {
+ flex: 6;
+ display: flex;
- .el-form-item {
- flex: 1;
- }
- }
-
- .item-right {
- flex: 4;
- }
+ .el-form-item {
+ flex: 1;
+ }
}
- .device-btn {
- padding-top: 20px;
- display: flex;
- justify-content: center;
+ .item-right {
+ flex: 4;
}
+ }
+
+ .device-btn {
+ padding-top: 20px;
+ display: flex;
+ justify-content: center;
+ }
}
</style>
\ No newline at end of file
--
Gitblit v1.8.0