diff --git a/.DS_Store b/.DS_Store
index b3086b4..b1fd0b0 100644
Binary files a/.DS_Store and b/.DS_Store differ
diff --git a/.env b/.env
index ea1b018..fe161d5 100644
--- a/.env
+++ b/.env
@@ -1,7 +1,7 @@
 NODE_ENV=production
 VUE_APP_PREVIEW=false
 #  <!-- //水感应正式环境-->
-VUE_APP_API_BASE_URL=https://api.shui.shuiganying.com/api
+# VUE_APP_API_BASE_URL=https://api.shui.shuiganying.com/api
 
 #  <!-- // 水感应测试-->
-# VUE_APP_API_BASE_URL=https://shuitest.shuiganying.com/api
+VUE_APP_API_BASE_URL=https://shuitest.shuiganying.com/api
diff --git a/.env.development b/.env.development
index 20fb007..5b6193b 100644
--- a/.env.development
+++ b/.env.development
@@ -9,7 +9,7 @@
 NODE_ENV=development
 VUE_APP_PREVIEW=true
 #  <!-- //水感应正式环境-->
-VUE_APP_API_BASE_URL=https://api.shui.shuiganying.com/api
+# VUE_APP_API_BASE_URL=https://api.shui.shuiganying.com/api
 
 #  <!-- // 水感应测试-->
-# VUE_APP_API_BASE_URL=https://shuitest.shuiganying.com/api
\ No newline at end of file
+VUE_APP_API_BASE_URL=https://shuitest.shuiganying.com/api
\ No newline at end of file
diff --git a/.env.preview b/.env.preview
index 6ce5ce8..0ea88de 100644
--- a/.env.preview
+++ b/.env.preview
@@ -9,7 +9,7 @@
 NODE_ENV=production
 VUE_APP_PREVIEW=true
 #  <!-- //水感应正式环境-->
-VUE_APP_API_BASE_URL=https://api.shui.shuiganying.com/api
+# VUE_APP_API_BASE_URL=https://api.shui.shuiganying.com/api
 
 #  <!-- // 水感应测试-->
-# VUE_APP_API_BASE_URL=https://shuitest.shuiganying.com/api
\ No newline at end of file
+VUE_APP_API_BASE_URL=https://shuitest.shuiganying.com/api
\ No newline at end of file
diff --git a/package.json b/package.json
index d45157f..b726abc 100644
--- a/package.json
+++ b/package.json
@@ -26,13 +26,17 @@
     "md5": "^2.3.0",
     "moment": "^2.24.0",
     "nprogress": "^0.2.0",
+    "quill": "1.3.7",
+    "quill-image-drop-module": "1.0.3",
+    "quill-image-extend-module": "1.1.2",
+    "quill-image-resize-module": "3.0.0",
     "store": "^2.0.12",
     "viser-vue": "^2.4.6",
     "vue": "^2.6.12",
     "vue-clipboard2": "^0.2.1",
     "vue-cropper": "0.4.9",
     "vue-i18n": "^8.22.3",
-    "vue-quill-editor": "^3.0.6",
+    "vue-quill-editor": "3.0.6",
     "vue-router": "^3.4.9",
     "vue-sku-form": "^0.4.1",
     "vue-svg-component-runtime": "^1.0.1",
diff --git a/src/components/GlobalHeader/AvatarDropdown.vue b/src/components/GlobalHeader/AvatarDropdown.vue
index e389c6e..15cd581 100644
--- a/src/components/GlobalHeader/AvatarDropdown.vue
+++ b/src/components/GlobalHeader/AvatarDropdown.vue
@@ -14,10 +14,10 @@
             <a-icon type="lock" />
             修改密码
           </a-menu-item>
-          <a-menu-item v-if="currentUser.isManage" key="changePermission" @click="goPermission">
+          <!-- <a-menu-item v-if="currentUser.isManage" key="changePermission" @click="goPermission">
             <a-icon type="setting" />
             管理员管理
-          </a-menu-item>
+          </a-menu-item> -->
           <a-menu-item key="logout" @click="handleLogout">
             <a-icon type="logout" />
             退出登录
