From 32107ca1dd2c3930dcedf768e3dff163ff3bca35 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期四, 09 二月 2023 11:56:29 +0800
Subject: [PATCH] 封装选择部门组件
---
src/views/operate/fivepack/threepack/components/content.vue | 293 ++++++++++++++++++++++++++++++++++++++++++----------------
1 files changed, 212 insertions(+), 81 deletions(-)
diff --git a/src/views/operate/fivepack/threepack/components/content.vue b/src/views/operate/fivepack/threepack/components/content.vue
index c7b2580..d399d6b 100644
--- a/src/views/operate/fivepack/threepack/components/content.vue
+++ b/src/views/operate/fivepack/threepack/components/content.vue
@@ -5,31 +5,59 @@
<div class="find">
<div class="search-item">
<span>杈撳叆鏌ヨ:</span>
- <el-input style="flex: 1" :placeholder="
- isStorePage() ? '搴楅摵锛堥棬搴楋級鍚嶇О' : '璇疯緭鍏ュ簵閾虹紪鍙�'
- " v-model="storeCode" />
+ <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-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>
+ <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>
- <el-button v-if="isStorePage()" type="primary" icon="el-icon-plus" class="button-addition"
- @click="handleView(null, 'create')">娣诲姞</el-button>
+ <el-button
+ v-if="isStorePage()"
+ type="primary"
+ icon="el-icon-plus"
+ class="button-addition"
+ @click="handleView(null, 'create')"
+ >娣诲姞</el-button
+ >
</div>
</header>
<main>
<!-- 鏁版嵁灞曠ず -->
- <el-table ref="multipleTable" :header-cell-style="{
- 'font-weight': '650',
- 'line-height': '45px',
- }" :data="tableData" style="width: 100%" :row-class-name="tableRowClassName">
+ <el-table
+ border
+ stripe
+ ref="multipleTable"
+ :header-cell-style="{
+ background: '#F5F5F5',
+ '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>
@@ -39,7 +67,11 @@
</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
+ prop="storeAddress"
+ label="搴楅摵璇︾粏鍦板潃"
+ min-width="10"
+ >
</el-table-column>
<el-table-column prop="storeScore" label="搴楅摵绉垎" min-width="10">
</el-table-column>
@@ -50,50 +82,121 @@
</el-table-column>
<el-table-column prop="status" label="鐘舵��" min-width="10">
<template slot-scope="scope">
- <span>{{ scope.row.status == 1 ? '缁忚惀' : '鍊掗棴' }}</span>
+ <span>{{ scope.row.status == 1 ? "缁忚惀" : "鍊掗棴" }}</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"
- @click="sendMessage(scope.row.contact)">鎺ㄩ�佷俊鎭�</el-link>
- <el-link class="leftPx" icon="el-icon-edit" :underline="false"
- @click="handleScoreView(scope.row, 'view')">鏌ョ湅</el-link>
+ <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"
+ @click="sendMessage(scope.row.contact)"
+ >鎺ㄩ�佷俊鎭�</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>
+ <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
+ :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="60%" :destroy-on-close="true" title="鏌ョ湅绉垎"
- :before-close="handleCloseScoreView">
+ <el-dialog
+ :visible.sync="dialogScore"
+ width="60%"
+ :destroy-on-close="true"
+ title="鏌ョ湅绉垎"
+ :before-close="handleCloseScoreView"
+ >
<scoreView v-if="dialogScore" :storeInfo="storeInfoScoreView" />
</el-dialog>
<!-- 鏂板缓娑堟伅 -->
- <el-dialog title="鏂板缓娑堟伅" :destroy-on-close="true" :key="dialogType" :visible.sync="isShowDialog" width="80%"
- :before-close="handleConfirmClose">
+ <el-dialog
+ title="鏂板缓娑堟伅"
+ :destroy-on-close="true"
+ :key="dialogType"
+ :visible.sync="isShowDialog"
+ width="80%"
+ :before-close="handleConfirmClose"
+ >
<div class="mainContent">
- <el-form ref="user" label-width="140px" autoComplete="on" :model="role" :rules="rules" label-position="right">
+ <el-form
+ ref="user"
+ label-width="140px"
+ autoComplete="on"
+ :model="role"
+ :rules="rules"
+ label-position="right"
+ >
<!-- 娑堟伅鏍忕洰 -->
- <el-form-item class="optionItem" label="鐭俊妯℃澘:" prop="messageType">
+ <el-form-item
+ class="optionItem"
+ label="鐭俊妯℃澘:"
+ prop="messageType"
+ >
<div class="message-item">
<div class="message-item__left">
- <el-select v-model="role.messageType" placeholder="璇烽�夋嫨鐭俊妯℃澘" @change="setTemplateValue">
- <el-option v-for="item in colList" :key="item.id" :label="item.title" :value="item.id">
+ <el-select
+ v-model="role.messageType"
+ placeholder="璇烽�夋嫨鐭俊妯℃澘"
+ @change="setTemplateValue"
+ >
+ <el-option
+ v-for="item in colList"
+ :key="item.id"
+ :label="item.title"
+ :value="item.id"
+ >
</el-option>
</el-select>
</div>
@@ -102,11 +205,18 @@
<!-- 娑堟伅鏍囬 -->
<el-form-item class="optionItems" label="鐭俊鏍囬:" prop="head">
<div class="message-item__left">
- <el-input v-model="role.head" placeholder="璇烽�夋嫨鐭俊鏍囬"></el-input>
+ <el-input
+ v-model="role.head"
+ placeholder="璇烽�夋嫨鐭俊鏍囬"
+ ></el-input>
</div>
</el-form-item>
<!-- 鎺ユ敹瀵硅薄 -->
- <el-form-item class="optionItem" label="鎺ユ敹鎵嬫満鍙�:" prop="targetTo">
+ <el-form-item
+ class="optionItem"
+ label="鎺ユ敹鎵嬫満鍙�:"
+ prop="targetTo"
+ >
<!-- <div class="message-item__left">
<el-select v-model="role.targetTo" placeholder="璇烽�夋嫨鎺ユ敹鎺ユ敹鎵嬫満鍙�" >
<el-option :value="role.targetTo">
@@ -127,8 +237,17 @@
<el-form-item>
<div class="optionBtn">
- <el-button type="primary" @click.native.prevent="handleSubmit(2)" class="btn submit">鍙戝竷</el-button>
- <el-button class="btn cancel" @click.native.prevent="handleResetq">閲嶇疆</el-button>
+ <el-button
+ type="primary"
+ @click.native.prevent="handleSubmit(2)"
+ class="btn submit"
+ >鍙戝竷</el-button
+ >
+ <el-button
+ class="btn cancel"
+ @click.native.prevent="handleResetq"
+ >閲嶇疆</el-button
+ >
</div>
</el-form-item>
</el-form>
@@ -136,8 +255,14 @@
</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
+ background
+ :current-page="currentPage"
+ layout="prev, pager, next"
+ :total="totalNum"
+ :page-size="pageSize"
+ @current-change="changeCurrentPage"
+ >
</el-pagination>
</div>
</main>
@@ -151,7 +276,7 @@
deleteStoreInfo,
} from "@/api/operate/storeManagement";
import { sendMessageByMobileNumber } from "@/api/operate/messageManagement";
-import MyEditor from '@/components/edit';
+import MyEditor from "@/components/edit";
import SMS from "@/api/operate/SMS";
export default {
@@ -166,11 +291,11 @@
data() {
const validateMessageContent = (rule, value, callback) => {
if (!value) {
- callback(new Error('璇疯緭鍏ョ煭淇″唴瀹�'));
+ callback(new Error("璇疯緭鍏ョ煭淇″唴瀹�"));
} else {
callback();
}
- }
+ };
return {
storeCode: null,
storeStatus: null,
@@ -191,24 +316,30 @@
storeInfo: null,
storeInfoScoreView: {},
role: {
- messageType: '',
- head: '',
- targetTo: '',
+ messageType: "",
+ head: "",
+ targetTo: "",
targetFrom: null,
- body: '',
- channelCode: '02',
+ body: "",
+ channelCode: "02",
phoneNumber: null,
},
rules: {
messageType: [
- { required: true, trigger: ['blur', 'change'], message: '璇烽�夋嫨鐭俊妯℃澘' },
+ {
+ required: true,
+ trigger: ["blur", "change"],
+ message: "璇烽�夋嫨鐭俊妯℃澘",
+ },
],
- head: [
- { required: true, trigger: "blur", message: '璇疯緭鍏ョ煭淇℃爣棰�' },
- ],
+ head: [{ required: true, trigger: "blur", message: "璇疯緭鍏ョ煭淇℃爣棰�" }],
body: [
- { required: true, trigger: ['blur', 'change'], validator: validateMessageContent }
- ]
+ {
+ required: true,
+ trigger: ["blur", "change"],
+ validator: validateMessageContent,
+ },
+ ],
},
colList: [],
departList: [],
@@ -216,13 +347,13 @@
dialogCreate: false,
dialogView: false,
defaultProps: {
- children: 'children',
- label: 'departName'
+ children: "children",
+ label: "departName",
},
checkedList: [],
tempNameArr: [],
info: {},
- sendUser: ""
+ sendUser: "",
};
},
@@ -233,46 +364,46 @@
this.$refs.user.validate((valid) => {
if (valid) {
const params = Object.assign({}, this.role);
- params.targetTo = this.checkedList.join(',');
+ params.targetTo = this.checkedList.join(",");
params.status = mystatus;
sendMessageByMobileNumber(params)
.then(() => {
- this.$message({ type: 'success', message: '鎿嶄綔鎴愬姛' });
+ this.$message({ type: "success", message: "鎿嶄綔鎴愬姛" });
this.isShowDialog = false;
- this.role.body = '';
- this.role.head = '';
+ this.role.body = "";
+ this.role.head = "";
this.$refs.edit.editor.txt.clear();
this.search();
this.$refs.user.resetFields();
})
- .catch(err => this.$message({ type: 'error', message: err }));
+ .catch((err) => this.$message({ type: "error", message: err }));
} else {
- this.$message.warning('璇锋鏌ュ繀濉」');
+ this.$message.warning("璇锋鏌ュ繀濉」");
}
- })
+ });
},
setTemplateValue(obj) {
- var _this = this
+ var _this = this;
SMS.getSMSTemplateById(obj).then((result) => {
- _this.role.head = result.title
- _this.role.body = result.body
- _this.$refs.edit.editor.txt.html(result.body)
- })
+ _this.role.head = result.title;
+ _this.role.body = result.body;
+ _this.$refs.edit.editor.txt.html(result.body);
+ });
},
getSMSTemplateList() {
SMS.getSMSTemplateList({ current: 1, pageSize: 100 })
.then(({ records }) => {
this.colList = records;
})
- .catch(err => this.$message.error(err))
+ .catch((err) => this.$message.error(err));
},
// 纭鍏抽棴寮圭獥
handleConfirmClose(done) {
this.$confirm("纭鍏抽棴?").then(() => {
done();
this.search();
- this.role.body = '';
- this.role.head = '';
+ this.role.body = "";
+ this.role.head = "";
this.$refs.edit.editor.txt.clear();
this.search();
this.$refs.user.resetFields();
@@ -283,8 +414,8 @@
this.$refs.edit.editor.txt.clear();
this.search();
this.$refs.user.resetFields();
- this.role.body = '';
- this.role.head = '';
+ this.role.body = "";
+ this.role.head = "";
},
sendMessage(val) {
this.isShowDialog = true;
@@ -361,8 +492,9 @@
.content {
flex: 1;
height: 100%;
+ margin-left: 5px;
padding-left: 20px;
-
+ border: 1px solid #ccc;
.headerContent {
display: flex;
line-height: 100px;
@@ -504,10 +636,9 @@
margin-top: 50px;
display: flex;
line-height: 50px;
- justify-content: center;
+ justify-content: right;
.el-pagination {
-
&::v-deep li,
&::v-deep .btn-prev,
&::v-deep .btn-next {
@@ -528,7 +659,7 @@
.operation {
display: flex;
-
+ color: var(--operation-color);
.el-button {
border: none;
}
@@ -540,4 +671,4 @@
}
}
}
-</style>
\ No newline at end of file
+</style>
--
Gitblit v1.8.0