From 3286dd82b83adf92cc576300e9e73a4dfb2aa880 Mon Sep 17 00:00:00 2001
From: luobisheng <727299681@qq.com>
Date: 星期四, 10 十一月 2022 11:12:03 +0800
Subject: [PATCH] 店铺管理

---
 src/views/operate/message/myIndex/update/index.vue |  826 ++++++++++++++++++++++++++--------------------------------
 1 files changed, 369 insertions(+), 457 deletions(-)

diff --git a/src/views/operate/message/myIndex/update/index.vue b/src/views/operate/message/myIndex/update/index.vue
index 2899450..dd2555d 100644
--- a/src/views/operate/message/myIndex/update/index.vue
+++ b/src/views/operate/message/myIndex/update/index.vue
@@ -1,481 +1,393 @@
 <template>
-    <div class="createUser">
-        <main>
-            <div class="mainContent">
-                <el-form ref="user" label-width="140px" autoComplete="on" :model="role" :rules="createRoleRules"
-                    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="璇烽�夋嫨娑堟伅鏍忕洰">
-                                    <el-option v-for="item in colList" :key="item.id" :label="item.columnName"
-                                        :value="item.id">
-                                    </el-option>
-                                </el-select>
-                            </div>
-                            <span class="message-add" @click='dialogCreate = true'> 娣诲姞鏍忕洰</span>
-                        </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>
-                    </el-form-item>
-                    <!-- 娑堟伅鍐呭 -->
-                    <el-form-item class="optionItem" label="娑堟伅鍐呭:" prop="body">
-                        <MyEditor ref="edit" @getMyBody="getMyBody" :mybody='role.body'></MyEditor>
-                        <!-- <el-input type="textarea" v-model="role.description" placeholder="璇疯緭鍏ユ弿杩板唴瀹�200瀛椾互鍐�"></el-input> -->
-                    </el-form-item>
-                    <!-- 鎻愰啋鏂瑰紡 -->
-                    <el-form-item class="optionItem" label="鎻愰啋鏂瑰紡:" prop="channelCode">
-                        <el-radio-group v-model="role.channelCode">
-                            <el-radio label="01">绔欏唴淇�</el-radio>
-                            <el-radio label="02">閭欢</el-radio>
-                            <el-radio label="03">鐭俊</el-radio>
-                        </el-radio-group>
-                        <span class="message-tip">(鐭俊鍙敤鏁�: 1000鏉�)</span>
-                    </el-form-item>
-                    <el-form-item>
-                        <div class="optionBtn">
-                            <el-button type="primary" @click.native.prevent="handleSubmit(0)" class="btn save">淇濆瓨
-                            </el-button>
-                            <el-button type="primary" @click.native.prevent="handleSubmit(1)" class="btn submit">鍙戝竷
-                            </el-button>
-                            <el-button type="primary" @click.native.prevent="handleView" class="btn submit">棰勮
-                            </el-button>
-                            <el-button class="btn cancel" @click.native.prevent="handleReset">閲嶇疆</el-button>
-                        </div>
-                    </el-form-item>
-                </el-form>
-                <!-- 鏂板鏍忕洰 -->
-                <el-dialog title="娣诲姞鏍忕洰" :visible.sync="dialogCreate" v-if="dialogCreate" width="60%"
-                    :before-close="handleConfirmClose" append-to-body>
-                    <MyColumnAdd @closeDialog="closeDialog"></MyColumnAdd>
-                </el-dialog>
-                <!-- 棰勮娑堟伅 -->
-                <el-dialog title="娑堟伅棰勮" :visible.sync="dialogView" v-if="dialogView" width="60%"
-                    :before-close="handleConfirmClose" append-to-body>
-                    <MyColView  :info="info" @closeDialog="closeDialog"></MyColView>
-                </el-dialog>
+  <div class="createUser">
+    <main>
+      <div class="mainContent">
+        <el-form ref="user" label-width="140px" autoComplete="on" :model="role" :rules="createRoleRules"
+                 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="璇烽�夋嫨娑堟伅鏍忕洰">
+                  <el-option v-for="item in colList" :key="item.id" :label="item.columnName"
+                             :value="item.id">
+                  </el-option>
+                </el-select>
+              </div>
+              <span class="message-add" @click='dialogCreate = true'> 娣诲姞鏍忕洰</span>
             </div>
