From 2c65bfca6ada431944f63bd829a7888d046adec9 Mon Sep 17 00:00:00 2001
From: YeMingfei666 <1619116647@qq.com>
Date: Thu, 9 Jan 2025 15:54:22 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=BC=B9=E7=AA=97=E5=B9=BF?=
 =?UTF-8?q?=E5=91=8A=E7=B1=BB=E5=9E=8B=EF=BC=8C=E4=BF=AE=E6=94=B9=E5=86=85?=
 =?UTF-8?q?=E5=AE=B9=E4=B8=BA=E5=AF=8C=E6=96=87=E6=9C=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../message/components/pop-add-message.vue    | 86 +++++++++++++++----
 src/views/message/data.js                     |  4 +
 src/views/message/message.vue                 | 12 ++-
 3 files changed, 80 insertions(+), 22 deletions(-)
 create mode 100644 src/views/message/data.js

diff --git a/src/views/message/components/pop-add-message.vue b/src/views/message/components/pop-add-message.vue
index 38c7b7c..7afeb38 100644
--- a/src/views/message/components/pop-add-message.vue
+++ b/src/views/message/components/pop-add-message.vue
@@ -1,17 +1,49 @@
 <template>
-  <el-dialog :title="title" width="500px" :visible.sync="dialogVisible" @close="diaClose"
-    :close-on-click-modal="true">
-    <div >
+  <el-dialog
+    :title="title"
+    width="800px"
+	top="20px"
+    :visible.sync="dialogVisible"
+    @close="diaClose"
+    :close-on-click-modal="true"
+  >
+    <div>
       <el-form ref="form" :rules="rules" :model="form" label-width="100px">
-        <el-form-item label="标题"  prop="title">
+        <el-form-item label="标题" prop="title">
           <el-input v-model="form.title"></el-input>
         </el-form-item>
-        <el-form-item label="内容"  prop="content">
-          <el-input v-model="form.content" type="textarea"></el-input>
+        <el-form-item label="类型" prop="title">
+          <el-radio-group v-model="form.type">
+            <el-radio
+              :label="item.value"
+              v-for="(item, index) in types"
+              :key="index"
+              >{{ item.label }}</el-radio
+            >
+          </el-radio-group>
         </el-form-item>
-        <el-form-item label="状态" required>
-          <el-switch v-model="form.state" :active-value="1" :inactive-value="0"></el-switch>
+		<el-form-item label="状态" required>
+          <el-switch
+            v-model="form.state"
+            :active-value="1"
+            :inactive-value="0"
+          ></el-switch>
         </el-form-item>
+        <el-form-item label="内容" prop="content">
+          <quill-editor
+            ref="myTextEditor"
+            v-model="form.content"
+            :options="quillOption"
+            style="
+              padding-bottom: 50px;
+              height: 300px;
+              width: 100%;
+              display: inline-table;
+            "
+          >
+          </quill-editor>
+        </el-form-item>
+
       </el-form>
     </div>
 
@@ -23,21 +55,35 @@
 </template>
 
 <script>
-import {$announcement as  $api} from "@/api/announcement.js";
-
+import { $announcement as $api } from "@/api/announcement.js";
+import { $types } from "../data.js";
+import { quillEditor } from "vue-quill-editor";
+import "quill/dist/quill.core.css";
+import "quill/dist/quill.snow.css";
+import "quill/dist/quill.bubble.css";
+import quillConfig from "../../locality/quill-config.js";
 export default {
+  components: {
+    quillEditor,
+  },
+
   data() {
     return {
+      quillOption: quillConfig,
+      types: $types,
       dialogVisible: false,
       title: "",
       rules: {
         title: [{ required: true, message: "请输入公告标题", trigger: "blur" }],
-        content: [{ required: true, message: "请输入公告内容", trigger: "blur" }],
+        content: [
+          { required: true, message: "请输入公告内容", trigger: "blur" },
+        ],
       },
       form: {
-        title:'',
-        content:'',
-        state:1,
+        title: "",
+        content: "",
+        state: 1,
+        type: "",
       },
     };
   },
@@ -51,9 +97,10 @@ export default {
     diaClose() {
       this.dialogVisible = false;
       this.form = {
-        title:'',
-        content:'',
-        state:1,
+        title: "",
+        content: "",
+        state: 1,
+        type: "",
       };
       this.$refs.form.resetFields();
     },
@@ -64,6 +111,9 @@ export default {
       if (!this.form.content) {
         return this.$message.error("请输入公告内容");
       }
+      if (this.form.type === "") {
+        return this.$message.error("请选择公告类型");
+      }
       this.submit();
     },
     async submit() {
@@ -120,4 +170,4 @@ export default {
     object-fit: cover;
   }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/message/data.js b/src/views/message/data.js
new file mode 100644
index 0000000..c9547ba
--- /dev/null
+++ b/src/views/message/data.js
@@ -0,0 +1,4 @@
+export const $types=[
+	{label:'首页',value:0},
+	{label:'提现',value:1}
+]
diff --git a/src/views/message/message.vue b/src/views/message/message.vue
index bed6cd3..50f4db2 100644
--- a/src/views/message/message.vue
+++ b/src/views/message/message.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <el-tabs v-model="activeName" @tab-click="handleClick">
-      <el-tab-pane label="首页弹窗公告" name="dialogMessage">
+      <el-tab-pane label="弹窗公告" name="dialogMessage">
         <div style="float: right; margin-right: 2%">
           <el-button
             style="margin: 10px 0"
@@ -16,7 +16,11 @@
         <el-table v-loading="tableDataLoading" :data="tableData.list">
           <el-table-column prop="id" label="编号" width="80"> </el-table-column>
           <el-table-column prop="title" label="标题"> </el-table-column>
-          <el-table-column prop="content" label="内容"> </el-table-column>
+          <el-table-column prop="content" label="内容">
+            <template slot-scope="scope">
+				<div v-html="scope.row.content"></div>
+			</template>
+		  </el-table-column>
           <el-table-column prop="content" label="是否启用">
             <template slot-scope="scope">
 				<el-switch :value="scope.row.state" :active-value="1" :inactive-value="0" @change="dialogMessageUpdate($event, scope.row)"> </el-switch>
@@ -436,7 +440,7 @@ import  popAddMessage from './components/pop-add-message.vue';
 							type: 'success',
 							duration: 1500
 						})
-						this.getDialogMessage()	
+						this.getDialogMessage()
 					})
 				}).catch(() => {})
 			},
@@ -803,4 +807,4 @@ import  popAddMessage from './components/pop-add-message.vue';
 </script>
 
 <style>
-</style>
\ No newline at end of file
+</style>