diff --git a/src/config/router.config.js b/src/config/router.config.js
index af8f28b..74ee31d 100644
--- a/src/config/router.config.js
+++ b/src/config/router.config.js
@@ -1,7 +1,7 @@
 /*
  * @Author: Aimee~
  * @Date: 2023-05-11 12:02:45
- * @LastEditTime: 2023-12-12 16:13:30
+ * @LastEditTime: 2023-12-13 13:11:46
  * @LastEditors: Aimee
  * @FilePath: /water_dealer-agent/src/config/router.config.js
  * @Description: 路由
@@ -13,7 +13,7 @@ import {
 import detail from './routes/detail'
 import stock from './routes/stock'
 import user from './routes/user'
-import coupon from './routes/coupon'
+// import coupon from './routes/coupon'
 import permission from './routes/permission'
 import sales from './routes/sales'
 // import cityExperienceOfficer from './routes/cityExperienceOfficer'
@@ -42,7 +42,7 @@ export const asyncRouterMap = [{
       ...stock,
       ...sales,
       ...user,
-      ...coupon,
+      // ...coupon,
       ...permission
     ]
   },
diff --git a/src/views/sales/Offline.vue b/src/views/sales/Offline.vue
index 2682e0a..debae51 100644
--- a/src/views/sales/Offline.vue
+++ b/src/views/sales/Offline.vue
@@ -61,7 +61,7 @@
           <div>{{ record.name }} {{ record.mobile?'('+record.mobile+')':'--' }}</div>
           <div>{{ record.address || '--' }}</div>
         </div>
-        <div slot="number" slot-scope="text, record">{{ record.number }}件</div>
+        <div slot="number" slot-scope="text, record">{{ record.number }}（支）</div>
         <a slot="total" slot-scope="text, record">￥{{ record.total || '0.00' }}</a>
         <div slot="channel" slot-scope="text, record">{{ record.channel == 'express' ?'快递':'自提' }}</div>
         <div slot="express" slot-scope="text, record">
diff --git a/src/views/sales/OnStock.vue b/src/views/sales/OnStock.vue
index 9f81276..4c8a61c 100644
--- a/src/views/sales/OnStock.vue
+++ b/src/views/sales/OnStock.vue
@@ -60,7 +60,7 @@
           <div>{{ record.express.full_address || '--' }}</div>
         </div>
         <a slot="total" slot-scope="text, record">￥{{ record.total }}</a>
-        <a slot="items_qty" slot-scope="text, record">{{ record.items_qty }}件</a>
+        <a slot="items_qty" slot-scope="text, record">{{ record.items_qty }}（支）</a>
         <!-- 操作 -->
         <div slot="actions" slot-scope="text, record">
           <a class="ant-dropdown-link" @click="onInfo(record.order_no)">查看详情</a>
diff --git a/src/views/sales/Online.vue b/src/views/sales/Online.vue
index 33418e5..8833df3 100644
--- a/src/views/sales/Online.vue
+++ b/src/views/sales/Online.vue
@@ -60,7 +60,7 @@
           <div>{{ record.express.full_address || '--' }}</div>
         </div>
         <a slot="total" slot-scope="text, record">￥{{ record.total }}</a>
-        <a slot="items_qty" slot-scope="text, record">{{ record.items_qty }}件</a>
+        <a slot="items_qty" slot-scope="text, record">{{ record.items_qty }}（支）</a>
         <!-- 操作 -->
         <div slot="actions" slot-scope="text, record">
           <a class="ant-dropdown-link" @click="onInfo(record.order_no)">查看详情</a>
diff --git a/src/views/sales/widgets/StockInfo.vue b/src/views/sales/widgets/StockInfo.vue
index ab6e403..b43305a 100644
--- a/src/views/sales/widgets/StockInfo.vue
+++ b/src/views/sales/widgets/StockInfo.vue
@@ -1,3 +1,11 @@
+<!--
+ * @Author: Aimee~
+ * @Date: 2023-08-03 17:36:19
+ * @LastEditTime: 2023-12-13 13:19:33
+ * @LastEditors: Aimee
+ * @FilePath: /water_dealer-agent/src/views/sales/widgets/StockInfo.vue
+ * @Description: stockinfo
+-->
 
 <!-- 驳回原因用户姓名输入 -->
 <template>
@@ -11,9 +19,9 @@
     <br/><a-divider orientation="left">{{ info.channel.text + info.operation_type.text }}</a-divider>
     <a-descriptions :column="4">
       <a-descriptions-item :label="info.channel.text + info.operation_type.text+ '方式'" span="2">{{ info.type.text }}</a-descriptions-item>
-      <a-descriptions-item :label="info.operation_type.text + '数量'" span="2">{{ info.items_count.qty_all }}件</a-descriptions-item>
+      <a-descriptions-item :label="info.operation_type.text + '数量'" span="2">{{ info.items_count.qty_all }}（支）</a-descriptions-item>
       <a-descriptions-item label="是否使用优惠券兑换" span="2">{{ info.items_count.coupon_all>0 ?'是':'否' }}</a-descriptions-item>
-      <a-descriptions-item label="使用优惠券兑换数量" span="2" v-if="info.items_count.coupon_all>0">{{ info.items_count.coupon_all + '件' }}</a-descriptions-item>
+      <a-descriptions-item label="使用优惠券兑换数量" span="2" v-if="info.items_count.coupon_all>0">{{ info.items_count.coupon_all + '（支）' }}</a-descriptions-item>
       <a-descriptions-item label="使用优惠券兑换抵扣金额" span="2" v-if="info.items_count.coupon_all>0">{{ info.coupon.price + '元' }}</a-descriptions-item>
     </a-descriptions>
     <br/><a-divider orientation="left">购买商品</a-divider>
diff --git a/src/views/stock/DealerIn.vue b/src/views/stock/DealerIn.vue
index 5b9c01e..b0d659a 100644
--- a/src/views/stock/DealerIn.vue
+++ b/src/views/stock/DealerIn.vue
@@ -64,8 +64,8 @@
         size="default">
         <user-info slot="user" slot-scope="text, record" :info="{...record.in_user}" />
         <user-info slot="out_user" slot-scope="text, record" :info="{...record.out_user}" />
-        <a slot="number" slot-scope="text, record" style="color: #1890ff">{{ record.number }}件</a>
-        <a slot="stock" slot-scope="text, record" style="color: #1890ff">{{ record.stock }}件</a>
+        <a slot="number" slot-scope="text, record" style="color: #1890ff">{{ record.number }}（支）</a>
+        <a slot="stock" slot-scope="text, record" style="color: #1890ff">{{ record.stock }}（支）</a>
         <a slot="total" slot-scope="text, record" style="color: #1890ff">￥{{ record.total }}</a>
         <div slot="stock_order" slot-scope="text, record" >{{ record.stock_order?record.stock_order.type:'--' }}</div>
       </s-table>
diff --git a/src/views/stock/DealerOut.vue b/src/views/stock/DealerOut.vue
index a6b2076..4ba5641 100644
--- a/src/views/stock/DealerOut.vue
+++ b/src/views/stock/DealerOut.vue
@@ -81,8 +81,8 @@
         size="default">
         <user-info slot="in_user" slot-scope="text, record" :info="{...record.in_user}" />
         <user-info slot="out_user" slot-scope="text, record" :info="{...record.out_user}" />
-        <a slot="number" slot-scope="text, record" style="color: #1890ff">{{ record.number }}件</a>
-        <a slot="stock" slot-scope="text, record" style="color: #1890ff">{{ record.stock }}件</a>
+        <a slot="number" slot-scope="text, record" style="color: #1890ff">{{ record.number }}（支）</a>
+        <a slot="stock" slot-scope="text, record" style="color: #1890ff">{{ record.stock }}（支）</a>
         <a slot="total" slot-scope="text, record" style="color: #1890ff">￥{{ record.total }}</a>
       </s-table>
     </a-card>
diff --git a/src/views/stock/In.vue b/src/views/stock/In.vue
index 885f4d2..9fe4f19 100644
--- a/src/views/stock/In.vue
+++ b/src/views/stock/In.vue
@@ -44,7 +44,7 @@
         showPagination="auto"
         bordered
         size="default">
-        <a slot="number" slot-scope="text, record" style="color: #1890ff">{{ record.number }}件</a>
+        <a slot="number" slot-scope="text, record" style="color: #1890ff">{{ record.number }}（支）</a>
       </s-table>
     </a-card>
   </page-header-wrapper>
diff --git a/src/views/user/Index.vue b/src/views/user/Index.vue
index 4166d9a..b2b9720 100644
--- a/src/views/user/Index.vue
+++ b/src/views/user/Index.vue
@@ -1,269 +1,27 @@
 
 <template>
   <page-header-wrapper>
-    <template v-slot:content>
-      <div class="table-page-search-wrapper">
-        <a-form layout="inline">
-          <a-row :gutter="48">
-            <a-col :md="6" :sm="24">
-              <a-form-item label="用户昵称">
-                <a-input v-model="queryParam.nickname" placeholder="用户昵称" />
-              </a-form-item>
-            </a-col>
-            <a-col :md="6" :sm="24">
-              <a-form-item label="用户手机号">
-                <a-input v-model="queryParam.username" placeholder="用户手机号" />
-              </a-form-item>
-            </a-col>
-            <a-col :md="6" :sm="24">
-              <a-form-item label="身份筛选" has-feedback>
-                <a-select v-model="queryParam.identity_id" placeholder="身份筛选">
-                  <a-select-option v-for="item in indentitys" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-            <a-col :md="6" :sm="24">
-              <a-button type="primary" @click="search"><a-icon type="search" />搜索</a-button>
-              <!-- <a-button class="ml8" type="primary" @click="onAddRole"><a-icon type="plus" />新增</a-button> -->
-              <a-button class="ml8" @click="resetSearch"><a-icon type="undo" />重置</a-button>
-            </a-col>
-          </a-row>
-        </a-form>
-      </div>
-    </template>
-
     <!-- 列表 -->
     <a-card :bordered="false">
-      <s-table
-        ref="table"
-        :columns="columns"
-        :data="loadData"
-        :rowKey="(row) => row.user.user_id"
-        showPagination="auto"
-        bordered
-        size="default"
-        :scroll="{ x: 1200, y: 1000 }">
-        <div slot="user_id" slot-scope="text, record">{{ record.user.user_id }}</div>
-        <div slot="nickname" slot-scope="text, record" >{{ record.user.nickname || '-' }}</div>
-        <div slot="name" slot-scope="text, record">{{ record.user.name || '-' }}</div>
-        <div slot="username" slot-scope="text, record">{{ record.user.username || '-' }}</div>
-        <div slot="identity" slot-scope="text, record">
-          <img v-if="record.identity&& record.identity.cover" :src="record.identity.cover" alt="" style="width:60px">
-          <span v-else> {{ record.identity.name }}</span>
-        </div>
-        <div slot="invite" slot-scope="text, record" style="color: #1890ff">{{ record.user.invite || '-' }}</div>
-        <div slot="parent" slot-scope="text, record">{{ record.parent.nickname }}<div>{{ record.parent.username }}</div></div>
-
-        <span slot="created_at" slot-scope="text, record">{{ record.created_at }}</span>
-
-        <div slot="order_count" slot-scope="text, record" style="color: #1890ff">{{ record.order.count + '（单）' || '-' }}</div>
-        <div slot="order_price" slot-scope="text, record" style="color: #1890ff">{{ record.order.price + '（元）' || '-' }}</div>
-        <div slot="stock" slot-scope="text, record" style="color: #1890ff">{{ record.stock + '（件)' || '-' }}</div>
-        <!-- 操作 -->
-        <div slot="actions" slot-scope="text, record">
-          <a class="ant-dropdown-link" @click="onEdit(record)">更改推荐人</a>
-        </div>
-      </s-table>
+      <QuillEditor />
     </a-card>
   </page-header-wrapper>
 </template>
 
 <script>
-import { STable, UserInfo } from '@/components'
-import DeriveButton from '@/components/OrderDetailInfo/DeriveButton'
-import moment from 'moment'
-import { getMiddlesUser } from '@/api/user'
-import EditInvite from './widgets/EditInvite.vue'
-import AddUser from './widgets/AddUser.vue'
-
-// 列表规格
-const columns = [
-  {
-    title: '用户ID',
-    scopedSlots: { customRender: 'user_id' },
-    align: 'center',
-    width: 80
-  },
-  {
-    title: '当前用户信息',
-    children: [
-      {
-        title: '昵称',
-        scopedSlots: { customRender: 'nickname' },
-        align: 'center',
-        width: 140
-      },
-      {
-        title: '真实姓名',
-        scopedSlots: { customRender: 'name' },
-        align: 'center',
-        width: 120
-      },
-      {
-        title: '用户手机',
-        scopedSlots: { customRender: 'username' },
-        align: 'center',
-        width: 130
-      },
-      {
-        title: '身份',
-        scopedSlots: { customRender: 'identity' },
-        align: 'center',
-        width: 120
-      },
-      {
-        title: '邀请码',
-        scopedSlots: { customRender: 'invite' },
-        align: 'center',
-        width: 130
-      }
-    ],
-    width: 300,
-    align: 'center'
-  }, {
-    title: '当前库存',
-    scopedSlots: { customRender: 'stock' },
-    width: 120,
-    align: 'center'
-  },
-  {
-    title: '消费订单量',
-    scopedSlots: { customRender: 'order_count' },
-    width: 120,
-    align: 'center'
-  },
-  {
-    title: '消费订单额',
-    scopedSlots: { customRender: 'order_price' },
-    width: 120,
-    align: 'center'
-  },
-  {
-    title: '推荐人手机号',
-    scopedSlots: { customRender: 'parent' },
-    width: 140,
-    align: 'center'
-  },
-  {
-    title: '注册时间',
-    dataIndex: 'created_at',
-    width: 200,
-    align: 'center'
-  }
-  // {
-  //   title: '操作',
-  //   dataIndex: 'status10',
-  //   scopedSlots: { customRender: 'actions' },
-  //   align: 'center',
-  //   width: 160,
-  //   fixed: 'right'
-  // }
-]
-
+import QuillEditor from '@/components/Editor/QuillEditor.vue'
 export default {
   name: 'UserIndex',
   components: {
-    STable,
-    UserInfo,
-    DeriveButton
+    QuillEditor
   },
   data () {
     return {
-      columns,
-      indentitys: [
-        { id: 1, name: '普通用户' },
-        { id: 2, name: 'VIP' },
-        { id: 4, name: '创客' },
-        { id: 6, name: '代理商' }
-      ], // 业务类型
-      queryParam: {
-        username: undefined,
-        nickname: undefined,
-        identity_id: undefined
-      },
-      listCount: 0,
-      loadData: (parameter) => {
-        const requestParameters = Object.assign({}, parameter, this.queryParam)
-        return getMiddlesUser(requestParameters)
-      }
-    }
-  },
-  watch: {
-    $route (to, from) {
-      if (to.name === 'UserIndex' && (
-        from.name === 'Home' ||
-        from.name === 'cityExperienceOfficer' ||
-        from.name === 'StockOut' ||
-        from.name === 'StockIn' ||
-        from.name === 'DealerIn' ||
-        from.name === 'DealerOut' ||
-        from.name === 'SalesOnline' ||
-        from.name === 'SalesStock')
-      ) {
-        this.$refs.table.loadData()
-      }
     }
   },
+
   methods: {
-    moment,
-    // 搜索列表
-    search () {
-      this.$refs.table.refresh(true) // 重置接口且刷先到第一页
-    },
-    // 重置搜索列表
-    resetSearch () {
-      this.queryParam = {
-        username: undefined,
-        nickname: undefined,
-        identity_id: undefined
-      }
-      this.$refs.table.refresh(true) // 重置接口且刷先到第一页
-    },
-    // 新增用户
-    onAddRole () {
-      const success = {
-        title: '新增用户',
-        width: 600,
-        maskClosable: true,
-        closable: true,
-        okText: '确认新增',
-        cancelText: '取消'
-      }
-      this.$dialog(
-        AddUser,
-        {
-          on: {
-            ok: () => {
-              this.$refs.table.loadData()
-            }
-          }
-        },
-        success
-      )
-    },
-    // 更改推荐人
-    onEdit (item) {
-      const success = {
-        title: '更改推荐人',
-        width: 600,
-        maskClosable: true,
-        closable: true,
-        okText: '确认变更',
-        cancelText: '取消'
-      }
-      this.$dialog(
-        EditInvite,
-        {
-          item,
-          on: {
-            ok: () => {
-              this.$refs.table.loadData()
-            }
-          }
-        },
-        success
-      )
-    }
+
   }
 }
 </script>
diff --git a/src/views/user/widgets/QuillEditorVue.vue b/src/views/user/widgets/QuillEditorVue.vue
new file mode 100644
index 0000000..454cfc4
--- /dev/null
+++ b/src/views/user/widgets/QuillEditorVue.vue
@@ -0,0 +1,359 @@
+<!--
+ * @Author: Aimee~
+ * @Date: 2023-12-18 13:31:13
+ * @LastEditTime: 2023-12-19 16:30:51
+ * @LastEditors: Aimee
+ * @FilePath: /water_dealer-agent/src/views/user/widgets/QuillEditorVue.vue
+ * @Description: vueQuillEditor
+-->
+<template>
+  <div class="VueQuillEditor">
+    <!-- 上传 -->
+    <a-upload class="quill-upload" :action="actionUrl" @change="handleChange" :show-upload-list="false" ref="aUpload">
+    </a-upload>
+
+    <div class="myQuillTitle">{{ title }}</div>
+    <quill-editor
+      v-model="content"
+      ref="myQuillEditor"
+      :options="editorOption"
+      @blur="onEditorBlur($event)"
+      @focus="onEditorFocus($event)"
+      @change="onEditorChange($event)"
+      @ready="onEditorReady($event)">
+    </quill-editor>
+  </div>
+</template>
+
+<script>
+import Quill from 'quill'
+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 { ImageDrop } from 'quill-image-drop-module'
+import ImageaResize from 'quill-image-resize-module'
+import { ImageExtend } from 'quill-image-extend-module'
+Quill.register('modules/imageResize', ImageaResize)
+Quill.register('modules/imageExtend', ImageExtend)
+Quill.register('modules/imageDrop', ImageDrop)
+
+// 富文本顶部按钮
+const toolbar = [
+    ['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线
+    ['blockquote', 'code-block'], // 引用  代码块
+    [{ header: 1 }, { header: 2 }], // 1、2 级标题
+    [{ list: 'ordered' }, { list: 'bullet' }], // 有序、无序列表
+    [{ script: 'sub' }, { script: 'super' }], // 上标/下标
+    [{ indent: '-1' }, { indent: '+1' }], // 缩进
+    [{ direction: 'rtl' }], // 文本方向
+    [{ 'size': ['12', '14', '16', '18', '20', '22', '24', '28', '32', '36'] }], // 字体大小
+    [{ header: [1, 2, 3, 4, 5, 6] }], // 标题
+    [{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
+    // [{ font: ['songti'] }], // 字体种类
+    [{ align: [] }], // 对齐方式
+    ['clean'], // 清除文本格式
+    ['link', 'video'], // 链接、图片、视频
+    ['myUploadBtn'] // 自定义上传按钮
+]
+// toolbar标题
+const titleConfig = [
+    { Choice: '.ql-insertMetric', title: '跳转配置' },
+    { Choice: '.ql-bold', title: '加粗' },
+    { Choice: '.ql-italic', title: '斜体' },
+    { Choice: '.ql-underline', title: '下划线' },
+    { Choice: '.ql-header', title: '段落格式' },
+    { Choice: '.ql-strike', title: '删除线' },
+    { Choice: '.ql-blockquote', title: '块引用' },
+    { Choice: '.ql-code', title: '插入代码' },
+    { Choice: '.ql-code-block', title: '插入代码段' },
+    { Choice: '.ql-font', title: '字体' },
+    { Choice: '.ql-size', title: '字体大小' },
+    { Choice: '.ql-list[value="ordered"]', title: '编号列表' },
+    { Choice: '.ql-list[value="bullet"]', title: '项目列表' },
+    { Choice: '.ql-direction', title: '文本方向' },
+    { Choice: '.ql-header[value="1"]', title: 'h1' },
+    { Choice: '.ql-header[value="2"]', title: 'h2' },
+    { Choice: '.ql-align', title: '对齐方式' },
+    { Choice: '.ql-color', title: '字体颜色' },
+    { Choice: '.ql-background', title: '背景颜色' },
+    { Choice: '.ql-image', title: '图像' },
+    { Choice: '.ql-video', title: '视频' },
+    { Choice: '.ql-link', title: '添加链接' },
+    { Choice: '.ql-formula', title: '插入公式' },
+    { Choice: '.ql-clean', title: '清除字体格式' },
+    { Choice: '.ql-script[value="sub"]', title: '下标' },
+    { Choice: '.ql-script[value="super"]', title: '上标' },
+    { Choice: '.ql-indent[value="-1"]', title: '向左缩进' },
+    { Choice: '.ql-indent[value="+1"]', title: '向右缩进' },
+    { Choice: '.ql-header .ql-picker-label', title: '标题大小' },
+    { Choice: '.ql-header .ql-picker-item[data-value="1"]', title: '标题一' },
+    { Choice: '.ql-header .ql-picker-item[data-value="2"]', title: '标题二' },
+    { Choice: '.ql-header .ql-picker-item[data-value="3"]', title: '标题三' },
+    { Choice: '.ql-header .ql-picker-item[data-value="4"]', title: '标题四' },
+    { Choice: '.ql-header .ql-picker-item[data-value="5"]', title: '标题五' },
+    { Choice: '.ql-header .ql-picker-item[data-value="6"]', title: '标题六' },
+    { Choice: '.ql-header .ql-picker-item:last-child', title: '标准' },
+    { Choice: '.ql-size .ql-picker-item[data-value="small"]', title: '小号' },
+    { Choice: '.ql-size .ql-picker-item[data-value="large"]', title: '大号' },
+    { Choice: '.ql-size .ql-picker-item[data-value="huge"]', title: '超大号' },
+    { Choice: '.ql-size .ql-picker-item:nth-child(2)', title: '标准' },
+    { Choice: '.ql-align .ql-picker-item:first-child', title: '居左对齐' },
+    { Choice: '.ql-align .ql-picker-item[data-value="center"]', title: '居中对齐' },
+    { Choice: '.ql-align .ql-picker-item[data-value="right"]', title: '居右对齐' },
+    { Choice: '.ql-align .ql-picker-item[data-value="justify"]', title: '两端对齐' }
+]
+// 遍历中文
+for (const item of titleConfig) {
+    const tip = document.querySelector('.quill-editor ' + item.Choice)
+    if (!tip) continue
+    tip.setAttribute('title', item.title)
+}
+
+export default {
+    name: 'QuillEditor',
+    components: { quillEditor },
+    props: {
+        title: {
+            type: String,
+            default: () => {
+                return ''
+            }
+        },
+        content: {
+            type: String,
+            default: () => {
+                return ''
+            }
+        }
+    },
+    data () {
+        return {
+            // 富文本编辑器配置
+            editorOption: {
+                modules: {
+                    history: { // 后退
+                        delay: 1000,
+                        maxStack: 50,
+                        userOnly: false
+                    },
+                    imageDrop: true, // 可以拉图片
+                    imageResize: {
+                        displaySize: true // 修改图片大小
+                    },
+                    toolbar: {
+                        container: toolbar,
+                        handlers: {
+                            myUploadBtn: this.myUploadBtnClick
+                        }
+                    }
+                },
+                placeholder: '请输入正文'
+            },
+            actionUrl: 'https://text.twmkeji.cn/api'
+        }
+    },
+    mounted () {
+        this.initButton()
+    },
+    methods: {
+        // 失去焦点事件
+        onEditorBlur (quill) {
+            console.log('editor blur!', quill)
+        },
+        // 获得焦点事件
+        onEditorFocus (quill) {
+            console.log('editor focus!', quill)
+        },
+        // 准备富文本编辑器
+        onEditorReady (quill) {
+            console.log('editor ready!', quill)
+        },
+        // 内容改变事件
+        onEditorChange ({ quill, html, text }) {
+            // console.log('editor change!', quill, html, text)
+            this.$emit('updateHtml', html)
+        },
+        // 自定义按钮内容初始化
+        initButton () {
+            const myUploadBtn = document.querySelector('.ql-myUploadBtn')
+            myUploadBtn.innerHTML = '<i class="el-icon-picture" style="font-size:18px;color:black;"></i>'
+        },
+        // 自定义按钮的点击事件
+        myUploadBtnClick (e) {
+            this.$refs.aUpload.$children[0].$refs.uploaderRef.onClick()
+        },
+        // 上传图片生成
+        handleChange (e) {
+            const { file } = e
+            if (file.status === 'done') {
+                console.log('done...')
+                const url = file.response.data.url[0]
+                console.log(file.response.data.url)
+                this.quillSuccess(url)
+            }
+        },
+        // 插入逛飙图片
+        quillSuccess (url) {
+            const quill = this.$refs.myQuillEditor.quill
+            // 获取光标所在位置
+            const length = quill.getSelection().index
+            // // 插入图片 res.url 为服务器返回的图片地址
+            quill.insertEmbed(length, 'image', url)
+            // // 调整光标到最后
+            quill.setSelection(length + 1)
+        }
+    }
+}
+</script>
+
+<style>
+.myQuillTitle {
+    color: #222;
+    padding-bottom: 10px;
+}
+
+/* // 这个是字号数字对应的显示的内容，vertical-align根据个人需要加不加，因为我页面那个字与其他对不齐 */
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="12"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="12"]::before {
+    content: '12px';
+    vertical-align: top;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="14"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="14"]::before {
+    content: '14px';
+    vertical-align: top;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="16"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="16"]::before {
+    content: '16px';
+    vertical-align: top;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="18"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="18"]::before {
+    content: '18px';
+    vertical-align: top;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="20"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="20"]::before {
+    content: '20px';
+    vertical-align: top;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="22"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="22"]::before {
+    content: '22px';
+    vertical-align: top;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="24"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="24"]::before {
+    content: '24px';
+    vertical-align: top;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="28"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="28"]::before {
+    content: '28px';
+    vertical-align: top;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="32"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="32"]::before {
+    content: '32px';
+    vertical-align: top;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="36"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="36"]::before {
+    content: '36px';
+    vertical-align: top;
+}
+
+/* // 这个是字号数字对应的px值 */
+.ql-editor .ql-size-12 {
+    font-size: 12px;
+}
+
+.ql-editor .ql-size-14 {
+    font-size: 14px;
+}
+
+.ql-editor .ql-size-16 {
+    font-size: 16px;
+}
+
+.ql-editor .ql-size-18 {
+    font-size: 18px;
+}
+
+.ql-editor .ql-size-20 {
+    font-size: 20px;
+}
+
+.ql-editor .ql-size-22 {
+    font-size: 22px;
+}
+
+.ql-editor .ql-size-24 {
+    font-size: 24px;
+}
+
+.ql-editor .ql-size-28 {
+    font-size: 28px;
+}
+
+.ql-editor .ql-size-32 {
+    font-size: 32px;
+}
+
+.ql-editor .ql-size-36 {
+    font-size: 36px;
+}
+
+/* // 选择字号富文本字的大小 */
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="12"]::before {
+    font-size: 12px;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="14"]::before {
+    font-size: 14px;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="16"]::before {
+    font-size: 16px;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="18"]::before {
+    font-size: 18px;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="20"]::before {
+    font-size: 20px;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="22"]::before {
+    font-size: 22px;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="24"]::before {
+    font-size: 24px;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="28"]::before {
+    font-size: 28px;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="32"]::before {
+    font-size: 32px;
+}
+
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="36"]::before {
+    font-size: 36px;
+}
+</style>
diff --git a/vue.config.js b/vue.config.js
index 0d43c95..28763a1 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -36,19 +36,20 @@ const assetsCDN = {
   ]
 }
 
