zhanghua
2025-07-16 7c20fd15b7fbc2bd5756b39d5ab655cc849ffcc3
src/views/operate/sms/smsIndex/createSms/index.vue
@@ -2,47 +2,90 @@
    <div class="createUser">
        <main>
            <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="请选择短信模板">
                                    <el-option v-for="item in colList" :key="item.id" :label="item.columnName"
                                        :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>
                        </div>
                    </el-form-item>
                    <!-- 消息标题 -->
                    <el-form-item class="optionItems" label="短信标题:" prop="head">
                    <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-input v-model="role.targetTo"></el-input>
                            <!-- <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>
                            </el-select> -->
                        </div>
                    </el-form-item>
                    <!-- 消息内容 -->
                    <el-form-item class="optionItem" label="消息内容:" prop="body">
                    <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(1)" class="btn submit">发布</el-button>
                            <el-button class="btn cancel" @click.native.prevent="handleReset">重置</el-button>
                            <el-button
                                type="primary"
                                @click.native.prevent="handleSubmit(1)"
                                class="btn submit"
                                >发布</el-button
                            >
                            <el-button
                                class="btn cancel"
                                @click.native.prevent="handleReset"
                                >重置</el-button
                            >
                        </div>
                    </el-form-item>
                </el-form>
@@ -53,17 +96,18 @@
<script>
import MyEditor from '@/components/edit'
import { sendMessage } from "@/api/operate/messageManagement";
import SMS from "@/api/operate/SMS";
export default {
    components: { MyEditor },
    data() {
        const validateMessageContent = (rule, value, callback) => {
          if (!value) {
            callback(new Error('请输入短信内容'));
          } else {
            callback();
          }
      }
            if (!value) {
                callback(new Error('请输入短信内容'));
            } else {
                callback();
            }
        }
        return {
            role: {
                messageType: '',
@@ -81,10 +125,10 @@
                    { required: true, trigger: "blur", message: '请输入短信标题' },
                ],
                targetTo: [
                    { required: true  , trigger: "blur", message: '请选择接收人' },
                    { required: true, trigger: "blur", message: '请选择接收对象' },
                ],
                body: [
                  { required: true, trigger: ['blur', 'change'], validator: validateMessageContent }
                    { required: true, trigger: ['blur', 'change'], validator: validateMessageContent }
                ]
            },
            colList: [],
@@ -92,18 +136,18 @@
            typeList: [],
            dialogCreate: false,
            dialogView: false,
            defaultProps: {
                children: 'children',
                label: 'departName'
            },
            // defaultProps: {
            //     children: 'children',
            //     label: 'departName'
            // },
            checkedList: [],
            tempNameArr:[],
            tempNameArr: [],
            info: {},
            sendUser:""
            sendUser: ""
        }
    },
    created() {
        this.setColumnList();
        this.getSMSTemplateList();
        this.setDepartList();
        this.getLoginUserInfo();
    },
@@ -115,29 +159,18 @@
                    done();
                })
        },
        // 设置栏目
        async setColumnList() {
            this.colList = await this.getColumnList();
        },
        // 获取栏目
        async getColumnList() {
            let arr;
            await this.$axios({
                method: 'get',
                url: 'sccg/message_column/getAllColumn'
            })
                .then(res => {
                    arr = res.data;
        getSMSTemplateList() {
            SMS.getSMSTemplateList({ current: 1, pageSize: 100 })
                .then(({ records }) => {
                    this.colList = records;
                })
            return arr;
                .catch(err => this.$message.error(err))
        },
        // 关闭弹窗
        closeDialog({ flag, index }) {
        closeDialog({ flag }) {
            this.dialogCreate = flag;
            if (index === 1) {
                // 重新设置栏目
                this.setColumnList();
            }
        },
        // 获取部门树
        async getDepartList() {
@@ -182,8 +215,9 @@
        },
        // 选中id
        handleCheck(data, node) {
            this.checkedList = []
            node.checkedNodes.forEach(item => {
                if(!item.hasOwnProperty('departType')){
                if (!item.hasOwnProperty('departType')) {
                    this.checkedList.push(item.id)
                    this.tempNameArr.push(item.departName)
                }
@@ -192,21 +226,29 @@
        },
        // 新建/保存消息(1:新建,0保存消息)
        handleSubmit(mystatus) {
          this.role.body = this.$refs.edit.editor.txt.html();
          this.$refs.user.validate((valid) => {
            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;
                  sendMessage(params)
                      .then(() => {
                        this.$message({ type: 'success', message: '操作成功' });
                        this.$emit('closeDialog');
                      })
                      .catch(err => this.$message({ type: 'error', message: err }));
                    const params = Object.assign({}, this.role);
                    // params.targetTo = this.checkedList.join(',');
                    params.status = mystatus;
                    sendMessage(params)
                        .then(() => {
                            this.$message({ type: 'success', message: '操作成功' });
                            this.$emit('closeMyDialog');
                        })
                        .catch(err => this.$message({ type: 'error', message: err }));
                } else {
                  this.$message.warning('请检查必填项');
                    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)
            })
        },
        // 重置表单
@@ -223,8 +265,8 @@
                url: 'sccg/admin/info?name=' + name,
            })
                .then(res => {
                    this.role.targetFrom = res.data.userId
                    this.sendUser = res.data.username
                    this.role.targetFrom = res.data.userId;
                    this.sendUser = res.data.username;
                })
        }
    }
@@ -233,29 +275,29 @@
<style lang="scss" scoped>
.createUser {
    border-radius: 1px;
    background-color: #09152f;
    background-color: white;
    main {
        text-align: left;
        background-color: #09152f;
        background-color: white;
        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;
            }
            //&: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;
@@ -271,9 +313,9 @@
                width: 400px;
            }
            :deep(.el-input) {
                width: 400px;
            }
            //:deep(.el-input) {
            //    width: 400px;
            //}
            .message-item {
                display: flex;
@@ -288,14 +330,14 @@
                margin-left: 20px;
            }
            :deep(.el-input--suffix) {
                width: 400px;
            }
            &::v-deep .el-textarea__inner {
                background-color: #09152f;
                border: 1px solid #17324c;
            }
            //:deep(.el-input--suffix) {
            //    width: 400px;
            //}
            //
            //&::v-deep .el-textarea__inner {
            //    background-color: #09152f;
            //    border: 1px solid #17324c;
            //}
            .el-form-item__content {
                width: 400px;
@@ -326,8 +368,7 @@
                    padding: 12px 50px;
                }
            }
        }
    }
}
</style>
</style>