From 5c628344a3f0cd4fd6a7ce48696e22b7fb7314f8 Mon Sep 17 00:00:00 2001 From: xiangpei <xiangpei@timesnew.cn> Date: 星期二, 12 三月 2024 17:54:17 +0800 Subject: [PATCH] 点位批量添加优化 --- src/views/system/point/index.vue | 109 +++++++++++++++--------------------------------------- 1 files changed, 30 insertions(+), 79 deletions(-) diff --git a/src/views/system/point/index.vue b/src/views/system/point/index.vue index 05ca375..6098420 100644 --- a/src/views/system/point/index.vue +++ b/src/views/system/point/index.vue @@ -123,7 +123,7 @@ <el-input v-model="tempForm.pointName" placeholder="璇疯緭鍏ョ偣浣嶅悕绉�" /> </el-form-item> <el-form-item label="杩愮淮鍗曚綅" prop="unitId"> - <el-select v-model="tempForm.unitId" placeholder="杩愮淮鍗曚綅"> + <el-select :disabled="title === '淇敼杩愮淮鐐逛綅'" v-model="tempForm.unitId" placeholder="杩愮淮鍗曚綅"> <el-option v-for="item in unitList" :key="item.id" @@ -134,6 +134,7 @@ </el-form-item> <el-form-item label="鐐逛綅鏃跺尯" prop="timezone"> <el-date-picker + :disabled="title === '淇敼杩愮淮鐐逛綅'" @change="dateChange" v-model="tempForm.timezone" type="daterange" @@ -147,41 +148,19 @@ </el-form-item> <el-form-item> <div style="display: flex;flex-direction: row-reverse"> - <el-button @click="nextAdd" type="primary" plain>缁х画娣诲姞</el-button> + <el-button @click="nextAdd" type="primary" plain>娣诲姞鐐逛綅</el-button> </div> </el-form-item> - <div class="point-row" v-for="(point,index) in tempFormList"> - <div class="row-item"> - <el-input :disabled="editingIndex!==index" v-model="point.pointName" placeholder="鐐逛綅鍚嶇О"></el-input> + <el-row style="min-height: 200px;max-height: 400px; overflow-y: auto"> + <el-col class="col-item" v-for="(point) in tempFormList" :span="8"> + <div style="margin-right: 5px"> + <el-cascader v-model="point.region" :options="regionList" placeholder="璇烽�夋嫨鍖哄煙" :show-all-levels="false"></el-cascader> </div> - <div class="row-item"> - <el-select :disabled="editingIndex!==index" v-model="point.unitId" placeholder="杩愮淮鍗曚綅"> - <el-option - v-for="item in unitList" - :key="item.id" - :label="item.value" - :value="item.id"> - </el-option> - </el-select> + <div v-if="title === '淇敼杩愮淮鐐逛綅'"> + <el-button @click="removeRegion(point)" type="danger" icon="el-icon-delete" circle></el-button> </div> - <div class="row-item"> - <el-date-picker - :disabled="editingIndex!==index" - v-model="point.timezone" - type="daterange" - align="right" - unlink-panels - range-separator="鑷�" - start-placeholder="寮�濮嬫棩鏈�" - end-placeholder="缁撴潫鏃ユ湡" - > - </el-date-picker> - </div> - <div class="row-item"> - <el-button v-show="editingIndex!==index" @click="editPointItem(index)" type="danger" size="small" plain>淇敼</el-button> - <el-button v-show="editingIndex===index" @click="editFinishItem(index)" type="success" size="small" plain>瀹屾垚</el-button> - </div> - </div> + </el-col> + </el-row> </el-form> <div slot="footer" class="dialog-footer"> <el-button type="primary" @click="submitForm">纭� 瀹�</el-button> @@ -189,52 +168,19 @@ </div> </el-dialog> - <!-- 淇敼杩愮淮鐐逛綅瀵硅瘽妗� --> - <el-dialog :title="title" :visible.sync="editOpen" width="500px" append-to-body> - <el-form ref="form" :model="form" :rules="rules" label-width="120px"> - <el-form-item label="鐐逛綅鍚嶇О" prop="pointName"> - <el-input v-model="form.pointName" placeholder="璇疯緭鍏ョ偣浣嶅悕绉�" /> - </el-form-item> - <el-form-item label="杩愮淮鍗曚綅" prop="unitId"> - <el-select v-model="form.unitId" placeholder="杩愮淮鍗曚綅"> - <el-option - v-for="item in unitList" - :key="item.id" - :label="item.value" - :value="item.id"> - </el-option> - </el-select> - </el-form-item> - <el-form-item label="鐐逛綅鏃跺尯" prop="timezone"> - <el-date-picker - @change="dateChange" - v-model="form.timezone" - type="daterange" - align="right" - unlink-panels - range-separator="鑷�" - start-placeholder="寮�濮嬫棩鏈�" - end-placeholder="缁撴潫鏃ユ湡" - > - </el-date-picker> - </el-form-item> - </el-form> - <div slot="footer" class="dialog-footer"> - <el-button type="primary" @click="submitForm">纭� 瀹�</el-button> - <el-button @click="updateCancel">鍙� 娑�</el-button> - </div> - </el-dialog> </div> </template> <script> import { listPoint, getPoint, delPoint, addPoint, addPointBatch, updatePoint } from "@/api/platform/point"; import { unitSelect } from "@/api/platform/unit"; +import { getCascader } from '../../../api/platform/region' export default { name: "Point", data() { return { + regionList: [], // 姝e湪淇敼绗嚑涓� editingIndex: null, // 閬僵灞� @@ -296,8 +242,18 @@ created() { this.getList(); this.getUnitSelect(); + this.getCascader(); }, methods: { + removeRegion(item) { + this.tempFormList = this.tempFormList.filter(data => data !== item) + }, + // 鑾峰彇鍖哄幙绾ц仈 + getCascader() { + getCascader().then(res => { + this.regionList = res.data; + }) + }, // 鐐逛綅椤逛慨鏀瑰畬鎴� editFinishItem(index) { this.editingIndex = null; @@ -322,9 +278,9 @@ }, // 缁х画娣诲姞鐐逛綅 nextAdd() { - this.formList.push(this.tempForm); - this.tempFormList.push(this.tempForm); - this.tempForm = {}; + let item = {} + this.formList.push(item); + this.tempFormList.push(item); }, getUnitSelect() { // 杩愮淮鍗曚綅涓嬫媺鍒楄〃 @@ -395,7 +351,7 @@ getPoint(id).then(response => { this.form = response.data; this.form.timezone = [this.form.startTime, this.form.endTime] - this.editOpen = true; + this.open = true; this.title = "淇敼杩愮淮鐐逛綅"; }); }, @@ -451,16 +407,11 @@ </script> <style scoped> -.point-row { +.col-item { + margin: 5px 0; display: flex; flex-direction: row; + align-content: center; justify-content: center; - align-items: center; -} -.row-item { - margin-right: 5px; -} -.row-item:nth-last-child { - margin-right: 0; } </style> -- Gitblit v1.8.0