From 2d3d56ff801b73afdb779267004d740f9beafe57 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期二, 31 十月 2023 16:09:44 +0800
Subject: [PATCH] 2023.10.31
---
src/views/overlay-grid/components/GridEditing.vue | 94 +++++++++++++++++++++++++++++++++++++---------
1 files changed, 75 insertions(+), 19 deletions(-)
diff --git a/src/views/overlay-grid/components/GridEditing.vue b/src/views/overlay-grid/components/GridEditing.vue
index 3d7d5d1..619aae4 100644
--- a/src/views/overlay-grid/components/GridEditing.vue
+++ b/src/views/overlay-grid/components/GridEditing.vue
@@ -1,18 +1,53 @@
<template>
- <div>褰撳墠鎿嶄綔缃戞牸: {{ selectedGrid.gName }}</div>
- <div>缃戞牸缂栧彿锛歿{ selectedGrid.gId }}</div>
- <div>缃戞牸椤剁偣锛�</div>
- <div v-for="(item, index) in selectedGrid.gSide" :key="index">
- {{ item }}
- </div>
- <div class="btn-group">
- <el-button @click="startOrCompleteEdit">{{
- isEdit ? '淇濆瓨缂栬緫' : '寮�濮嬬紪杈�'
- }}</el-button>
- <el-button :disabled="!isEdit" @click="cancelEdit"
- >鍙栨秷缂栬緫</el-button
- >
- </div>
+ <CloseButton @close="closeEdit">
+ <div class="fy-card">
+ <div class="fy-h2">姝ｅ湪缂栬緫缃戞牸</div>
+ <div class="fy-main">
+ <el-form
+ label-position="left"
+ :rules="rules"
+ :model="selectedGrid"
+ ref="formRef"
+ >
+ <!-- <el-form-item label="缂栧彿" prop="id">
+ <div>{{ selectedGrid.id }}</div>
+ </el-form-item> -->
+ <el-form-item label="鍚嶇О" prop="name">
+ <el-input
+ v-model="selectedGrid.name"
+ placeholder="璇疯緭鍏ョ綉鏍煎悕绉�"
+ clearable
+ disabled
+ ></el-input>
+ </el-form-item>
+ <el-form-item label="椤剁偣" prop="sides">
+ <el-scrollbar height="100px" class="fy-main-border">
+ <div
+ class="list-wrapper"
+ v-for="(item, index) in selectedGrid.sides"
+ :key="index"
+ >
+ {{ `${index + 1}. ${item}` }}
+ </div>
+ </el-scrollbar>
+ </el-form-item>
+ </el-form>
+ <div class="btn-group">
+ <el-button
+ @click="startOrCompleteEdit"
+ :loading="loading"
+ >{{ isEdit ? '淇濆瓨缂栬緫' : '寮�濮嬬紪杈�' }}</el-button
+ >
+ <el-button
+ type="danger"
+ :disabled="!isEdit"
+ @click="cancelEdit"
+ >鍙栨秷缂栬緫</el-button
+ >
+ </div>
+ </div>
+ </div>
+ </CloseButton>
</template>
<script>
@@ -30,7 +65,8 @@
},
data() {
return {
- editing: false
+ editing: false,
+ loading: false
};
},
computed: {
@@ -41,13 +77,18 @@
'openGridEdit',
'closeGridEdit',
'saveSelectedGrid',
- 'quitSelectedGrid'
+ 'quitSelectedGrid',
+ 'clearSelect'
]),
// 寮�濮嬫垨瀹屾垚淇濆瓨缂栬緫缃戞牸澶氳竟褰�
startOrCompleteEdit() {
if (this.isEdit) {
- this.saveSelectedGrid();
- this.closeGridEdit();
+ this.loading = true;
+ this.saveSelectedGrid()
+ .then(() => {
+ this.closeGridEdit();
+ })
+ .finally(() => (this.loading = false));
} else {
this.openGridEdit();
}
@@ -56,12 +97,27 @@
cancelEdit() {
this.quitSelectedGrid();
this.closeGridEdit();
+ },
+ // 鍏抽棴缂栬緫鐣岄潰
+ closeEdit() {
+ this.cancelEdit();
+ this.clearSelect();
}
}
};
</script>
<style scoped>
+.wrapper {
+ /* position: relative;
+ background: antiquewhite;
+ padding-right: 10px; */
+}
.btn-group {
display: flex;
}
-</style>
\ No newline at end of file
+
+.list-wrapper {
+ width: 100%;
+ /* background-color: var(--el-bg-color-page); */
+}
+</style>
--
Gitblit v1.9.3