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 | 322 ++++++++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 315 insertions(+), 7 deletions(-)
diff --git a/src/views/operate/fivepack/threepack/components/content.vue b/src/views/operate/fivepack/threepack/components/content.vue
index d07ac4e..d399d6b 100644
--- a/src/views/operate/fivepack/threepack/components/content.vue
+++ b/src/views/operate/fivepack/threepack/components/content.vue
@@ -46,8 +46,11 @@
<main>
<!-- 鏁版嵁灞曠ず -->
<el-table
+ border
+ stripe
ref="multipleTable"
:header-cell-style="{
+ background: '#F5F5F5',
'font-weight': '650',
'line-height': '45px',
}"
@@ -77,6 +80,11 @@
<span>{{ scope.row.videoPoint.name }}</span>
</template>
</el-table-column>
+ <el-table-column prop="status" label="鐘舵��" min-width="10">
+ <template slot-scope="scope">
+ <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">
@@ -93,7 +101,11 @@
@click="handleDelete(scope.row.id)"
>鍒犻櫎</el-link
>
- <el-link class="leftPx" icon="el-icon-edit" :underline="false"
+ <el-link
+ class="leftPx"
+ icon="el-icon-edit"
+ :underline="false"
+ @click="sendMessage(scope.row.contact)"
>鎺ㄩ�佷俊鎭�</el-link
>
<el-link
@@ -148,6 +160,99 @@
>
<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"
+ >
+ <div class="mainContent">
+ <el-form
+ ref="user"
+ label-width="140px"
+ autoComplete="on"
+ :model="role"
+ :rules="rules"
+ label-position="right"
+ >
+ <!-- 娑堟伅鏍忕洰 -->
+ <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-option>
+ </el-select>
+ </div>
+ </div>
+ </el-form-item>
+ <!-- 娑堟伅鏍囬 -->
+ <el-form-item class="optionItems" label="鐭俊鏍囬:" prop="head">
+ <div class="message-item__left">
+ <el-input
+ v-model="role.head"
+ placeholder="璇烽�夋嫨鐭俊鏍囬"
+ ></el-input>
+ </div>
+ </el-form-item>
+ <!-- 鎺ユ敹瀵硅薄 -->
+ <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">
+ <el-tree ref="tree" :data="departList" :props="defaultProps" show-checkbox
+ @check="handleCheck" default-expand-all node-key="id">
+ </el-tree>
+ </el-option>
+ </el-select> -->
+ <!-- </div> -->
+ <div class="message-item__left">
+ <el-input v-model="role.phoneNumber"></el-input>
+ </div>
+ </el-form-item>
+ <!-- 娑堟伅鍐呭 -->
+ <el-form-item class="optionItem" label="娑堟伅鍐呭:" prop="body">
+ <MyEditor ref="edit"></MyEditor>
+ </el-form-item>
+
+ <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
+ >
+ </div>
+ </el-form-item>
+ </el-form>
+ </div>
+ </el-dialog>
<!-- 鍒嗛〉 -->
<div class="pagination">
<el-pagination
@@ -170,17 +275,27 @@
getStoreInfoList,
deleteStoreInfo,
} from "@/api/operate/storeManagement";
+import { sendMessageByMobileNumber } from "@/api/operate/messageManagement";
+import MyEditor from "@/components/edit";
+import SMS from "@/api/operate/SMS";
export default {
- components: { updateUser, scoreView },
-
+ components: { updateUser, scoreView, MyEditor },
created() {
this.search();
+ this.getSMSTemplateList();
},
props: ["model"],
data() {
+ const validateMessageContent = (rule, value, callback) => {
+ if (!value) {
+ callback(new Error("璇疯緭鍏ョ煭淇″唴瀹�"));
+ } else {
+ callback();
+ }
+ };
return {
storeCode: null,
storeStatus: null,
@@ -197,17 +312,121 @@
pageSize: 10,
userInfo: null,
dialogType: "",
+ isShowDialog: false,
storeInfo: null,
storeInfoScoreView: {},
+ role: {
+ messageType: "",
+ head: "",
+ targetTo: "",
+ targetFrom: null,
+ body: "",
+ channelCode: "02",
+ phoneNumber: null,
+ },
+ rules: {
+ messageType: [
+ {
+ required: true,
+ trigger: ["blur", "change"],
+ message: "璇烽�夋嫨鐭俊妯℃澘",
+ },
+ ],
+ head: [{ required: true, trigger: "blur", message: "璇疯緭鍏ョ煭淇℃爣棰�" }],
+ body: [
+ {
+ required: true,
+ trigger: ["blur", "change"],
+ validator: validateMessageContent,
+ },
+ ],
+ },
+ colList: [],
+ departList: [],
+ typeList: [],
+ dialogCreate: false,
+ dialogView: false,
+ defaultProps: {
+ children: "children",
+ label: "departName",
+ },
+ checkedList: [],
+ tempNameArr: [],
+ info: {},
+ sendUser: "",
};
},
methods: {
+ // 鏂板缓/淇濆瓨娑堟伅(1:鏂板缓,0淇濆瓨娑堟伅)
+ handleSubmit(mystatus) {
+ this.role.body = this.$refs.edit.editor.txt.html();
+ this.$refs.user.validate((valid) => {
+ if (valid) {
+ const params = Object.assign({}, this.role);
+ params.targetTo = this.checkedList.join(",");
+ params.status = mystatus;
+ sendMessageByMobileNumber(params)
+ .then(() => {
+ this.$message({ type: "success", message: "鎿嶄綔鎴愬姛" });
+ this.isShowDialog = false;
+ 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 }));
+ } else {
+ this.$message.warning("璇锋鏌ュ繀濉」");
+ }
+ });
+ },
+ setTemplateValue(obj) {
+ 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);
+ });
+ },
+ getSMSTemplateList() {
+ SMS.getSMSTemplateList({ current: 1, pageSize: 100 })
+ .then(({ records }) => {
+ this.colList = records;
+ })
+ .catch((err) => this.$message.error(err));
+ },
+ // 纭鍏抽棴寮圭獥
+ handleConfirmClose(done) {
+ this.$confirm("纭鍏抽棴?").then(() => {
+ done();
+ this.search();
+ this.role.body = "";
+ this.role.head = "";
+ this.$refs.edit.editor.txt.clear();
+ this.search();
+ this.$refs.user.resetFields();
+ });
+ },
+ // 閲嶇疆琛ㄥ崟
+ handleResetq() {
+ this.$refs.edit.editor.txt.clear();
+ this.search();
+ this.$refs.user.resetFields();
+ this.role.body = "";
+ this.role.head = "";
+ },
+ sendMessage(val) {
+ this.isShowDialog = true;
+ this.role.phoneNumber = val;
+ },
search() {
const status = this.storeStatus === 0 ? null : this.storeStatus;
getStoreInfoList({ keyword: this.storeCode, status })
.then(({ list, pageSize, totalPage }) => {
this.tableData = list;
+ console.log(list);
this.pageSize = pageSize;
this.totalNum = totalPage;
})
@@ -273,8 +492,9 @@
.content {
flex: 1;
height: 100%;
+ margin-left: 5px;
padding-left: 20px;
-
+ border: 1px solid #ccc;
.headerContent {
display: flex;
line-height: 100px;
@@ -312,6 +532,94 @@
margin-top: 20px;
padding-bottom: 50px;
+ .mainContent {
+ display: flex;
+ justify-content: center;
+ padding-top: 50px;
+ //&:deep(.el-dialog__title) {
+ // color: #4b9bb7;
+ //}
+ //&::v-deep .el-form-item__label {
+ // color: #4b9bb7;
+ //}
+ //
+ //&::v-deep .el-input__inner {
+ // width: 400px;
+ // background-color: #09152f;
+ // border: 1px solid #17324c;
+ //}
+
+ .message-item__left {
+ width: 400px;
+ }
+
+ .message-add {
+ &:hover {
+ cursor: pointer;
+ }
+ }
+
+ .el-form-item__content :deep(.el-select) {
+ width: 400px;
+ }
+
+ //:deep(.el-input) {
+ // width: 400px;
+ //}
+
+ .message-item {
+ display: flex;
+
+ span {
+ margin-left: 20px;
+ color: #4b9bb7;
+ }
+ }
+
+ .message-tip {
+ margin-left: 20px;
+ }
+
+ //:deep(.el-input--suffix) {
+ // width: 400px;
+ //}
+ //
+ //&::v-deep .el-textarea__inner {
+ // background-color: #09152f;
+ // border: 1px solid #17324c;
+ //}
+
+ .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;
+ }
+ }
+ }
+
.mainTitle {
line-height: 60px;
}
@@ -328,7 +636,7 @@
margin-top: 50px;
display: flex;
line-height: 50px;
- justify-content: center;
+ justify-content: right;
.el-pagination {
&::v-deep li,
@@ -351,7 +659,7 @@
.operation {
display: flex;
-
+ color: var(--operation-color);
.el-button {
border: none;
}
@@ -363,4 +671,4 @@
}
}
}
-</style>
\ No newline at end of file
+</style>
--
Gitblit v1.8.0