-        </main>
-    </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>
+          </el-form-item>
+          <!-- 娑堟伅鍐呭 -->
+          <el-form-item class="optionItem" label="娑堟伅鍐呭:" prop="body">
+            <MyEditor ref="edit" @getMyBody="getMyBody"></MyEditor>
+          </el-form-item>
+          <!-- 鎻愰啋鏂瑰紡 -->
+          <el-form-item class="optionItem" label="鎻愰啋鏂瑰紡:" prop="channelCode">
+            <el-radio-group v-model="role.channelCode">
+              <el-radio label="01">绔欏唴淇�</el-radio>
+              <el-radio label="02">閭欢</el-radio>
+              <el-radio label="03">鐭俊</el-radio>
+            </el-radio-group>
+            <span class="message-tip">(鐭俊鍙敤鏁�: 1000鏉�)</span>
+          </el-form-item>
+          <el-form-item>
+            <div class="optionBtn">
+              <el-button type="primary" @click.native.prevent="handleSubmit(0)" class="btn save">淇濆瓨
+              </el-button>
+              <el-button type="primary" @click.native.prevent="handleSubmit(1)" class="btn submit">鍙戝竷
+              </el-button>
+              <el-button type="primary" @click.native.prevent="handleView" class="btn submit">棰勮
+              </el-button>
+              <el-button class="btn cancel" @click.native.prevent="handleReset">閲嶇疆</el-button>
+            </div>
+          </el-form-item>
+        </el-form>
+        <!-- 鏂板鏍忕洰 -->
+        <el-dialog title="娣诲姞鏍忕洰" :visible.sync="dialogCreate" v-if="dialogCreate" width="60%"
+                   :before-close="handleConfirmClose" append-to-body>
+          <MyColumnAdd @closeDialog="closeDialog"></MyColumnAdd>
+        </el-dialog>
+        <!-- 棰勮娑堟伅 -->
+        <el-dialog title="娑堟伅棰勮" :visible.sync="dialogView" v-if="dialogView" width="60%"
+                   :before-close="handleConfirmClose" append-to-body>
+          <MyColView  :info="info" @closeDialog="closeDialog"></MyColView>
+        </el-dialog>
+      </div>
+    </main>
+  </div>
 </template>
 <script>
 import MyEditor from '@/components/edit'
 import MyColumnAdd from '@/views/operate/message/mycontrol/createUser'
 import MyColView from '../messageView'
