From 46f46a3ea84dac4cd0e6ff8b038e2d7b9e97380e Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期一, 28 十一月 2022 16:13:13 +0800
Subject: [PATCH] 店铺管理优化
---
src/views/operate/fivepack/threepack/components/updateUser/index.vue | 497 ++++++++++++++++-----------
src/views/operate/fivepack/threepack/components/score/index.vue | 86 ++++
src/api/operate/storeManagement.js | 4
src/views/operate/fivepack/threepack/components/content.vue | 480 ++++++++++++++++----------
4 files changed, 673 insertions(+), 394 deletions(-)
diff --git a/src/api/operate/storeManagement.js b/src/api/operate/storeManagement.js
index 6a418e0..cbc2cc6 100644
--- a/src/api/operate/storeManagement.js
+++ b/src/api/operate/storeManagement.js
@@ -26,4 +26,8 @@
export function getVideoPoint(params) {
return http.get('/sccg/video_point/query', params);
+}
+
+export function getStoreScore(id) {
+ return http.get('/sccg/store/storeinfo/' + id + '/storeScore')
}
\ No newline at end of file
diff --git a/src/views/operate/fivepack/threepack/components/content.vue b/src/views/operate/fivepack/threepack/components/content.vue
index c2d6a7b..7275754 100644
--- a/src/views/operate/fivepack/threepack/components/content.vue
+++ b/src/views/operate/fivepack/threepack/components/content.vue
@@ -1,122 +1,222 @@
<template>
- <div class="content">
- <header>
- <div class="headerContent">
- <div class="find">
- <div class="search-item">
- <span>杈撳叆鏌ヨ:</span>
- <el-input style="flex: 1" :placeholder="isStorePage() ? '搴楅摵锛堥棬搴楋級鍚嶇О' : '璇疯緭鍏ュ簵閾虹紪鍙�'" v-model="storeCode" />
- </div>
- <div class="search-item">
- <span>搴楅摵鐘舵��:</span>
- <el-select v-model="storeStatus" placeholder="閫夋嫨搴楅摵鐘舵��">
- <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
- </el-select>
- </div>
- <div class="findBtn">
- <el-button type="primary" @click="search" icon="el-icon-search">鏌ヨ</el-button>
- <el-button icon="el-icon-delete-solid" @click="handleReset">閲嶇疆</el-button>
- </div>
+ <div class="content">
+ <header>
+ <div class="headerContent">
+ <div class="find">
+ <div class="search-item">
+ <span>杈撳叆鏌ヨ:</span>
+ <el-input
+ style="flex: 1"
+ :placeholder="
+ isStorePage() ? '搴楅摵锛堥棬搴楋級鍚嶇О' : '璇疯緭鍏ュ簵閾虹紪鍙�'
+ "
+ v-model="storeCode"
+ />
</div>
- <el-button v-if="isStorePage()" type="primary" icon="el-icon-plus" @click="handleView(null, 'create')">娣诲姞</el-button>
+ <div class="search-item">
+ <span>搴楅摵鐘舵��:</span>
+ <el-select v-model="storeStatus" placeholder="閫夋嫨搴楅摵鐘舵��">
+ <el-option
+ v-for="item in options"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ />
+ </el-select>
+ </div>
+ <div class="findBtn">
+ <el-button type="primary" @click="search" icon="el-icon-search"
+ >鏌ヨ</el-button
+ >
+ <el-button icon="el-icon-delete-solid" @click="handleReset"
+ >閲嶇疆</el-button
+ >
+ </div>
</div>
- </header>
- <main>
- <!-- 鏁版嵁灞曠ず -->
- <el-table ref="multipleTable"
- :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}"
- :data="tableData" style="width: 100%" :row-class-name="tableRowClassName">
- <el-table-column type="selection" min-width="5">
- </el-table-column>
- <el-table-column prop="storeNumber" label="搴楅摵缂栧彿" min-width="10">
- </el-table-column>
- <el-table-column prop="storeName" label="搴楅摵鍚嶇О" min-width="10">
- </el-table-column>
- <el-table-column prop="owner" label="搴楅摵鑱旂郴浜�" min-width="10">
- </el-table-column>
- <el-table-column prop="contact" label="搴楅摵鑱旂郴鐢佃瘽" min-width="10">
- </el-table-column>
- <el-table-column prop="storeAddress" label="搴楅摵璇︾粏鍦板潃" min-width="10">
- </el-table-column>
- <el-table-column prop="videoPoint" label="鍏宠仈鎽勫儚鏈�" min-width="10">
- <template v-if="scope.row.videoId" slot-scope="scope">
- <span>{{ scope.row.videoPoint.name }}</span>
- </template>
- </el-table-column>
- <el-table-column prop="operation" label="鎿嶄綔" min-width="20">
- <template slot-scope="scope">
- <div v-if="!isStorePage()" class="operation">
- <el-link icon="el-icon-edit" :underline="false" @click="handleView(scope.row, 'update')">缂栬緫</el-link>
- <el-link class="leftPx" icon="el-icon-delete-solid" :underline="false" @click="handleDelete(scope.row.id)">鍒犻櫎</el-link>
- <el-link class="leftPx" icon="el-icon-edit" :underline="false">鎺ㄩ�佷俊鎭�</el-link>
- <el-link class="leftPx" icon="el-icon-edit" :underline="false" @click="handleView(scope.row, 'view')">鏌ョ湅</el-link>
- </div>
- <div v-else class="operation">
- <el-link icon="el-icon-edit" :underline="false" @click="handleView(scope.row, 'update')">缂栬緫</el-link>
- <el-link class="leftPx" icon="el-icon-delete-solid" :underline="false"
- @click="handleDelete(scope.row.id)">鍒犻櫎</el-link>
- </div>
- </template>
- </el-table-column>
- </el-table>
- <!-- 鏌ョ湅淇敼椤甸潰 -->
- <el-dialog :visible.sync="dialogUpdate" width="45%"
- :destroy-on-close="true"
- :title="dialogType === 'view' ? '鏌ョ湅搴楅摵淇℃伅' : '淇敼搴楅摵淇℃伅'" :before-close="handleClose">
- <updateUser v-if="dialogUpdate" :dialogType="dialogType" :storeInfo="storeInfo" :isStorePage="isStorePage()" @closeDialog="closeDialog" />
- </el-dialog>
- <!-- 鍒嗛〉 -->
- <div class="pagination">
- <el-pagination background :current-page="currentPage" layout="prev, pager, next" :total="totalNum"
- :page-size="pageSize" @current-change="changeCurrentPage">
- </el-pagination>
- </div>
- </main>
- </div>
+ <el-button
+ v-if="isStorePage()"
+ type="primary"
+ icon="el-icon-plus"
+ @click="handleView(null, 'create')"
+ >娣诲姞</el-button
+ >
+ </div>
+ </header>
+ <main>
+ <!-- 鏁版嵁灞曠ず -->
+ <el-table
+ ref="multipleTable"
+ :header-cell-style="{
+ background: '#06122c',
+ 'font-size': '12px',
+ color: '#4b9bb7',
+ 'font-weight': '650',
+ 'line-height': '45px',
+ }"
+ :data="tableData"
+ style="width: 100%"
+ :row-class-name="tableRowClassName"
+ >
+ <el-table-column type="selection" min-width="5"> </el-table-column>
+ <el-table-column prop="storeNumber" label="搴楅摵缂栧彿" min-width="10">
+ </el-table-column>
+ <el-table-column prop="storeName" label="搴楅摵鍚嶇О" min-width="10">
+ </el-table-column>
+ <el-table-column prop="owner" label="搴楅摵鑱旂郴浜�" min-width="10">
+ </el-table-column>
+ <el-table-column prop="contact" label="搴楅摵鑱旂郴鐢佃瘽" min-width="10">
+ </el-table-column>
+ <el-table-column
+ prop="storeAddress"
+ label="搴楅摵璇︾粏鍦板潃"
+ min-width="10"
+ >
+ </el-table-column>
+ <el-table-column prop="storeScore" label="搴楅摵绉垎" min-width="10">
+ </el-table-column>
+ <el-table-column prop="videoPoint" label="鍏宠仈鎽勫儚鏈�" min-width="10">
+ <template v-if="scope.row.videoId" slot-scope="scope">
+ <span>{{ scope.row.videoPoint.name }}</span>
+ </template>
+ </el-table-column>
+ <el-table-column prop="operation" label="鎿嶄綔" min-width="20">
+ <template slot-scope="scope">
+ <div v-if="!isStorePage()" class="operation">
+ <el-link
+ icon="el-icon-edit"
+ :underline="false"
+ @click="handleView(scope.row, 'update')"
+ >缂栬緫</el-link
+ >
+ <el-link
+ class="leftPx"
+ icon="el-icon-delete-solid"
+ :underline="false"
+ @click="handleDelete(scope.row.id)"
+ >鍒犻櫎</el-link
+ >
+ <el-link class="leftPx" icon="el-icon-edit" :underline="false"
+ >鎺ㄩ�佷俊鎭�</el-link
+ >
+ <el-link
+ class="leftPx"
+ icon="el-icon-edit"
+ :underline="false"
+ @click="handleScoreView(scope.row, 'view')"
+ >鏌ョ湅</el-link
+ >
+ </div>
+ <div v-else class="operation">
+ <el-link
+ icon="el-icon-edit"
+ :underline="false"
+ @click="handleView(scope.row, 'update')"
+ >缂栬緫</el-link
+ >
+ <el-link
+ class="leftPx"
+ icon="el-icon-delete-solid"
+ :underline="false"
+ @click="handleDelete(scope.row.id)"
+ >鍒犻櫎</el-link
+ >
+ </div>
+ </template>
+ </el-table-column>
+ </el-table>
+ <!-- 鏌ョ湅淇敼椤甸潰 -->
+ <el-dialog
+ :visible.sync="dialogUpdate"
+ width="45%"
+ :destroy-on-close="true"
+ :title="dialogType === 'view' ? '鏌ョ湅搴楅摵淇℃伅' : '淇敼搴楅摵淇℃伅'"
+ :before-close="handleClose"
+ >
+ <updateUser
+ v-if="dialogUpdate"
+ :dialogType="dialogType"
+ :storeInfo="storeInfo"
+ :isStorePage="isStorePage()"
+ @closeDialog="closeDialog"
+ />
+ </el-dialog>
+ <!-- 鏌ョ湅淇敼椤甸潰 -->
+ <el-dialog
+ :visible.sync="dialogScore"
+ width="45%"
+ :destroy-on-close="true"
+ title="鏌ョ湅绉垎"
+ :before-close="handleClose"
+ >
+ <scoreView :storeInfo="storeInfo" @closeDialog="closeDialog" />
+ </el-dialog>
+ <!-- 鍒嗛〉 -->
+ <div class="pagination">
+ <el-pagination
+ background
+ :current-page="currentPage"
+ layout="prev, pager, next"
+ :total="totalNum"
+ :page-size="pageSize"
+ @current-change="changeCurrentPage"
+ >
+ </el-pagination>
+ </div>
+ </main>
+ </div>
</template>
<script>
import updateUser from "@/views/operate/fivepack/threepack/components/updateUser";
-import { getStoreInfoList, deleteStoreInfo } from "@/api/operate/storeManagement";
+import scoreView from "@/views/operate/fivepack/threepack/components/score";
+import {
+ getStoreInfoList,
+ deleteStoreInfo,
+} from "@/api/operate/storeManagement";
export default {
- components: { updateUser },
+ components: { updateUser, scoreView },
created() {
this.search();
},
- props: ['model'],
+ props: ["model"],
data() {
return {
storeCode: null,
storeStatus: null,
- options: [{ label: '鍏ㄩ儴', value: 0 }, { label: '缁忚惀', value: 1 }, { label: '鍊掗棴', value: 2 }],
+ options: [
+ { label: "鍏ㄩ儴", value: 0 },
+ { label: "缁忚惀", value: 1 },
+ { label: "鍊掗棴", value: 2 },
+ ],
tableData: [],
dialogUpdate: false,
+ dialogScore: false,
currentPage: 1,
totalNum: 0,
pageSize: 10,
userInfo: null,
- dialogType: '',
- storeInfo: null
- }
+ dialogType: "",
+ storeInfo: null,
+ };
},
methods: {
search() {
const status = this.storeStatus === 0 ? null : this.storeStatus;
getStoreInfoList({ keyword: this.storeCode, status })
- .then(({ list, pageSize, totalPage }) => {
- this.tableData = list;
- this.pageSize = pageSize;
- this.totalNum = totalPage;
- })
- .catch(err => this.$message({ type: 'error', message: err }));
+ .then(({ list, pageSize, totalPage }) => {
+ this.tableData = list;
+ this.pageSize = pageSize;
+ this.totalNum = totalPage;
+ })
+ .catch((err) => this.$message({ type: "error", message: err }));
},
handleReset() {
- this.storeCode = '';
+ this.storeCode = "";
this.storeStatus = null;
this.search();
},
@@ -126,22 +226,28 @@
this.storeInfo = row;
this.dialogType = type;
},
+ handleScoreView(row) {
+ this.dialogScore = true;
+ this.storeInfo = row;
+ },
handleDelete(id) {
deleteStoreInfo(id)
- .then(() => {
- this.$message({ type: 'success', message: '鎿嶄綔鎴愬姛' });
- this.search();
- })
- .catch(err => this.$message({ type: 'error', message: err }));
+ .then(() => {
+ this.$message({ type: "success", message: "鎿嶄綔鎴愬姛" });
+ this.search();
+ })
+ .catch((err) => this.$message({ type: "error", message: err }));
},
handleClose() {
this.dialogUpdate = false;
+ this.dialogScore = false;
},
closeDialog() {
this.dialogUpdate = false;
+ this.dialogScore = false;
this.search();
},
@@ -159,103 +265,103 @@
},
isStorePage() {
- return this.model === 'store';
+ return this.model === "store";
+ },
+ },
+};
+</script>
+<style lang="scss" scoped>
+.content {
+ flex: 1;
+ height: 100%;
+ padding-left: 20px;
+
+ .headerContent {
+ display: flex;
+ line-height: 100px;
+ justify-content: space-between;
+ align-items: center;
+
+ .find {
+ display: flex;
+ }
+
+ .search-item {
+ display: flex;
+ padding: 10px;
+ }
+
+ .findBtn {
+ line-height: 100px;
+ margin-left: 15px;
+ display: flex;
+ align-items: center;
+
+ .el-button {
+ padding: 12px 25px;
+ }
+ }
+
+ .addBtn {
+ padding: 12px 30px;
+ margin-left: 20%;
+ }
+ }
+
+ main {
+ background-color: #09152f;
+ margin-top: 20px;
+ padding-bottom: 50px;
+
+ .mainTitle {
+ line-height: 60px;
+ }
+
+ .el-link {
+ color: #4b9bb7;
+ }
+
+ .leftPx {
+ margin-left: 10px;
+ }
+
+ .pagination {
+ margin-top: 50px;
+ display: flex;
+ line-height: 50px;
+ justify-content: center;
+
+ .el-pagination {
+ &::v-deep li,
+ &::v-deep .btn-prev,
+ &::v-deep .btn-next {
+ background-color: #071f39;
+ color: #4b9bb7;
+ }
+ }
+ }
+
+ .el-table {
+ color: #4b9bb7;
+ font-size: 10px;
+
+ &::v-deep .el-table__empty-block {
+ background-color: #09152f;
+ color: #4b9bb7;
+ }
+
+ .operation {
+ display: flex;
+
+ .el-button {
+ border: none;
+ }
+
+ span:hover {
+ cursor: pointer;
+ }
+ }
}
}
}
-</script>
-<style lang="scss" scoped>
-.content{
- flex: 1;
- height: 100%;
- padding-left: 20px;
-
- .headerContent {
- display: flex;
- line-height: 100px;
- justify-content: space-between;
- align-items: center;
-
- .find {
- display: flex;
- }
-
- .search-item {
- display: flex;
- padding: 10px;
- }
-
- .findBtn {
- line-height: 100px;
- margin-left: 15px;
- display: flex;
- align-items: center;
-
- .el-button {
- padding: 12px 25px;
- }
- }
-
- .addBtn {
- padding: 12px 30px;
- margin-left: 20%;
- }
- }
-
- main {
- background-color: #09152f;
- margin-top: 20px;
- padding-bottom: 50px;
-
- .mainTitle {
- line-height: 60px;
- }
-
- .el-link {
- color: #4b9bb7;
- }
-
- .leftPx {
- margin-left: 10px;
- }
-
- .pagination {
- margin-top: 50px;
- display: flex;
- line-height: 50px;
- justify-content: center;
-
- .el-pagination {
- &::v-deep li,
- &::v-deep .btn-prev,
- &::v-deep .btn-next {
- background-color: #071f39;
- color: #4b9bb7;
- }
- }
- }
-
- .el-table {
- color: #4b9bb7;
- font-size: 10px;
-
- &::v-deep .el-table__empty-block {
- background-color: #09152f;
- color: #4b9bb7;
- }
-
- .operation {
- display: flex;
-
- .el-button {
- border: none;
- }
-
- span:hover {
- cursor: pointer;
- }
- }
- }
- }
- }
</style>
\ No newline at end of file
diff --git a/src/views/operate/fivepack/threepack/components/score/index.vue b/src/views/operate/fivepack/threepack/components/score/index.vue
new file mode 100644
index 0000000..bdaf7e5
--- /dev/null
+++ b/src/views/operate/fivepack/threepack/components/score/index.vue
@@ -0,0 +1,86 @@
+<template>
+ <div class="content">
+ <!-- 鏁版嵁灞曠ず -->
+ <el-table
+ ref="multipleTable"
+ :header-cell-style="{
+ background: '#06122c',
+ 'font-size': '12px',
+ color: '#4b9bb7',
+ 'font-weight': '650',
+ 'line-height': '45px',
+ }"
+ :data="tableData"
+ style="width: 100%"
+ :row-class-name="tableRowClassName"
+ >
+ <el-table-column type="selection" min-width="5"> </el-table-column>
+ <el-table-column prop="category" label="瑙勫垯绫诲埆" min-width="100">
+ </el-table-column>
+ <el-table-column prop="deductionItem" label="鎵ｅ垎椤�" min-width="200">
+ </el-table-column>
+ <el-table-column prop="markScore" label="鎵ｉ櫎鍒嗘暟" min-width="60">
+ </el-table-column>
+ <el-table-column prop="createTime" label="鎵ｅ垎鏃堕棿" min-width="180">
+ </el-table-column>
+ </el-table>
+
+ <!-- 鍒嗛〉 -->
+ <div class="pagination">
+ <el-pagination
+ background
+ :current-page="currentPage"
+ layout="prev, pager, next"
+ :total="totalNum"
+ :page-size="pageSize"
+ @current-change="changeCurrentPage"
+ >
+ </el-pagination>
+ </div>
+ </div>
+</template>
+<script>
+import { getStoreScore } from "@/api/operate/storeManagement";
+
+export default {
+ created() {
+ this.search();
+ },
+
+ props: ["storeInfo"],
+
+ data() {
+ return {
+ tableData: [],
+ currentPage: 1,
+ totalNum: 0,
+ pageSize: 10,
+ };
+ },
+
+ methods: {
+ search() {
+ getStoreScore(this.storeInfo.id)
+ .then((res) => {
+ this.tableData = res.records;
+ this.pageSize = res.size;
+ this.totalNum = res.total;
+ })
+ .catch((err) => this.$message({ type: "error", message: err }));
+ },
+
+ changeCurrentPage(currentPage) {
+ this.currentPage = currentPage;
+ this.search();
+ },
+
+ tableRowClassName({ row, rowIndex }) {
+ if ((rowIndex + 1) % 2 === 0) {
+ return "warning-row";
+ } else {
+ return "success-row";
+ }
+ },
+ },
+};
+</script>
\ No newline at end of file
diff --git a/src/views/operate/fivepack/threepack/components/updateUser/index.vue b/src/views/operate/fivepack/threepack/components/updateUser/index.vue
index 97d4bb2..cc23488 100644
--- a/src/views/operate/fivepack/threepack/components/updateUser/index.vue
+++ b/src/views/operate/fivepack/threepack/components/updateUser/index.vue
@@ -1,245 +1,328 @@
<template>
- <div class="updateUser">
- <main>
- <div class="mainContent">
- <el-form ref="store" label-width="140px" autoComplete="on" :model="store" :rules="rules"
- label-position="right">
- <!-- 搴楅摵绫诲瀷 -->
- <el-form-item v-if="isStorePage" class="optionItem" label="搴楅摵绫诲瀷:" prop="type">
- <el-cascader :options="shopTypeList" v-model="store.type" />
- </el-form-item>
- <!-- 搴楅摵缂栧彿 -->
- <el-form-item class="optionItem" label="搴楅摵缂栧彿:" prop="storeNumber">
- <el-input v-model="store.storeNumber" placeholder="璇峰～鍐欏簵閾虹紪鍙�" :disabled="isView()"></el-input>
- </el-form-item>
- <!-- 搴楅摵鍚嶇О -->
- <el-form-item class="optionItem" label="搴楅摵鍚嶇О:" prop="storeName">
- <el-input v-model="store.storeName" placeholder="璇峰～鍐欏簵鍚嶇О" :disabled="isView()"></el-input>
- </el-form-item>
- <!-- 搴楅摵鑱旂郴浜� -->
- <el-form-item class="optionItem" label="搴楅摵鑱旂郴浜�:" prop="owner">
- <el-input v-model="store.owner" placeholder="璇峰～鍐欏簵閾鸿仈绯讳汉" :disabled="isView()"></el-input>
- </el-form-item>
- <!-- 搴楅摵鑱旂郴鐢佃瘽 -->
- <el-form-item class="optionItem" label="搴楅摵鑱旂郴鐢佃瘽:" prop="contact">
- <el-input v-model="store.contact" placeholder="璇峰～鍐欏簵閾鸿仈绯荤數璇�" :disabled="isView()"></el-input>
- </el-form-item>
- <!-- 搴楅摵璇︾粏鍦板潃 -->
- <el-form-item class="optionItem" label="搴楅摵璇︾粏鍦板潃:" prop="storeAddress">
- <el-input v-model="store.storeAddress" placeholder="璇峰～鍐欏簵閾鸿缁嗗湴鍧�" :disabled="isView()"></el-input>
- </el-form-item>
- <!-- 鍏宠仈鎽勫儚鏈� -->
- <el-form-item v-if="isStorePage" class="optionItem" label="鍏宠仈鎽勫儚鏈�:" prop="relationVideo">
- <el-select v-model="store.relationVideo" placeholder="璇峰～鍐欏叧鑱旀憚鍍忔満" :disabled="isView()">
- <el-option v-for="item in relationVideoList" :key="item.id" :value="item.id" :label="item.name"></el-option>
- </el-select>
- </el-form-item>
- <el-form-item v-if="!isStorePage" class="optionItem" label="搴楅摵寰楀垎:">
- <el-input v-model="store.storeScore" :disabled="isView()"></el-input>
- </el-form-item>
- <el-form-item v-if="!isView()">
- <div class="optionBtn">
- <el-button type="primary" class="btn submit" @click.native.prevent="onSubmit">鎻愪氦</el-button>
- </div>
- </el-form-item>
- </el-form>
+ <div class="updateUser">
+ <main>
+ <div class="mainContent">
+ <el-form
+ ref="store"
+ label-width="140px"
+ autoComplete="on"
+ :model="store"
+ :rules="rules"
+ label-position="right"
+ >
+ <!-- 搴楅摵绫诲瀷 -->
+ <el-form-item
+ v-if="isStorePage"
+ class="optionItem"
+ label="搴楅摵绫诲瀷:"
+ prop="type"
+ >
+ <el-cascader :options="shopTypeList" v-model="store.type" />
+ </el-form-item>
+ <!-- 搴楅摵缂栧彿 -->
+ <el-form-item v-if="store.id" class="optionItem" label="搴楅摵缂栧彿:">
+ <el-input
+ v-model="store.storeNumber"
+ placeholder="璇峰～鍐欏簵閾虹紪鍙�"
+ disabled
+ ></el-input>
+ </el-form-item>
+ <!-- 搴楅摵鍚嶇О -->
+ <el-form-item class="optionItem" label="搴楅摵鍚嶇О:" prop="storeName">
+ <el-input
+ v-model="store.storeName"
+ placeholder="璇峰～鍐欏簵鍚嶇О"
+ :disabled="isView()"
+ ></el-input>
+ </el-form-item>
+ <!-- 搴楅摵鑱旂郴浜� -->
+ <el-form-item class="optionItem" label="搴楅摵鑱旂郴浜�:" prop="owner">
+ <el-input
+ v-model="store.owner"
+ placeholder="璇峰～鍐欏簵閾鸿仈绯讳汉"
+ :disabled="isView()"
+ ></el-input>
+ </el-form-item>
+ <!-- 搴楅摵鑱旂郴鐢佃瘽 -->
+ <el-form-item class="optionItem" label="搴楅摵鑱旂郴鐢佃瘽:" prop="contact">
+ <el-input
+ v-model="store.contact"
+ placeholder="璇峰～鍐欏簵閾鸿仈绯荤數璇�"
+ :disabled="isView()"
+ ></el-input>
+ </el-form-item>
+ <!-- 搴楅摵璇︾粏鍦板潃 -->
+ <el-form-item
+ class="optionItem"
+ label="搴楅摵璇︾粏鍦板潃:"
+ prop="storeAddress"
+ >
+ <el-input
+ v-model="store.storeAddress"
+ placeholder="璇峰～鍐欏簵閾鸿缁嗗湴鍧�"
+ :disabled="isView()"
+ ></el-input>
+ </el-form-item>
+ <!-- 鍏宠仈鎽勫儚鏈� -->
+ <el-form-item
+ v-if="isStorePage"
+ class="optionItem"
+ label="鍏宠仈鎽勫儚鏈�:"
+ >
+ <el-select
+ v-model="store.relationVideo"
+ placeholder="璇峰～鍐欏叧鑱旀憚鍍忔満"
+ :disabled="isView()"
+ >
+ <el-option
+ v-for="item in relationVideoList"
+ :key="item.id"
+ :value="item.id"
+ :label="item.name"
+ ></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item
+ v-if="!isStorePage"
+ class="optionItem"
+ label="搴楅摵寰楀垎:"
+ >
+ <el-input
+ v-model="store.storeScore"
+ :disabled="isView()"
+ ></el-input>
+ </el-form-item>
+ <el-form-item v-if="!isView()">
+ <div class="optionBtn">
+ <el-button
+ type="primary"
+ class="btn submit"
+ @click.native.prevent="onSubmit"
+ >鎻愪氦</el-button
+ >
</div>
- </main>
- </div>
+ </el-form-item>
+ </el-form>
+ </div>
+ </main>
+ </div>
</template>
<script>
import { deepClone, getCodeList } from "@/utils/helper";
-import { addStoreInfo, getVideoPoint, updateStoreInfo } from "@/api/operate/storeManagement";
+import {
+ addStoreInfo,
+ getVideoPoint,
+ updateStoreInfo,
+} from "@/api/operate/storeManagement";
export default {
- data() {
- const validatePhone = (rule, value, callback) => {
- if (!value) {
- callback(new Error("璇峰～鍐欐墜鏈哄彿鐮�"));
- } else {
- const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/
- if (!rep.test(value)) {
- callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜");
- } else {
- callback();
- }
- }
- };
+ data() {
+ const validatePhone = (rule, value, callback) => {
+ if (!value) {
+ callback(new Error("璇峰～鍐欐墜鏈哄彿鐮�"));
+ } else {
+ const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/;
+ if (!rep.test(value)) {
+ callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜");
+ } else {
+ callback();
+ }
+ }
+ };
- const validateStoreType = (rule, value, callback) => {
- if (value) {
- callback();
+ const validateStoreType = (rule, value, callback) => {
+ if (value) {
+ callback();
+ } else {
+ callback(new Error("璇烽�夋嫨搴楅摵绫诲瀷"));
+ }
+ };
+ return {
+ store: {
+ storeNumber: "",
+ storeName: "",
+ owner: "",
+ contact: "",
+ storeAddress: "",
+ relationVideo: "",
+ type: null,
+ storeScore: null,
+ },
+ rules: {
+ type: [{ required: true, validator: validateStoreType }],
+ storeNumber: [
+ { required: true, trigger: "blur", message: "璇疯緭鍏ュ簵閾虹紪鍙�" },
+ ],
+ storeName: [
+ { required: true, trigger: "blur", message: "璇疯緭鍏ュ簵閾哄悕绉�" },
+ ],
+ owner: [
+ { required: true, trigger: "blur", message: "璇疯緭鍏ュ簵閾鸿仈绯讳汉" },
+ ],
+ contact: [
+ { required: true, trigger: "blur", validator: validatePhone },
+ ],
+ storeAddress: [
+ { required: true, trigger: "blur", message: "璇疯緭鍏ュ簵閾鸿缁嗗湴鍧�" },
+ ],
+ relationVideo: [
+ { required: true, trigger: "blur", message: "璇疯緭鍏ュ叧鑱旀憚鍍忔満" },
+ ],
+ },
+ shopTypeList: [],
+ relationVideoList: [],
+ };
+ },
+ async created() {
+ const result = await getVideoPoint({ current: 1, size: 1000 });
+ this.relationVideoList = result.records;
+
+ if (this.storeInfo) {
+ this.$set(this, "store", this.storeInfo);
+ if (this.storeInfo && this.isStorePage) {
+ this.store.relationVideo = this.store.videoPoint.name;
+ }
+ }
+
+ if (!this.isView()) {
+ await this.getShopTypeList();
+ }
+ },
+
+ methods: {
+ onSubmit() {
+ this.$refs.store.validate((valid) => {
+ if (valid) {
+ debugger
+ this.store.type = this.store.type[1];
+ if (this.isCreated()) {
+ addStoreInfo(this.store)
+ .then(() => {
+ this.$message({ type: "success", message: "鎿嶄綔鎴愬姛" });
+ this.$emit("closeDialog");
+ })
+ .catch((err) => this.$message({ type: "error", message: err }));
} else {
- callback(new Error('璇烽�夋嫨搴楅摵绫诲瀷'));
+ updateStoreInfo(this.store)
+ .then(() => {
+ this.$message({ type: "success", message: "鎿嶄綔鎴愬姛" });
+ this.$emit("closeDialog");
+ })
+ .catch((err) => this.$message({ type: "error", message: err }));
}
- };
- return {
- store: {
- storeNumber: '',
- storeName: '',
- owner: '',
- contact: '',
- storeAddress: '',
- relationVideo: '',
- type: null,
- storeScore: null
- },
- rules: {
- type: [{ required: true, validator: validateStoreType }],
- storeNumber: [{ required: true, trigger:'blur', message: '璇疯緭鍏ュ簵閾虹紪鍙�' }],
- storeName: [{ required: true, trigger:'blur', message: '璇疯緭鍏ュ簵閾哄悕绉�' }],
- owner: [{ required: true, trigger:'blur', message: '璇疯緭鍏ュ簵閾鸿仈绯讳汉' }],
- contact: [{ required: true, trigger:'blur', validator: validatePhone }],
- storeAddress: [{ required: true, trigger:'blur', message: '璇疯緭鍏ュ簵閾鸿缁嗗湴鍧�' }],
- relationVideo: [{ required: true, trigger:'blur', message: '璇疯緭鍏ュ叧鑱旀憚鍍忔満' }]
- },
- shopTypeList: [],
- relationVideoList: []
+ } else {
+ this.$message({ type: "warning", message: "璇锋鏌ュ繀濉」" });
}
+ });
},
- async created() {
- if (this.storeInfo) {
- this.$set(this, 'store', this.storeInfo);
- const result = await getVideoPoint({ current: 1, size: 1 });
- this.relationVideoList = result.records;
- if (this.storeInfo && this.isStorePage) {
- this.store.relationVideo = this.store.videoPoint.name;
- }
- if (!this.isView()) {
- await this.getShopTypeList();
- }
+
+ isView() {
+ return this.dialogType === "view";
+ },
+
+ isCreated() {
+ return this.dialogType === "create";
+ },
+
+ // 鑾峰彇瀛楀吀
+ async getShopTypeList() {
+ let arr = await getCodeList("16");
+ this.shopTypeList = this.createShopTypeTree(arr);
+
+ if (this.dialogType === "update") {
+ const selectedStoreType = arr.find(
+ (item) => item.name === this.store.typeName
+ );
+ this.$set(this.store, "type", [
+ selectedStoreType.parentId,
+ selectedStoreType.id,
+ ]);
}
},
- methods: {
- onSubmit() {
- this.$refs.store.validate(valid => {
- if (valid) {
- this.store.type = this.store.type[1];
- if (this.isCreated()) {
- addStoreInfo(this.store)
- .then(() => {
- this.$message({ type: 'success', message: '鎿嶄綔鎴愬姛' });
- this.$emit('closeDialog');
- })
- .catch(err => this.$message({ type: 'error', message: err }));
- } else {
- updateStoreInfo(this.store)
- .then(() => {
- this.$message({ type: 'success', message: '鎿嶄綔鎴愬姛' });
- this.$emit('closeDialog');
- })
- .catch(err => this.$message({ type: 'error', message: err }));
- }
- } else {
- this.$message({ type: 'warning', message: '璇锋鏌ュ繀濉」' });
- }
+ // 鍒涘缓鍟嗛摵绫诲瀷鏍�
+ createShopTypeTree(arr) {
+ if (arr.length && arr.length !== 0) {
+ // 鑾峰彇椤剁骇鑿滃崟
+ let treeRoot = arr.filter((item) => {
+ return item.parentId === 0;
});
- },
-
- isView() {
- return this.dialogType === 'view';
- },
-
- isCreated() {
- return this.dialogType === 'create';
- },
-
- // 鑾峰彇瀛楀吀
- async getShopTypeList() {
- let arr = await getCodeList('16');
- this.shopTypeList = this.createShopTypeTree(arr);
- if (this.dialogType === 'update') {
- const selectedStoreType = arr.find(item => item.name === this.store.typeName);
- this.$set(this.store, 'type', [selectedStoreType.parentId, selectedStoreType.id]);
- }
- },
-
- // 鍒涘缓鍟嗛摵绫诲瀷鏍�
- createShopTypeTree(arr) {
- if (arr.length && arr.length !== 0) {
- // 鑾峰彇椤剁骇鑿滃崟
- let treeRoot = arr.filter(item => {
- return item.parentId === 0
- })
- // 娣诲姞child
- treeRoot.forEach(item => {
- item.children = []
- arr.forEach(child => {
- child.value = child.id;
- child.label = child.name;
- if (child.parentId === item.id) {
- item.children.push(child)
- }
- })
- })
- return treeRoot;
- }
+ // 娣诲姞child
+ treeRoot.forEach((item) => {
+ item.children = [];
+ arr.forEach((child) => {
+ child.value = child.id;
+ child.label = child.name;
+ if (child.parentId === item.id) {
+ item.children.push(child);
+ }
+ });
+ });
+ return treeRoot;
}
},
+ },
beforeDestroy() {
- this.store = null;
+ this.store = null;
},
- props: ['storeInfo', 'dialogType', 'isStorePage']
-}
+ props: ["storeInfo", "dialogType", "isStorePage"],
+};
</script>
<style lang="scss" scoped>
.updateUser {
- border-radius: 1px;
+ border-radius: 1px;
+ background-color: #09152f;
+
+ main {
+ text-align: left;
+ padding: 0 55px;
background-color: #09152f;
- main {
- text-align: left;
- padding: 0 55px;
- background-color: #09152f;
+ .mainContent {
+ display: flex;
+ justify-content: center;
+ padding-top: 50px;
- .mainContent {
- display: flex;
- justify-content: center;
- padding-top: 50px;
+ .el-form-item__content {
+ width: 400px;
- .el-form-item__content {
- width: 400px;
-
- .el-select {
- width: 100%;
- }
- }
-
- .optionHandleSp {
- display: flex;
-
- .areaNumber,
- .moreNumber {
- flex: 1;
- }
-
- .telNumber {
- flex: 2;
- }
- }
-
- .optionBtn {
- display: flex;
- margin-top: 20px;
-
- .btn {
- padding: 12px 50px;
- }
- }
-
+ .el-select {
+ width: 100%;
}
+ }
+
+ .optionHandleSp {
+ display: flex;
+
+ .areaNumber,
+ .moreNumber {
+ flex: 1;
+ }
+
+ .telNumber {
+ flex: 2;
+ }
+ }
+
+ .optionBtn {
+ display: flex;
+ margin-top: 20px;
+
+ .btn {
+ padding: 12px 50px;
+ }
+ }
}
+ }
}
.updateUser::v-deep .el-form-item__label {
- color: #4b9bb7;
+ color: #4b9bb7;
}
.updateUser::v-deep .el-input__inner {
- background-color: #09152f;
- border: 1px solid #17324c;
+ background-color: #09152f;
+ border: 1px solid #17324c;
}
-
</style>
\ No newline at end of file
--
Gitblit v1.8.0