-// vue.config.js
 const vueConfig = {
   configureWebpack: {
-    // webpack plugins
     plugins: [
       new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
       new webpack.DefinePlugin({
         APP_VERSION: `"${require('./package.json').version}"`,
         GIT_HASH: JSON.stringify(getGitHash()),
         BUILD_DATE: buildDate
+      }),
+      new webpack.ProvidePlugin({
+        'window.Quill': 'quill/dist/quill.js',
+        'Quill': 'quill/dist/quill.js'
       })
     ],
-    // if prod, add externals
     externals: isProd ? assetsCDN.externals : {}
   },
 
diff --git a/yarn.lock b/yarn.lock
index b81d6c5..b19637d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10034,7 +10034,28 @@ quill-delta@^3.6.2:
     extend "^3.0.2"
     fast-diff "1.1.2"
 
-quill@^1.3.4:
+quill-image-drop-module@1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/quill-image-drop-module/-/quill-image-drop-module-1.0.3.tgz#0e5ec8329dd67a12126f166b191bf64d2057a7d3"
+  integrity sha512-HP0Y2kb3nQk1QbRKZzEe1j3mArRQerN5B/U/MlXrOnxmhy3m/xYmVv0YoE13vWnGnBOIcoXGJ/9fi7l6AwsP8Q==
+  dependencies:
+    quill "^1.2.2"
+
+quill-image-extend-module@1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/quill-image-extend-module/-/quill-image-extend-module-1.1.2.tgz#b7c303c45282ae87133d643324d5ca39c6d52921"
+  integrity sha512-yHJWZWlTjNZzV34zuT4H55ttDwMxmVJ7JUgKnt/Wd3ejUNcaPOV57/sKG8VEMU5mL7bKZPIKmBdb3weM0M5UeA==
+
+quill-image-resize-module@3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/quill-image-resize-module/-/quill-image-resize-module-3.0.0.tgz#0fd93746a837336d95b2f536140416a623c71771"
+  integrity sha512-1TZBnUxU/WIx5dPyVjQ9yN7C6mLZSp04HyWBEMqT320DIq4MW4JgzlOPDZX5ZpBM3bU6sacU4kTLUc8VgYQZYw==
+  dependencies:
+    lodash "^4.17.4"
+    quill "^1.2.2"
+    raw-loader "^0.5.1"
+
+quill@1.3.7, quill@^1.2.2, quill@^1.3.4:
   version "1.3.7"
   resolved "https://registry.yarnpkg.com/quill/-/quill-1.3.7.tgz#da5b2f3a2c470e932340cdbf3668c9f21f9286e8"
   integrity sha512-hG/DVzh/TiknWtE6QmWAF/pxoZKYxfe3J/d/+ShUWkDvvkZQVTPeVmUJVu1uE6DDooC4fWTiCLh84ul89oNz5g==
@@ -10083,6 +10104,11 @@ raw-body@2.5.1:
     iconv-lite "0.4.24"
     unpipe "1.0.0"
 
+raw-loader@^0.5.1:
+  version "0.5.1"
+  resolved "https://registry.yarnpkg.com/raw-loader/-/raw-loader-0.5.1.tgz#0c3d0beaed8a01c966d9787bf778281252a979aa"
+  integrity sha512-sf7oGoLuaYAScB4VGr0tzetsYlS8EJH6qnTCfQ/WVEa89hALQ4RQfCKt5xCyPQKPDUbVUAIP1QsxAwfAjlDp7Q==
+
 react-is@^16.8.4:
   version "16.13.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
@@ -12215,7 +12241,7 @@ vue-loader@^15.9.2:
     vue-hot-reload-api "^2.3.0"
     vue-style-loader "^4.1.0"
 
-vue-quill-editor@^3.0.6:
+vue-quill-editor@3.0.6:
   version "3.0.6"
   resolved "https://registry.yarnpkg.com/vue-quill-editor/-/vue-quill-editor-3.0.6.tgz#1f85646211d68a31a80a72cb7f45bb2f119bc8fb"
   integrity sha512-g20oSZNWg8Hbu41Kinjd55e235qVWPLfg4NvsLW6d+DhgBTFbEuMpcWlUdrD6qT3+Noim6DRu18VLM9lVShXOQ==