+import { sendMessage, updateMessage } from "@/api/operate/messageManagement";
+
 export default {
-    components: { MyEditor, MyColumnAdd,MyColView },
-    data() {
-        const validateNickname = (rule, value, callback) => {
-            if (!value) {
-                callback(new Error("璇峰~鍐欐秷鎭爮鐩�"));
-            } else {
-                callback();
-            }
-        };
-        const validatePass = (rule, value, callback) => {
-            if (!value) {
-                callback();
-            } else {
-                callback();
-            }
-        };
-        const validateTruename = (rule, value, callback) => {
-            if (value.length !== 0) {
-                callback();
-            } else {
-                callback(new Error('璇烽�夋嫨鎺ユ敹瀵硅薄'));
-            }
-        };
-        return {
-            role: {
-                messageType: '',
-                head: '',
-                targetTo: '',
-                targetFrom: null,
-                body: '',
-                channelCode: '01',
-            },
-            createRoleRules: {
-                messageType: [
-                    { required: true, trigger: "blur", validator: validateNickname },
-                ],
-                head: [
-                    { required: false, trigger: "blur", validator: validatePass },
-                ],
-                targetTo: [
-                    { required: false, trigger: "blur", validator: validateTruename },
-                ],
-            },
-            colList: [],
-            departList: [],
-            typeList: [],
-            dialogCreate: false,
-            dialogView: false,
-            defaultProps: {
-                children: 'children',
-                label: 'departName',
-                // disabled: function (data, node) {
-                //     if (data.createTime) {
-                //         return !data.leaf
-                //     }
-                // }
-            },
-            checkedList: [],
-            tempNameArr:[],
-            info:{},
-            sendUser:""
+  components: { MyEditor, MyColumnAdd,MyColView },
+  props: ['type', 'myDataRow'],
+  data() {
+    return {
+      role: {
+        messageType: '',
+        head: '',
+        targetTo: '',
+        targetFrom: null,
+        body: '',
+        channelCode: '01',
+      },
+      createRoleRules: {
+        messageType: [
+          { required: true, trigger: ['blur', 'change'], message: '璇疯緭鍏ユ秷鎭爮鐩�' },
+        ],
+        head: [
+          { required: false, trigger: "blur" },
+        ],
+        targetTo: [
+          { required: false, trigger: "blur" },
+        ],
+      },
+      colList: [],
+      departList: [],
+      typeList: [],
+      dialogCreate: false,
+      dialogView: false,
+      defaultProps: {
+        children: 'children',
+        label: 'departName'
+      },
+      checkedList: [],
+      tempNameArr: [],
+      info: {},
+      sendUser: ''
+    }
+  },
+  created() {
+    this.getColumnList();
+    this.getDepartList();
+    this.getLoginUserInfo();
+    if (this.type === 'update' && this.myDataRow) {
+      this.role = this.myDataRow;
+    }
+  },
+  methods: {
+    // 鍏抽棴寮圭獥
+    handleConfirmClose(done) {
+      this.$confirm('纭鍏抽棴?')
+          .then(_ => {
+            done();
+          })
+    },
+
+    // 鑾峰彇鏍忕洰
+    async getColumnList() {
+      await this.$axios({
+        method: 'get',
+        url: 'sccg/message_column/getAllColumn'
+      })
+          .then(res => {
+            this.colList = res.data;
+          })
+    },
+    // 鍏抽棴寮圭獥
+    closeDialog({ flag, index }) {
+      this.dialogCreate = flag;
+      if (index === 1) {
+        // 閲嶆柊璁剧疆鏍忕洰
+        this.getColumnList();
+      }
+    },
+
+    // 鑾峰彇閮ㄩ棬鏍�
+    async getDepartList() {
+      await this.$axios({
+        method: 'get',
+        url: 'sccg/depart/tree'
+      })
+          .then(res => {
+            res.data.forEach(item => {
+              this.departList.push(this.setChildren(item));
+            });
+          })
+    },
+
+    // 閫掑綊children
+    setChildren(obj) {
+      if (obj.children !== null) {
+        if (obj.children.length !== 0) {
+          obj.children.forEach(item => {
+            return this.setChildren(item);
+          })
         }
-    },
-    created() {
-        this.setColumnList();
-        this.setDepartList();
-        this.getLoginUserInfo();
-        this.role = this.myDataRow;
-        console.log(this.role);
-    },
-    methods: {
-        // 鍏抽棴寮圭獥
-        handleConfirmClose(done) {
-            this.$confirm('纭鍏抽棴?')
-                .then(_ => {
-                    done();
-                })
-        },
-        // 璁剧疆鏍忕洰
-        async setColumnList() {
-            this.colList = await this.getColumnList();
-        },
-        // 鑾峰彇鏍忕洰
-        async getColumnList() {
-            let arr;
-            await this.$axios({
-                method: 'get',
-                url: 'sccg/message_column/getAllColumn'
-            })
-                .then(res => {
-                    console.log(res);
-                    arr = res.data;
-                })
-            return arr;
-        },
-        // 鍏抽棴寮圭獥
-        closeDialog({ flag, index }) {
-            this.dialogCreate = flag;
-            if (index === 1) {
-                // 閲嶆柊璁剧疆鏍忕洰
-                this.setColumnList();
-            }
-        },
-        // 鑾峰彇閮ㄩ棬鏍�
-        async getDepartList() {
-            let arr
-            await this.$axios({
-                method: 'get',
-                url: 'sccg/depart/tree'
-            })
-                .then(res => {
-                    arr = res.data
-                })
-            return arr;
-        },
-        // 璁剧疆閮ㄩ棬鏍�
-        async setDepartList() {
-            this.departList = await this.filterDepartList();
-        },
-        // 澶勭悊閮ㄩ棬鏍�
-        async filterDepartList() {
-            let arr = await this.getDepartList();
-            const { setChildren } = this;
-            // console.log(setChildren);
-            arr.forEach(item => {
-                setChildren(item);
-            })
-            return arr;
-        },
-        // 閫掑綊children
-        setChildren(obj) {
-            if (obj.children !== null) {
-                if (obj.children.length !== 0) {
-                    obj.children.forEach(item => {
-                        return this.setChildren(item);
-                    })
-                }
-            } else {
-                if (obj.userInfoDTOS.length !== 0) {
-                    obj.children = [];
-                    obj.userInfoDTOS.forEach(item => {
-                        obj.children.push({ id: item.userId, departName: item.username })
-                    })
-                }
-            }
-        },
-        // 閫変腑id
-        handleCheck(data, node) {
-            let arr = [],nameArr = []
-            console.log(node.checkedNodes)
-            node.checkedNodes.forEach(item => {
-                if(!item.hasOwnProperty('departType')){
-                    arr.push(item.id)
-                    nameArr.push(item.departName)
-                }
-            })
-            this.checkedList = arr
-            this.tempNameArr = nameArr
-            console.log(this.tempNameArr)
-            this.role.targetTo = arr.length + '浜�'
-        },
-        // 鏂板缓/淇濆瓨娑堟伅(1:鏂板缓,0淇濆瓨娑堟伅)
-        handleSubmit(mystatus) {
-            console.log(mystatus);      
-            if(mystatus===0){
-               this.updateMessage(mystatus); 
-            }else{
-                this.newsMessage(mystatus);
-            }
-        },
-        //淇敼娑堟伅
-        updateMessage(mystatus){
-            this.$refs.user.validate((valid) => {
-                if (valid) {
-                    const { role, checkedList } = this;
-                    console.log(checkedList);
-                    this.$axios({
-                        method: 'post',
-                        url: `sccg/message/update/${this.role.id}`,
-                        data: {
-                            body: role.body,
-                            channelCode: `${role.channelCode}`,
-                            head: role.head,
-                            messageType: role.messageType,
-                            sendTime: new Date(),
-                            targetTo: checkedList.join(','),
-                            targetFrom: `${role.targetFrom}`,
-                            status: mystatus,
-                        }
-                    })
-                        .then(res => {
-                            if (res.code === 200) {
-                                this.$message({
-                                    type: 'success',
-                                    message: mystatus === 1 ? '鍙戝竷鎴愬姛' : '淇濆瓨鎴愬姛',
-                                })
-                                this.$emit('closeMyDialog', { flag: false, index: 1 });
-                            }
-                        })
-                } else {
-                    return false;
-                }
-            })
-        },
-        //鍙戝竷娑堟伅
-        newsMessage(mystatus){
-             this.$refs.user.validate((valid) => {
-                if (valid) {
-                    const { role, checkedList } = this;
-                    console.log(checkedList);
-                    this.$axios({
-                        method: 'post',
-                        url: 'sccg/message/sendMessage',
-                        data: {
-                            id:role.id,
-                            body: role.body,
-                            channelCode: `${role.channelCode}`,
-                            head: role.head,
-                            messageType: role.messageType,
-                            sendTime: new Date(),
-                            targetTo: checkedList.join(','),
-                            targetFrom: `${role.targetFrom}`,
-                            status: mystatus,
-                        }
-                    })
-                        .then(res => {
-                            if (res.code === 200) {
-                                this.$message({
-                                    type: 'success',
-                                    message: mystatus === 1 ? '鍙戝竷鎴愬姛' : '淇濆瓨鎴愬姛',
-                                })
-                                this.$emit('closeMyDialog', { flag: false, index: 1 });
-                            }
-                        })
-                } else {
-                    return false;
-                }
-            })
-        },
-        // 鑾峰緱娑堟伅浣�
-        getMyBody(obj) {
-            console.log(obj);
-            this.role.body = obj;
-        },
-        // 閲嶇疆琛ㄥ崟
-        handleReset() {
-            this.$refs.edit.editor.txt.clear();
-            // this.$refs.edit.wangEditor.txt.html('<p><br></p>') 
-            this.setDepartList();
-            this.$refs.user.resetFields();
-        },
-        // 鑾峰彇褰撳墠鐧诲綍鐢ㄦ埛淇℃伅
-        getLoginUserInfo() {
-            const name = sessionStorage.getItem('name');
-            this.$axios({
-                method: 'get',
-                url: 'sccg/admin/info?name=' + name,
-            })
-                .then(res => {
-                    this.role.targetFrom = res.data.userId
-                    this.sendUser = res.data.username
-                })
-        },
-        // 娑堟伅棰勮
-        handleView() {
-            this.$refs.user.validate((valid) => {
-                if (valid) {
-                    const { role,getColText,tempNameArr,sendUser } = this
-                    this.dialogView = true;
-                    let info = {}
-                    // 鑾峰緱鏍忕洰娑堟伅
-                    info.channelCode = role.channelCode === '01'? '绔欏唴淇�': role.channelCode === '02' ? '閭欢':'鐭俊'
-                    info.messageType = getColText(role.messageType)
-                    info.body = role.body
-                    info.head = role.head
-                    info.targetTo = tempNameArr
-                    info.targetFrom = sendUser
-                    this.info = info
-                } else {
-                    return false
-                }
-            })
-        },
-        // 鑾峰緱鏍忕洰娑堟伅
-        getColText(id){
-            console.log(id)
-            const {colList} = this
-            let str = ''
-            colList.forEach(item=>{
-                item.id === id ? str = item.columnName : '' 
-            })
-            return str
+      } else {
+        if (obj.userInfoDTOS.length !== 0) {
+          obj.children = [];
+          obj.userInfoDTOS.forEach(item => {
+            obj.children.push({ id: item.userId, departName: item.username })
+          })
         }
+      }
+      return obj;
     },
-    props: ['closeMyDialog','myDataRow']
+
+    // 閫変腑id
+    handleCheck(data, node) {
+      node.checkedNodes.forEach(item => {
+        if(!item.hasOwnProperty('departType')){
+          this.checkedList.push(item.id)
+          this.tempNameArr.push(item.departName)
+        }
+      })
+      this.role.targetTo = this.checkedList.length + '浜�'
+    },
+
+    // 鏂板缓/淇濆瓨娑堟伅(1:鏂板缓,0淇濆瓨娑堟伅)
+    handleSubmit(mystatus) {
+      this.$refs.user.validate((valid) => {
+        if (valid) {
+          const { body, head, messageType, targetFrom, channelCode } = this.role;
+          const params = {
+            body,
+            head,
+            messageType,
+            channelCode: `${channelCode}`,
+            sendTime: new Date(),
+            targetTo: this.checkedList.join(','),
+            targetFrom: `${targetFrom}`,
+            status: mystatus,
+          }
+          if (this.type === 'create') {
+            sendMessage(params)
+                .then(() => {
+                  this.$emit('closeMyDialog');
+                  this.$message({ type: 'success', message: '鎿嶄綔鎴愬姛' });
+                })
+                .catch(err => this.$message({ type: 'error', message: err }));
+          } else {
+            updateMessage(params)
+                .then(() => {
+                  this.$emit('closeMyDialog');
+                  this.$message({ type: 'success', message: '鎿嶄綔鎴愬姛' });
+                })
+                .catch(err => this.$message({ type: 'error', message: err }));
+          }
+        } else {
+          this.$message.error({ type: 'warning', message: '璇锋鏌ュ繀濉」' });
+        }
+      })
+    },
+
+    // 鑾峰緱娑堟伅浣�
+    getMyBody(obj) {
+      this.role.body = obj;
+    },
+
+    // 閲嶇疆琛ㄥ崟
+    handleReset() {
+      this.$refs.edit.editor.txt.clear();
+      this.setDepartList();
+      this.$refs.user.resetFields();
+    },
+
+    // 鑾峰彇褰撳墠鐧诲綍鐢ㄦ埛淇℃伅
+    getLoginUserInfo() {
+      const name = sessionStorage.getItem('name');
+      this.$axios({
+        method: 'get',
+        url: 'sccg/admin/info?name=' + name,
+      })
+          .then(res => {
+            this.role.targetFrom = res.data.userId
+            this.sendUser = res.data.username
+          })
+    },
+
+    // 娑堟伅棰勮
+    handleView() {
+      this.$refs.user.validate((valid) => {
+        if (valid) {
+          const { body, head, channelCode } = this.role;
+          this.dialogView = true;
+          this.info = {
+            body,
+            head,
+            channelCode: channelCode === '01'? '绔欏唴淇�': channelCode === '02' ? '閭欢':'鐭俊',
+            messageType: this.getColText(this.role.messageType),
+            targetTo: this.tempNameArr,
+            targetFrom: this.sendUser
+          }
+        } else {
+          this.$message({ type: 'warning', message: '璇锋鏌ュ繀濉」' });
+        }
+      })
+    },
+
+    // 鑾峰緱鏍忕洰娑堟伅
+    getColText(id){
+      let str = ''
+      this.colList.forEach(item=>{
+        item.id === id ? str = item.columnName : ''
+      })
+      return str;
+    }
+  },
 }
 </script>
 <style lang="scss" scoped>
 .createUser {
-    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;
+    .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;
-        padding-bottom: 50px;
+        border: 1px solid #17324c;
+      }
 
-        .mainContent {
-            display: flex;
-            justify-content: center;
-            padding-top: 50px;
-            &:deep(.el-dialog__title) {
-                color: #4b9bb7;
-            }
-            &::v-deep .el-form-item__label {
-                color: #4b9bb7;
-            }
+      .message-item__left {
+        width: 400px;
+      }
 
-            &::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;
-                }
-            }
-
+      .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;
+        }
+      }
+
     }
+  }
 }
 </style>
\ No newline at end of file

--
Gitblit v1.8.0