From 15efbd83c61c97b793985da28a31777d05771be7 Mon Sep 17 00:00:00 2001
From: yujialong <479214531@qq.com>
Date: Thu, 10 Nov 2022 14:13:10 +0800
Subject: [PATCH] =?UTF-8?q?bug=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/editor.css                     |  61 ++++
 src/components/img-upload/Cropper.vue |  23 +-
 src/components/modules/content.vue    |  38 ++-
 src/components/modules/link.vue       |  11 +-
 src/components/modules/module.vue     |  74 +++--
 src/const/column.js                   |   4 +-
 src/mixins/page/index.js              |  43 +--
 src/pages/account/login/index.vue     | 212 +++++++-------
 src/pages/article/add/editor.js       | 102 ++++---
 src/pages/article/add/index.vue       | 156 +++++++---
 src/pages/article/list/index.vue      |  47 ++-
 src/pages/column/add/index.vue        | 118 ++++----
 src/pages/column/list/index.vue       |  14 +-
 src/pages/column/page/about.vue       | 392 ++++++++++++++------------
 src/pages/column/page/careers.vue     | 240 +++++++++-------
 src/pages/column/page/edu.vue         | 122 ++++----
 src/pages/column/page/home.vue        | 341 +++++++++++-----------
 src/pages/column/page/news.vue        | 337 ++++++++++++----------
 src/pages/column/page/newsPress.vue   |  61 ++--
 src/pages/user/list/index.vue         |   3 +-
 src/router/permission.js              |   2 +
 src/styles/common.scss                |  15 +-
 src/styles/page/page.scss             |   7 +-
 23 files changed, 1396 insertions(+), 1027 deletions(-)
 create mode 100644 public/editor.css

diff --git a/public/editor.css b/public/editor.css
new file mode 100644
index 0000000..9c8759c
--- /dev/null
+++ b/public/editor.css
@@ -0,0 +1,61 @@
+.mce-content-body:not([dir=rtl]) blockquote {
+  padding: 8px 15px;
+  border-left: 0;
+  background-color: #ededed;
+}
+.tiny-wrap {
+  width: 900px;
+  margin: 0 auto;
+}
+.tiny-wrap blockquote p {
+  margin: 0;
+  font-style: italic;
+}
+.tiny-wrap .block {
+  margin-bottom: 20px;
+  overflow: hidden;
+}
+.tiny-wrap .block .fl {
+  float: left;
+  margin: 0 20px 0 0;
+}
+.tiny-wrap .block .fr {
+  float: right;
+  margin: 0 0 0 20px;
+}
+.tiny-wrap .block p {
+  margin: 0 0 10px;
+  font-size: 19px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #101010;
+  line-height: 32px;
+}
+.tiny-wrap .block .tiny-title {
+  margin: 10px 0;
+  font-size: 24px;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: 500;
+  color: #101010;
+  line-height: 32px;
+}
+.tiny-wrap .quote {
+  padding: 15px;
+  font-size: 14px;
+  font-style: italic;
+  border: 1px solid #e3e3e3;
+  background-color: #f1f1f1;
+}
+.tiny-wrap .img-wrap {
+  text-align: center;
+}
+.tiny-wrap .img-wrap img {
+  max-width: 600px;
+  max-height: 600px;
+}
+.tiny-wrap .block .img-des {
+  margin: 10px 0 0;
+  font-size: 14px;
+  color: #8d8d8d;
+  text-align: center;
+}
\ No newline at end of file
diff --git a/src/components/img-upload/Cropper.vue b/src/components/img-upload/Cropper.vue
index 22854fa..93b7cf4 100644
--- a/src/components/img-upload/Cropper.vue
+++ b/src/components/img-upload/Cropper.vue
@@ -16,8 +16,8 @@
           :auto-crop="option.autoCrop"
           :auto-crop-width="option.autoCropWidth"
           :auto-crop-height="option.autoCropHeight"
-          :fixed-box="fixedBox"
-          :fixed="fixed"
+          :fixed-box="option.fixedBox"
+          :fixed="option.fixed"
           :fixed-number="fixedNumber"
           @realTime="realTime" />
         <!-- <vueCropper ref="cropper" :img="option.img" :outputSize="option.size" :outputType="option.outputType"></vueCropper> -->
@@ -46,7 +46,7 @@
           :loading="isUpload"
           :disabled="isDisabled"
           @click.prevent="uploadImg('base64')">
-          {{ '上传' | transLoading(isUpload) }}
+          上传
         </el-button>
       </div>
     </div>
@@ -75,6 +75,11 @@ export default {
       default: () => {
         return { url: '', size: 10 }
       }
+    },
+    // 截图框比例
+    fixedNumber: {
+      type: Array,
+      default: [1, 0.26]
     }
   },
   data() {
@@ -89,11 +94,11 @@ export default {
         original: false, // 上传图片按照原始比例渲染  (默认:false)
         canMoveBox: true, // 截图框能否拖动  (默认:true)
         autoCrop: true, // 是否默认生成截图框  (默认:false)
-        // autoCropWidth: 480, // 默认生成截图框宽度  (默认:80%)
-        // autoCropHeight: 320, // 默认生成截图框高度  (默认:80%)
+        autoCropWidth: 480, // 默认生成截图框宽度  (默认:80%)
+        autoCropHeight: 124, // 默认生成截图框高度  (默认:80%)
         fixedBox: false, // 固定截图框大小 不允许改变  (默认:false)
         fixed: true, // 是否开启截图框宽高固定比例  (默认:true)
-        fixedNumber: [1.5, 1], // 截图框比例  (默认:[1:1])
+        fixedNumber: [1, 0.26], // 截图框比例  (默认:[1:1])
         enlarge: 1
       },
       isDisabled: false
@@ -113,9 +118,9 @@ export default {
       // 向右旋转
       this.$refs.cropper.rotateRight()
     },
-    updateImg() {
-      this.option.img = this.imgFile.url
-      this.option.size = this.imgFile.size / 1024 > 200 ? 0.9 : 0.95
+    updateImg(file) {
+      this.option.img = file.url
+      this.option.size = file.size / 1024 > 200 ? 0.9 : 0.95
     },
     realTime(data) {
       // 实时预览
diff --git a/src/components/modules/content.vue b/src/components/modules/content.vue
index 5855307..7d78745 100644
--- a/src/components/modules/content.vue
+++ b/src/components/modules/content.vue
@@ -2,10 +2,10 @@
   <!-- 内容 -->
   <div>
     <el-dialog title="编辑内容" :visible.sync="visible" width="600px" custom-class="module" :close-on-click-modal="false" :before-close="close">
-      <el-form ref="form" :model="data.form" :rules="rules" label-width="80px">
+      <el-form ref="form" :model="data.form" :rules="rules" label-width="60px">
         <el-form-item v-for="(item, i) in data.forms" :key="i" :prop="item.prop" :label="item.label">
           <el-input v-if="item.type === 'input'" v-model="data.form[item.prop]" placeholder="请输入" maxlength="30"></el-input>
-          <el-input v-if="item.type === 'textarea'" v-model="data.form[item.prop]" type="textarea" placeholder="请输入" maxlength="50"></el-input>
+          <el-input v-if="item.type === 'textarea'" v-model="data.form[item.prop]" type="textarea" placeholder="请输入" maxlength="300"></el-input>
           <el-upload
             v-if="item.type === 'upload'"
             class="uploader"
@@ -107,21 +107,31 @@ export default {
     linkSubmit() {
       const el = this.$refs.link
       const data = this.data.form ? this.data.form.link : this.data.list[this.curIndex].link
-      const linkEle = data.connectionType === 1 ?
-        el.$refs.column :
-        data.connectionType === 3 ?
-          el.$refs.otherColumn :
-          null
-      if (data.connectionType !== 2) {
-        if (data.connectionType === 1) {
-          if (!data.columnId.length) return Util.errorMsg('请选择站内链接')
+      let name
+      // 站内链接
+      if (data.connectionType === 1) {
+        if (!data.columnId.length) return Util.errorMsg('请选择站内链接')
+        // 如果选择了文章，则取文章标题作为链接名称，否则取栏目标题
+        if (data.articleId) {
+          const item = el.articles.find(e => e.id == data.articleId)
+          name = item ? item.title : ''
+        } else {
+          name = el.$refs.column.getCheckedNodes()[0].pathLabels.join('/')
         }
-        if (data.connectionType === 3) {
-          if (!data.otherColumnId.length) return Util.errorMsg('请选择栏目')
+      } else if (data.connectionType === 3) { // 其他站点链接
+        if (!data.otherColumnId.length) return Util.errorMsg('请选择栏目')
+        // 如果选择了文章，则取文章标题作为链接名称，否则取栏目标题
+        if (data.otherArticleId) {
+          const item = el.articles.find(e => e.id == data.otherArticleId)
+          name = item ? item.title : ''
+        } else {
+          name = el.$refs.otherColumn.getCheckedNodes()[0].pathLabels.join('/')
         }
+      } else { // 站外链接
+        if (!data.linkAddress) return Util.errorMsg('请输入站外链接')
+        name = data.linkAddress
       }
-      data.linkName = linkEle ? linkEle.getCheckedNodes()[0].pathLabels.join('/') : data.linkAddress
-      console.log("🚀 ~ file: module.vue ~ line 296 ~ linkSubmit ~ data", this.data)
+      data.linkName = name
       this.linkVisible = false
     },
     // 模块设置提交
diff --git a/src/components/modules/link.vue b/src/components/modules/link.vue
index b0e4ee5..43fb1a8 100644
--- a/src/components/modules/link.vue
+++ b/src/components/modules/link.vue
@@ -1,7 +1,7 @@
 <template>
   <!-- 设置链接 -->
   <div>
-    <el-dialog title="设置链接地址" :visible.sync="visible" width="500px" :close-on-click-modal="false">
+    <el-dialog title="设置链接地址" :visible.sync="visible" width="500px" :close-on-click-modal="false" :before-close="close">
       <el-form :model="data" class="model" label-width="120px">
         <el-form-item prop="connectionType" label="连接类型">
           <el-radio-group v-model="data.connectionType">
@@ -18,7 +18,6 @@
               v-model="data.columnId"
               :options="columns"
               :props="columnProps"
-              clearable
               @change="columnChange"></el-cascader>
           </el-form-item>
           <el-form-item label="文章">
@@ -40,8 +39,8 @@
           ></el-input>
         </el-form-item>
         <template v-if="data.connectionType === 3">
-          <el-form-item prop="siteSelection" label="站点选择">
-            <el-select v-model="data.siteSelection">
+          <el-form-item prop="site" label="站点选择">
+            <el-select v-model="data.site">
               <el-option
                 v-for="item in sites"
                 :key="item.id"
@@ -56,7 +55,6 @@
               v-model="data.otherColumnId"
               :options="columns"
               :props="columnProps"
-              clearable
               @change="columnChange"></el-cascader>
           </el-form-item>
           <el-form-item label="文章">
@@ -178,6 +176,9 @@ export default {
         this.sites = data.records
       }).catch(e => {})
     },
+    close() {
+      this.$emit('update:visible', false)
+    },
     // 链接设置提交
     linkSubmit() {
       this.$emit('linkSubmit')
diff --git a/src/components/modules/module.vue b/src/components/modules/module.vue
index 9ab2c49..2d79ba1 100644
--- a/src/components/modules/module.vue
+++ b/src/components/modules/module.vue
@@ -1,7 +1,7 @@
 <template>
   <!-- banner -->
   <div>
-    <el-dialog title="Banner模块管理" :visible.sync="visible" width="600px" custom-class="module" :close-on-click-modal="false" :before-close="close">
+    <el-dialog title="模块管理" :visible.sync="visible" width="700px" custom-class="module" :close-on-click-modal="false" :before-close="close">
       <template v-if="data.type === 'banner' || data.type === 'introduce'">
         <el-table class="module-table" :data="data.list" header-align="center" row-key="id">
           <el-table-column type="index" width="60" label="序号" align="center"></el-table-column>
@@ -41,7 +41,7 @@
               </div>
             </template>
           </el-table-column>
-          <el-table-column label="操作" width="100">
+          <el-table-column label="操作" width="100" align="center">
             <template slot-scope="scope">
               <div class="flex a-center">
                 <el-switch
@@ -58,10 +58,10 @@
           <i class="el-icon-circle-plus-outline" @click="addRow"></i>
         </div>
       </template>
-      <el-form v-else-if="data.type === 'form'" ref="form" :model="data.form" :rules="rules" label-width="80px">
+      <el-form v-else-if="data.type === 'form'" ref="form" :model="data.form" :rules="rules" label-width="60px">
         <el-form-item v-for="(item, i) in data.forms" :key="i" :prop="item.prop" :label="item.label">
           <el-input v-if="item.type === 'input'" v-model="data.form[item.prop]" placeholder="请输入" maxlength="30"></el-input>
-          <el-input v-if="item.type === 'textarea'" v-model="data.form[item.prop]" type="textarea" placeholder="请输入" maxlength="50"></el-input>
+          <el-input v-if="item.type === 'textarea'" v-model="data.form[item.prop]" type="textarea" placeholder="请输入" maxlength="300"></el-input>
           <el-upload
             v-if="item.type === 'upload'"
             class="uploader"
@@ -102,7 +102,8 @@
             v-model="data.form.column"
             :options="columns"
             :props="columnProps"
-            clearable></el-cascader>
+            clearable
+            @change="columnChange"></el-cascader>
         </el-form-item>
         <el-form-item label="文章展示数量">
           <el-select v-model="data.form.articleNum">
@@ -118,7 +119,7 @@
           <el-radio v-model="data.form.columnTitle" :label="1">默认读取关联栏目</el-radio>
           <div class="radio-wrap">
             <el-radio v-model="data.form.columnTitle" :label="2"></el-radio>
-            <el-input v-model="data.form.columnTitleCustom" size="small" maxlength="10"></el-input>
+            <el-input v-model="data.form.columnTitleCustom" :disabled="data.form.columnTitle == 1" size="small" maxlength="10"></el-input>
           </div>
         </el-form-item>
       </el-form>
@@ -204,9 +205,11 @@ export default {
   methods: {
     // 处理form表单参数
     handleForm() {
-      const { type, forms } = this.data
+      const { type, forms, form } = this.data
+      console.log("🚀 ~ file: module.vue ~ line 209 ~ handleForm ~ type", this.data, form)
       if (type === 'form') {
         forms.map(e => {
+          // 加必填
           if (e.required) {
             this.rules[e.prop] = [
               {
@@ -218,6 +221,8 @@ export default {
           }
         })
       }
+
+      form && form.site && this.siteChange(form.site)
     },
     // 站点切换回调
     siteChange(siteId) {
@@ -231,9 +236,17 @@ export default {
         this.columns = data
       }).catch(err => {})
     },
+    // 栏目切换回调
+    columnChange(val) {
+      this.data.form.columnName = this.$refs.links.getCheckedNodes()[0].label
+    },
     // 添加行
     addRow() {
-      this.data.list.push(JSON.parse(JSON.stringify(this.data.originForm)))
+      if (this.data.type === 'banner') {
+        this.data.list.push(JSON.parse(JSON.stringify(this.data.originForm)))
+      } else {
+        this.editIntro(this.data.originForm, -1)
+      }
     },
     close() {
       this.$emit('update:visible', false)
@@ -270,32 +283,45 @@ export default {
     contentSubmit() {
       this.contentVisible = false
       const { form } = this.data
-      const list = this.data.list[this.curModule]
-      for (const i in form) {
-        this.$set(list, i, form[i])
+      if (this.curModule === -1) {
+        this.data.list.push(JSON.parse(JSON.stringify(this.data.form)))
+      } else {
+        const list = this.data.list[this.curModule]
+        for (const i in form) {
+          this.$set(list, i, form[i])
+        }
       }
       this.data.form = JSON.parse(JSON.stringify(this.data.originForm))
-      console.log("🚀 ~ file: module.vue ~ line 267 ~ contentSubmit ~ list", this.data)
     },
     // 链接设置提交
     linkSubmit() {
       const el = this.$refs.link
       const data = this.data.form ? this.data.form.link : this.data.list[this.curIndex].link
-      const linkEle = data.connectionType === 1 ?
-        el.$refs.column :
-        data.connectionType === 3 ?
-          el.$refs.otherColumn :
-          null
-      if (data.connectionType !== 2) {
-        if (data.connectionType === 1) {
-          if (!data.columnId.length) return Util.errorMsg('请选择站内链接')
+      let name
+      // 站内链接
+      if (data.connectionType === 1) {
+        if (!data.columnId.length) return Util.errorMsg('请选择站内链接')
+        // 如果选择了文章，则取文章标题作为链接名称，否则取栏目标题
+        if (data.articleId) {
+          const item = el.articles.find(e => e.id == data.articleId)
+          name = item ? item.title : ''
+        } else {
+          name = el.$refs.column.getCheckedNodes()[0].pathLabels.join('/')
         }
-        if (data.connectionType === 3) {
-          if (!data.otherColumnId.length) return Util.errorMsg('请选择栏目')
+      } else if (data.connectionType === 3) { // 其他站点链接
+        if (!data.otherColumnId.length) return Util.errorMsg('请选择栏目')
+        // 如果选择了文章，则取文章标题作为链接名称，否则取栏目标题
+        if (data.otherArticleId) {
+          const item = el.articles.find(e => e.id == data.otherArticleId)
+          name = item ? item.title : ''
+        } else {
+          name = el.$refs.otherColumn.getCheckedNodes()[0].pathLabels.join('/')
         }
+      } else { // 站外链接
+        if (!data.linkAddress) return Util.errorMsg('请输入站外链接')
+        name = data.linkAddress
       }
-      data.linkName = linkEle ? linkEle.getCheckedNodes()[0].pathLabels.join('/') : data.linkAddress
-      console.log("🚀 ~ file: module.vue ~ line 296 ~ linkSubmit ~ data", this.data)
+      data.linkName = name
       this.linkVisible = false
     },
     // 模块设置提交
diff --git a/src/const/column.js b/src/const/column.js
index 88ffb09..9d76159 100644
--- a/src/const/column.js
+++ b/src/const/column.js
@@ -88,12 +88,12 @@ export default {
     {
       id: 5,
       path: 'news',
-      name: 'NEWS&Events'
+      name: 'NEWS&EVENTS'
     },
     {
       id: 6,
       path: 'newsPress',
-      name: 'NEWS&Events-press room'
+      name: 'NEWS&EVENTS-PRESS ROOM'
     }
   ],
 }
\ No newline at end of file
diff --git a/src/mixins/page/index.js b/src/mixins/page/index.js
index ec155ca..80725a1 100644
--- a/src/mixins/page/index.js
+++ b/src/mixins/page/index.js
@@ -25,8 +25,9 @@ export default {
   methods: {
     // 获取详情
     getInfo() {
+      const siteId = this.$store.state.content.site.id
       this.modules.map(e => {
-        const { type, list } = e
+        const { type, list, form } = e
         // 克隆一个原始row，方便添加
         if (type === 'banner' || type === 'introduce') {
           const data = JSON.parse(JSON.stringify(e.form || e.list[0]))
@@ -34,22 +35,14 @@ export default {
             if (typeof data[i] === 'string') data[i] = ''
           }
           e.originForm = data
-        } else if (type === 'columns') {
-          if (!list.length) {
-            // 克隆6个栏目
-            for (let i = 0; i < 6; i++) {
-              e.list.push(JSON.parse(JSON.stringify(e.form)))
-            }
-          }
         }
-        // 克隆一个空值的form
-        // if (e.form) {
-        //   const form = JSON.parse(JSON.stringify(e.form))
-        //   for (const i in form) {
-        //     if (typeof e.form[i] !== 'object') form[i] = ''
-        //   }
-        //   e.originForm = form
-        // }
+        // 站点id默认设置为当前站点
+        e.list && e.list.map(e => {
+          if (e.link && !e.link.site) e.link.site = siteId
+          if (type === 'columns' && !e.site) e.site = siteId
+        })
+        if (form && form.link && !form.link.site) form.link.site = siteId
+        if (form && type === 'column' && !form.site) form.site = siteId
       })
       // 查询页面详情
       this.$post(`${this.api.findPage}?columnId=${this.columnId}`).then(({ data }) => {
@@ -71,14 +64,28 @@ export default {
       this.diaVisible = true
     },
     // 模块设置提交
-    moduleSubmit() {
+    moduleSubmited() {
       this.diaVisible = false
       if (this.curData.type === 'columns') {
-        this.modules[this.curModule].list[this.curListIndex] = JSON.parse(JSON.stringify(this.curData.form))
+        const form = this.curData.form
+        if (form.columnTitle === 2) form.columnName = form.columnTitleCustom
+        this.modules[this.curModule].list[this.curListIndex] = JSON.parse(JSON.stringify(form))
       } else {
         this.modules[this.curModule] = this.curData
       }
     },
+    // 模块设置提交验证
+    moduleSubmit() {
+      const formEle = this.$refs.module.$refs.form
+      // 有表单的要验证必填，没有的直接关闭弹框
+      if (formEle) {
+        formEle.validate((valid) => {
+          valid && this.moduleSubmited()
+        })
+      } else {
+        this.moduleSubmited()
+      }
+    },
     // 处理预览和保存的json
     handleJson() {
       return JSON.stringify(this.modules)
diff --git a/src/pages/account/login/index.vue b/src/pages/account/login/index.vue
index 007ed55..aa51997 100644
--- a/src/pages/account/login/index.vue
+++ b/src/pages/account/login/index.vue
@@ -36,117 +36,117 @@ import util from '@/libs/util'
 import Setting from '@/setting'
 import addRoutes from '@/libs/route/addRoutes'
 export default {
-    data: function() {
-      return {
-        loginForm: {
-          username: "",
-          password: "",
-          captcha: "", // 验证码
-        },
-        loginRules: {
-          username: [{ required: true, message: "请输入账号", trigger: "blur" }],
-          password: [{ required: true, message: "请输入密码", trigger: "blur" }],
-          captcha: [{ required: true, message: "请输入验证码", trigger: "blur" }]
-        },
-        verificationIMG: "",
-        phone: "",
-        phoneCode: "",
-        phoneDisabled: false,
-        phoneTimer: null,
-        phoneBtnText: "发送验证码"
-      };
+  data: function() {
+    return {
+      loginForm: {
+        username: "",
+        password: "",
+        captcha: "", // 验证码
+      },
+      loginRules: {
+        username: [{ required: true, message: "请输入账号", trigger: "blur" }],
+        password: [{ required: true, message: "请输入密码", trigger: "blur" }],
+        captcha: [{ required: true, message: "请输入验证码", trigger: "blur" }]
+      },
+      verificationIMG: "",
+      phone: "",
+      phoneCode: "",
+      phoneDisabled: false,
+      phoneTimer: null,
+      phoneBtnText: "发送验证码"
+    };
+  },
+  mounted() {
+    this.getVerImg()
+    // 页面离开的时候销毁手机和邮箱验证码定时器
+    this.$once("hook:beforeDestroy", function() {
+      clearInterval(this.phoneTimer)
+      this.phoneTimer = null
+    })
+  },
+  methods: {
+    ...mapMutations('user', [
+      'setUserId', 'setUserName'
+    ]),
+    // 获取验证码图片
+    getVerImg() {
+      this.loginForm.random = Math.floor(Math.random() * 999999999);
+      this.verificationIMG = this.api.verification + "?random=" + `${this.loginForm.random}`;
     },
-    mounted() {
-      this.getVerImg()
-      // 页面离开的时候销毁手机和邮箱验证码定时器
-      this.$once("hook:beforeDestroy", function() {
-        clearInterval(this.phoneTimer)
-        this.phoneTimer = null
+    submit() {
+      this.$post(this.api.logins, this.loginForm).then(({ data }) => {
+        util.local.set(Setting.tokenKey, data.accessToken, Setting.tokenExpires)
+        addRoutes(data.permissionList[0].children)
+        util.successMsg('登录成功')
+        this.setUserId(data.id || 1)
+        this.setUserName(data.username)
+        this.$router.push('/site')
+      }).catch(res => {
+        this.getVerImg()
+        this.loginForm.captcha = ''
       })
     },
-    methods: {
-      ...mapMutations('user', [
-        'setUserId', 'setUserName'
-      ]),
-      // 获取验证码图片
-      getVerImg() {
-        this.loginForm.random = Math.floor(Math.random() * 999999999);
-        this.verificationIMG = this.api.verification + "?random=" + `${this.loginForm.random}`;
-      },
-      submit() {
-        this.$post(this.api.logins, this.loginForm).then(({ data }) => {
-          util.local.set(Setting.tokenKey, data.accessToken, Setting.tokenExpires)
-          addRoutes(data.permissionList[0].children)
-          util.successMsg('登录成功')
-          this.setUserId(data.id || 1)
-          this.setUserName(data.username)
-          this.$router.push('/site')
-        }).catch(res => {
-          this.getVerImg()
-          this.loginForm.captcha = ''
-        })
-      },
-      phoneCountdown() {
-          let count = 60;
-          if (!this.phoneTimer) {
-              this.phoneDisabled = true;
-              this.phoneTimer = setInterval(() => {
-                  console.log("倒计时中");
-                  if (count > 0) {
-                      count--;
-                      this.phoneBtnText = `${count}秒后重试`;
-                  } else {
-                      this.phoneDisabled = false;
-                      clearInterval(this.phoneTimer);
-                      this.phoneTimer = null;
-                      this.phoneBtnText = `发送验证码`;
-                  }
-              }, 1000);
-          }
-      },
-      sendPhoneCode() {
-          if (!this.phone) return util.warningMsg("请输入手机号");
-          if (!/^1[3456789]\d{9}$/.test(this.phone)) return util.warningMsg("请输入正确的手机号");
-          let data = {
-              platform: Setting.platformId,
-              phone: this.phone,
-              types: 2
-          };
-          this.$post(this.api.sendPhoneOrEmailCode, data).then(res => {
-              if (res.message.opener) {
-                  this.phoneCountdown();
-                  this.phoneOpener = res.message.opener;
-              } else {
-                  util.errorMsg(res.message);
-              }
-          }).catch(res => {});
-      },
-      phoneSubmit() {
-          if (!this.phone) return util.warningMsg("请输入手机号");
-          if (!/^1[3456789]\d{9}$/.test(this.phone)) return util.warningMsg("请输入正确的手机号");
-          if (!this.phoneCode) return util.warningMsg("请输入验证码");
-          let data = {
-              phone: this.phone,
-              types: 2,
-              captcha: this.phoneCode,
-              opener: this.phoneOpener,
-              platform: Setting.platformId,
-              username: this.loginForm.username
-          };
-          this.$post(this.api.bindPhoneOrEmail, data).then(res => {
-              util.successMsg("绑定成功");
-              this.loginForm.phone = this.phone;
-              this.phoneVisible = false;
+    phoneCountdown() {
+        let count = 60;
+        if (!this.phoneTimer) {
+            this.phoneDisabled = true;
+            this.phoneTimer = setInterval(() => {
+                console.log("倒计时中");
+                if (count > 0) {
+                    count--;
+                    this.phoneBtnText = `${count}秒后重试`;
+                } else {
+                    this.phoneDisabled = false;
+                    clearInterval(this.phoneTimer);
+                    this.phoneTimer = null;
+                    this.phoneBtnText = `发送验证码`;
+                }
+            }, 1000);
+        }
+    },
+    sendPhoneCode() {
+        if (!this.phone) return util.warningMsg("请输入手机号");
+        if (!/^1[3456789]\d{9}$/.test(this.phone)) return util.warningMsg("请输入正确的手机号");
+        let data = {
+            platform: Setting.platformId,
+            phone: this.phone,
+            types: 2
+        };
+        this.$post(this.api.sendPhoneOrEmailCode, data).then(res => {
+            if (res.message.opener) {
+                this.phoneCountdown();
+                this.phoneOpener = res.message.opener;
+            } else {
+                util.errorMsg(res.message);
+            }
+        }).catch(res => {});
+    },
+    phoneSubmit() {
+        if (!this.phone) return util.warningMsg("请输入手机号");
+        if (!/^1[3456789]\d{9}$/.test(this.phone)) return util.warningMsg("请输入正确的手机号");
+        if (!this.phoneCode) return util.warningMsg("请输入验证码");
+        let data = {
+            phone: this.phone,
+            types: 2,
+            captcha: this.phoneCode,
+            opener: this.phoneOpener,
+            platform: Setting.platformId,
+            username: this.loginForm.username
+        };
+        this.$post(this.api.bindPhoneOrEmail, data).then(res => {
+            util.successMsg("绑定成功");
+            this.loginForm.phone = this.phone;
+            this.phoneVisible = false;
 
-              util.local.set(Setting.tokenKey, res.token, Setting.tokenExpires);
-              let redirect = this.$route.query.redirect ? decodeURIComponent(this.$route.query.redirect) : "/index";
-              this.$router.replace(redirect);
-              util.successMsg("登录成功");
-              this.queryCustomer();
-          }).catch(res => {
-          });
-      }
+            util.local.set(Setting.tokenKey, res.token, Setting.tokenExpires);
+            let redirect = this.$route.query.redirect ? decodeURIComponent(this.$route.query.redirect) : "/index";
+            this.$router.replace(redirect);
+            util.successMsg("登录成功");
+            this.queryCustomer();
+        }).catch(res => {
+        });
     }
+  }
 };
 </script>
 <style lang="scss" scoped>
diff --git a/src/pages/article/add/editor.js b/src/pages/article/add/editor.js
index 2c9b536..07efd32 100644
--- a/src/pages/article/add/editor.js
+++ b/src/pages/article/add/editor.js
@@ -5,38 +5,15 @@ export default {
   language:'zh_CN',
   plugins: 'print powerpaste preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media template advcode codesample table charmap hr pagebreak nonbreaking anchor insertdatetime advlist lists wordcount imagetools textpattern help emoticons autosave autoresize formatpainter',
   toolbar: 'code undo redo restoredraft | cut copy powerpaste pastetext | forecolor backcolor bold italic underline strikethrough link anchor | alignleft aligncenter alignright alignjustify outdent indent | \
-    styleselect formatselect fontselect fontsizeselect | bullist numlist | blockquote subscript superscript removeformat | \
+    styleselect fontselect fontsizeselect | bullist numlist | blockquote subscript superscript removeformat | \
     table image media charmap emoticons hr pagebreak insertdatetime print preview | fullscreen | indent2em lineheight formatpainter',
+  // width: 1000,
   height: 650, //编辑器高度
   min_height: 400,
-  // content_css: [ //可设置编辑区内容展示的css，谨慎使用
-  //     '/static/reset.css',
-  // ],
-  content_style: `.mce-content-body:not([dir=rtl]) blockquote {
-    padding: 8px 15px;
-    border-left: 0;
-    background-color: #ededed;
-  } 
-  blockquote p {
-    margin: 0;
-    font-style: italic;
-  }
-  .block {
-    margin-bottom: 20px;
-    overflow: hidden;
-  }
-  .block .fl {
-    float: left;
-    margin-right: 10px;
-  }
-  .block .fr {
-    float: right;
-    margin-left: 10px;
-  }
-  .block p {
-    margin: 0 0 10px;
-  }
-  `,
+  content_css: [ //可设置编辑区内容展示的css，谨慎使用
+    './editor.css',
+  ],
+  // content_style: Style,
   fontsize_formats: '12px 14px 16px 19px 24px 36px 48px 56px 72px',
   font_formats: '微软雅黑=Microsoft YaHei,Helvetica Neue,PingFang SC,sans-serif;苹果苹方=PingFang SC,Microsoft YaHei,sans-serif;宋体=simsun,serif;仿宋体=FangSong,serif;黑体=SimHei,sans-serif;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Book Antiqua=book antiqua,palatino;Comic Sans MS=comic sans ms,sans-serif;Courier New=courier new,courier;Georgia=georgia,palatino;Helvetica=helvetica;Impact=impact,chicago;Symbol=symbol;Tahoma=tahoma,arial,helvetica,sans-serif;Terminal=terminal,monaco;Times New Roman=times new roman,times;Verdana=verdana,geneva;Webdings=webdings;Wingdings=wingdings,zapf dingbats;知乎配置=BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;小米配置=Helvetica Neue,Helvetica,Arial,Microsoft Yahei,Hiragino Sans GB,Heiti SC,WenQuanYi Micro Hei,sans-serif',
   link_list: [
@@ -67,18 +44,67 @@ export default {
   //为内容模板插件提供预置模板
   templates: [
       { title: '文章模板1', description: '图片文字流', content: `
-        <div class="block">
-          <img align="left" hspace="5" vspace="5" src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
-          <div class="texts">
-            <p>S³FEL主要由一台超导直线加速器、波荡器、光束线和实验站组成，可产生重复频率达1MHz、电子束能量达2.5 GeV的软X 射线自由电子激光，可在百飞秒内级实现原子、分子及外壳层电子结构的无损、动态监测，是科学家认识和了解物质微观结构及动态变化的“高速摄像机”。S³FEL为科学家和企业用户提供了一种具有超高时间分辨、空间分辨和能量分辨的新方法、新技术。 S³FEL在量子材料、能源催化、生物医药、大气与星际科学、原子分子科学等领域的应用研究，将为促进我国战略性新兴产业创新发展和关键。
+        <div class="tiny-wrap">
+          <div class="block">
+            <div class="fl">
+              <img src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
+              <p class="img-des">图片描述</p>
+            </div>
+            <div class="texts">
+              <p>S³FEL主要由一台超导直线加速器、波荡器、光束线和实验站组成，可产生重复频率达1MHz、电子束能量达2.5 GeV的软X 射线自由电子激光，可在百飞秒内级实现原子、分子及外壳层电子结构的无损、动态监测，是科学家认识和了解物质微观结构及动态变化的“高速摄像机”。S³FEL为科学家和企业用户提供了一种具有超高时间分辨、空间分辨和能量分辨的新方法、新技术。 S³FEL在量子材料、能源催化、生物医药、大气与星际科学、原子分子科学等领域的应用研究，将为促进我国战略性新兴产业创新发展和关键。S³FEL主要由一台超导直线加速器、波荡器、光束线和实验站组成，可产生重复频率达1MHz、电子束能量达2.5 GeV的软X 射线自由电子激光，可在百飞秒内级实现原子、分子及外壳层电子结构的无损、动态监测，是科学家认识和了解物质微观结构及动态变化的“高速摄像机”。S³FEL为科学家和企业用户提供了一种具有超高时间分辨、空间分辨和能量分辨的新方法、新技术。 S³FEL在量子材料、能源催化、生物医药、大气与星际科学、原子分子科学等领域的应用研究，将为促进我国战略性新兴产业创新发展和关键。S³FEL主要由一台超导直线加速器、波荡器、光束线和实验站组成，可产生重复频率达1MHz、电子束能量达2.5 GeV的软X 射线自由电子激光，可在百飞秒内级实现原子、分子及外壳层电子结构的无损、动态监测，是科学家认识和了解物质微观结构及动态变化的“高速摄像机”。S³FEL为科学家和企业用户提供了一种具有超高时间分辨、空间分辨和能量分辨的新方法、新技术。 S³FEL在量子材料、能源催化、生物医药、大气与星际科学、原子分子科学等领域的应用研究，将为促进我国战略性新兴产业创新发展和关键。S³FEL主要由一台超导直线加速器、波荡器、光束线和实验站组成，可产生重复频率达1MHz、电子束能量达2.5 GeV的软X 射线自由电子激光，可在百飞秒内级实现原子、分子及外壳层电子结构的无损、动态监测，是科学家认识和了解物质微观结构及动态变化的“高速摄像机”。S³FEL在量子材料、能源催化、生物医药、大气与星际科学、原子分子科学等领域的应用研究，将为促进我国战略性新兴产业创新发展和关键。S³FEL主要由一台超导直线加速器、波荡器、光束线和实验站组成，可产生重复频率达1MHz、电子束能量达2.5 GeV的软X 射线自由电子激光，可在百飞秒内级实现原子、分子及外壳层电子结构的无损、动态监测，是科学家认识和了解物质微观结构及动态变化的“高速摄像机”。
+              </p>
+            </div>
+          </div>
+          <div class="block">
+            <div class="fr">
+              <img src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
+              <p class="img-des">图片描述</p>
+            </div>
+            <div>
+              <p>集聚世界前沿和原创性科学技术及产业研发，将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展，营造粤港澳大湾区人才高地，并助力粤港澳大湾区国际科技创新中心的建设。此外， S³FEL作为重要的科普教育基地，</p>
+              <p>S³FEL汇聚并培养信息、生命、材料、能源等学科领域的国际水平科技领军人才，集聚世界前沿和原创性科学技术及产业研发，将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展，营造粤港澳大湾区人才高地，并助力粤港澳大湾区国际科技创新中心的建设。此外， S³FEL作为重要的科普教育基地，是展示我国科技实力、提高全民族科学素质和民族自信的重要宣传窗口。 S³FEL主体建筑将成为深圳市地标式建筑，促进提升深圳市的城市形象和国际化知名度。S³FEL汇聚并培养信息、生命、材料、能源等学科领域的国际水平科技领军人才，集聚世界前沿和原创性科学技术及产业研发，将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展，营造粤港澳大湾区人才高地，并助力粤港澳大湾区国际科技创新中心的建设。此外， S³FEL作为重要的科普教育基地，是展示我国科技实力、提高全民族科学素质和民族自信的重要宣传窗口。 S³FEL主体建筑将成为深圳市地标式建筑，促进提升深圳市的城市形象和国际化知名度。S³FEL汇聚并培养信息、生命、材料、能源等学科领域的国际水平科技领军人才，集聚世界前沿和原创性科学技术及产业研发，将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展，营造粤港澳大湾区人才高地，并助力粤港澳大湾区国际科技创新中心的建设。此外， S³FEL作为重要的科普教育基地，是展示我国科技实力、提高全民族科学素质和民族自信的重要宣传窗口。 S³FEL主体建筑将成为深圳市地标式建筑，促进提升深圳市的城市形象和国际化知名度。</p>
+            </div>
+          </div>
+        </div>
+        ` 
+      },
+      { title: '新闻模板', description: '', content: `
+        <div class="tiny-wrap">
+          <div class="block" style="margin-bottom: 70px;">
+            <div class="fr">
+              <img src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
+              <p class="img-des">图片描述</p>
+            </div>
+            <div>
+              <p>S³FEL汇聚并培养信息、生命、材料、能源等学科领域的国际水平科技领军人才，集聚世界前沿和原创性科学技术及产业研发，将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展，营造粤港澳大湾区人才高地，并助力粤港澳大湾区国际科技创新中心的建设。此外， S³FEL作为重要的科普教育基地，是展示我国科技实力、提高全民族科学素质和民族自信的重要宣传窗口。 S³FEL主体建筑将成为深圳市地标式建筑，促进提升深圳市的城市形象和国际化知名度。S³FEL汇聚并培养信息、生命、材料、能源等学科领域的国际水平科技领军人才，集聚世界前沿和原创性科学技术及产业研发，将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展，营造粤港澳大湾区人才高地，并助力粤港澳大湾区国际科技创新中心的建设。此外， S³FEL作为重要的科普教育基地，是展示我国科技实力、提高全民族科学素质和民族自信的重要宣传窗口。 S³FEL主体建筑将成为深圳市地标式建筑，促进提升深圳市的城市形象和国际化知名度。S³FEL汇聚并培养信息、生命、材料、能源等学科领域的国际水平科技领军人才，集聚世界前沿和原创性科学技术及产业研发，将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展，营造粤港澳大湾区人才高地，并助力粤港澳大湾区国际科技创新中心的建设。此外， S³FEL作为重要的科普教育基地，是展示我国科技实力、提高全民族科学素质和民族自信的重要宣传窗口。 S³FEL主体建筑将成为深圳市地标式建筑，促进提升深圳市的城市形象和国际化知名度。</p>
+              <div class="quote">
+                Here is a long quotation here is a long quotation here is a long quotation 
+                here is a long quotation here is a long quotation here is a long quotation 
+                here is a long quotation here is a long quotation here is a long quotation.
+              </div>
+            </div>
+          </div>
+          <div class="block">
+            <div class="img-wrap">
+              <img src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
+              <p class="img-des">图片描述</p>
+            </div>
+            <div class="texts">
+            <h6 class="tiny-title">小标题</h6>
+            <p>S³FEL主要由一台超导直线加速器、波荡器、光束线和实验站组成，可产生重复频率达1MHz、电子束能量达2.5 GeV的软X 射线自由电子激光，可在百飞秒内级实现原子、分子及外壳层电子结构的无损、动态监测，是科学家认识和了解物质微观结构及动态变化的“高速摄像机”。S³FEL为科学家和企业用户提供了一种具有超高时间分辨、空间分辨和能量分辨的新方法、新技术。 S³FEL在量子材料、能源催化、生物医药、大气与星际科学、原子分子科学等领域的应用研究，将为促进我国战略性新兴产业创新发展和关键。S³FEL主要由一台超导直线加速器、波荡器、光束线和实验站组成，可产生重复频率达1MHz、电子束能量达2.5 GeV的软X 射线自由电子激光，可在百飞秒内级实现原子、分子及外壳层电子结构的无损、动态监测，是科学家认识和了解物质微观结构及动态变化的“高速摄像机”。S³FEL为科学家和企业用户提供了一种具有超高时间分辨、空间分辨和能量分辨的新方法、新技术。 S³FEL在量子材料、能源催化、生物医药、大气与星际科学、原子分子科学等领域的应用研究，将为促进我国战略性新兴产业创新发展和关键。
             </p>
+            </div>
           </div>
         </div>
-        <div class="block">
-        <img align="right" hspace="5" vspace="5" src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
-          <div>
-            <p>集聚世界前沿和原创性科学技术及产业研发，将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展，营造粤港澳大湾区人才高地，并助力粤港澳大湾区国际科技创新中心的建设。此外， S³FEL作为重要的科普教育基地，</p>
-            <p>S³FEL汇聚并培养信息、生命、材料、能源等学科领域的国际水平科技领军人才，集聚世界前沿和原创性科学技术及产业研发，将推动一批高水平大学和科研机构的科技人才队伍建设及相关学科的高质量发展，营造粤港澳大湾区人才高地，并助力粤港澳大湾区国际科技创新中心的建设。此外， S³FEL作为重要的科普教育基地，是展示我国科技实力、提高全民族科学素质和民族自信的重要宣传窗口。 S³FEL主体建筑将成为深圳市地标式建筑，促进提升深圳市的城市形象和国际化知名度。</p>
+        ` 
+      },
+      { title: '图片描述', description: '', content: `
+        <div class="tiny-wrap">
+          <div class="block">
+            <div class="img-wrap">
+              <img src="https://tse1-mm.cn.bing.net/th/id/OIP-C._S-t6T2kt-j6ydemeoB1wAHaEs?w=301&h=190&c=7&r=0&o=5&pid=1.7"/>
+              <p class="img-des">图片描述</p>
+            </div>
           </div>
         </div>
         ` 
diff --git a/src/pages/article/add/index.vue b/src/pages/article/add/index.vue
index 18e5b23..8891c66 100644
--- a/src/pages/article/add/index.vue
+++ b/src/pages/article/add/index.vue
@@ -4,11 +4,11 @@
     <el-form :model="form" :rules="rules" class="input-form model" label-width="140px">
       <el-form-item prop="title" label="标题">
         <el-input
-          style="width: 100%"
+          style="width: 940px"
           placeholder="请输入标题"
-          v-model.trim="form.title"
+          v-model="form.title"
           clearable
-          maxlength="15"
+          maxlength="100"
           @change="nameChange"
         ></el-input>
       </el-form-item>
@@ -55,9 +55,10 @@
       </div>
       <el-form-item prop="summary" label="摘要">
         <el-input
-          style="width: 100%"
+          style="width: 940px"
           type="textarea"
           v-model.trim="form.summary"
+          :rows="3"
           clearable
         ></el-input>
       </el-form-item>
@@ -65,16 +66,10 @@
         <el-upload
           class="avatar-uploader"
           accept=".jpg,.png,.jpeg,.gif"
-          :before-upload="beforeUpload"
-          :on-error="uploadError"
-          :on-success="uploadSuccess"
+          :on-change="file => changeFile(file, 0)"
           :show-file-list="false"
           :action="this.api.upload"
-          :data="{
-            quote: form.title,
-            site: site.siteName,
-            uploader: userName
-          }"
+          :auto-upload="false"
         >
           <img v-if="form.titleImg" :src="form.titleImg" class="avatar">
           <div class="uploader-default" v-else>
@@ -83,20 +78,14 @@
           </div>
         </el-upload>
       </el-form-item>
-      <el-form-item prop="bannerImg" label="Banner图" style="flex: 1;">
+      <el-form-item prop="bannerImg" label="Banner图(选填)" style="flex: 1;">
         <el-upload
           class="avatar-uploader avatar-uploader-lg"
           accept=".jpg,.png,.jpeg,.gif"
-          :before-upload="beforeUpload"
-          :on-error="uploadError"
-          :on-success="uploadSuccessBanner"
+          :on-change="file => changeFile(file, 1)"
           :show-file-list="false"
           :action="this.api.upload"
-          :data="{
-            quote: form.title,
-            site: site.siteName,
-            uploader: userName
-          }"
+          :auto-upload="false"
         >
           <img v-if="form.bannerImg" :src="form.bannerImg" class="avatar-lg">
           <div class="uploader-default" v-else>
@@ -135,10 +124,7 @@
         <el-form-item prop="file" label="文件上传">
           <el-upload
             :on-remove="handleRemove"
-            :on-error="uploadError"
             :on-success="uploadSuccessFile"
-            :limit="1"
-            :on-exceed="handleExceed"
             :action="this.api.upload"
             :file-list="fileList"
             :data="{
@@ -207,6 +193,16 @@
       <el-button @click="submit(0)">保存草稿</el-button>
       <el-button @click="$router.back()">取消</el-button>
     </div>
+    <!-- 剪裁组件弹窗 -->
+    <el-dialog title="图片裁剪" append-to-body :visible.sync="cropperModel" width="1100px" :close-on-click-modal="false">
+      <Cropper
+        ref="cropper"
+        :img-file.sync="file"
+        :is-upload="isUpload"
+        :fixed="true"
+        :fixedNumber.sync="fixedNumber"
+        @upload="customUpload" />
+    </el-dialog>
   </div>
 </template>
 <script>
@@ -215,6 +211,8 @@ import ColumnConst from '@/const/column'
 import { mapState } from 'vuex'
 import Editor from '@tinymce/tinymce-vue'
 import editorConfig from './editor'
+import Cropper from '@/components/img-upload/Cropper'
+import Axios from 'axios'
 export default {
     data() {
         return {
@@ -274,6 +272,11 @@ export default {
           editorConfig,
           submiting: false, // 新增编辑防抖标识
           updateTime: 0,
+          cropperModel: false,
+          isUpload: false,
+          fixedNumber: [1.76, 1],
+          file: {}, // 当前被选择的图片文件
+          isBanner: 0
         };
     },
     computed: {
@@ -285,7 +288,8 @@ export default {
       ])
     },
     components: {
-      Editor
+      Editor,
+      Cropper
     },
     watch: {
       // 监听信息是否有更改,有的话页面离开的时候要询问是否要保存
@@ -404,47 +408,105 @@ export default {
           this.nameRepeat = false
         }
       },
-      // 导入前的钩子
-      beforeUpload(file) {
+      // 图片裁剪上传事件
+      customUpload(data) {
+        const blob = this.dataURItoBlob(data)
+        const formData = new FormData()
+        formData.append('file', blob, this.file.name)
+        formData.append('quote', this.form.title)
+        formData.append('site', this.site.siteName)
+        formData.append('uploader', this.userName)
+        this.imgUpload(formData)
+      },
+      // 压缩图片
+      compress(img) {
+        const canvas = document.createElement('canvas')
+        const ctx = canvas.getContext('2d')
+        // let initSize = img.src.length;
+        const width = img.width
+        const height = img.height
+        canvas.width = width
+        canvas.height = height
+        // 铺底色
+        ctx.fillStyle = '#fff'
+        ctx.fillRect(0, 0, canvas.width, canvas.height)
+        ctx.drawImage(img, 0, 0, width, height)
+        // 进行压缩
+        const ndata = canvas.toDataURL('image/jpeg', 0.8)
+        return ndata
+      },
+      // base64转成bolb对象
+      dataURItoBlob(base64Data) {
+        let byteString
+        if (base64Data.split(',')[0].indexOf('base64') >= 0) {
+          byteString = atob(base64Data.split(',')[1])
+        } else {
+          byteString = unescape(base64Data.split(',')[1])
+        }
+        const mimeString = base64Data
+          .split(',')[0]
+          .split(':')[1]
+          .split(';')[0]
+        const ia = new Uint8Array(byteString.length)
+        for (let i = 0; i < byteString.length; i++) {
+          ia[i] = byteString.charCodeAt(i)
+        }
+        return new Blob([ia], {
+          type: mimeString
+        })
+      },
+      // 图片上传到服务器
+      imgUpload(formData) {
+        this.isUpload = true
+        Axios({
+          method: 'post',
+          url: this.api.upload,
+          data: formData,
+          headers: {
+            'Content-Type': 'multipart/form-data'
+          },
+        }).then(({ data }) => {
+          let url = this.form[this.isBanner ? 'bannerImg' : 'titleImg']
+          url && this.$del(this.api.delFile, [url.split('/').pop()]).then(res => {}).catch(e => {}) // 删除替换掉的图片
+          this.form[this.isBanner ? 'bannerImg' : 'titleImg'] = data.url
+        }).catch(res => {})
+        this.$refs.cropper.isDisabled = false
+        this.isUpload = false
+        this.cropperModel = false
+      },
+      // 图片改变钩子
+      changeFile(file, isBanner) {
+        this.fixedNumber = isBanner ? [1, 0.26] : [1.76, 1]
+        this.isBanner = isBanner
         const { size, name } = file
         const ext = name.substring(name.lastIndexOf('.') + 1)
         if (!util.isImg(ext)) {
           this.$message.error('请上传图片！')
           return false
         }
-        if (size / 1024 / 1024 > 1) {
-          this.$message.error('请上传1M以内的图片！')
+        if (size / 1024 / 1024 > 5) {
+          this.$message.error('请上传5M以内的图片！')
           return false
         }
-      },
-      uploadError(err, file, fileList) {
-        this.$message({
-          message: "上传出错，请重试！",
-          type: "error",
-          center: true
+        this.file = file
+        this.cropperModel = true
+        this.$nextTick(() => {
+          this.$refs.cropper.updateImg({
+            url: window.URL.createObjectURL(file.raw),
+            size: file.size
+          })
         })
       },
-      beforeRemove(file, fileList) {
-        return this.$confirm(`确定移除 ${file.name}？`);
-      },
-      handleExceed(files, fileList) {
-        util.errorMsg(`当前限制选择 1 个文件，如需更换，请删除上一个文件再重新选择！`);
-      },
       handleRemove(file, fileList) {
         this.form.file = ''
       },
-      uploadSuccess(res) {
-        let url = this.form.titleImg
-        url && this.$del(this.api.delFile, [url.split('/').pop()]).then(res => {}).catch(e => {})
-        this.form.titleImg = res.url
-      },
       uploadSuccessBanner(res) {
         let url = this.form.bannerImg
         url && this.$del(this.api.delFile, [url.split('/').pop()]).then(res => {}).catch(e => {})
         this.form.bannerImg = res.url
       },
       uploadSuccessFile(res) {
-        this.form.file	 = res.url
+        this.form.file = res.url
       },
       // 预览
       preview() {
diff --git a/src/pages/article/list/index.vue b/src/pages/article/list/index.vue
index 5cfc435..4135bf7 100644
--- a/src/pages/article/list/index.vue
+++ b/src/pages/article/list/index.vue
@@ -3,7 +3,7 @@
     <div style="width: 218px;border-right: 1px solid #EBEDF0">
       <p class="page-name mb">全部栏目</p>
       <div style="height: 504px;overflow: auto">
-        <el-tree ref="column" :data="columns" highlight-current :expand-on-click-node="false" default-expand-all :props="defaultProps" node-key="id" @node-click="getData"></el-tree>
+        <el-tree ref="column" :data="columns" highlight-current :expand-on-click-node="false" default-expand-all :props="defaultProps" node-key="id" @node-click="initData"></el-tree>
       </div>
     </div>
     <div class="p-l-20" style="width: calc(100% - 219px);">
@@ -238,33 +238,22 @@ export default {
         this.page = 1
         this.getData()
       },
-      batchDel() { // 批量删除
-          if (this.multipleSelection.length) {
-              this.$confirm("确定要删除选中用户吗？", "提示", {
-                  type: "warning"
-              }).then(() => {
-                  let ids = this.multipleSelection.map(item => {
-                      return item.accountId;
-                  });
-                  this.$post(`${this.api.delStudent}?accountIds=${ids.toString()}`).then(res => {
-                      this.multipleSelection = [];
-                      this.$refs.table.clearSelection();
-                      util.successMsg("删除成功");
-                      if (this.studentType) {
-                          this.getData();
-                      } else {
-                          this.getOrgStudentData();
-                      }
-                  }).catch(res => {
-                  });
-                  if(this.multipleSelection.length === this.list.length && this.page>1) {
-                      this.handleCurrentChange(this.page - 1)
-                  }
-              }).catch(() => {
-              });
-          } else {
-              util.errorMsg("请先选择数据 ！");
-          }
+      // 批量删除
+      batchDel() {
+        const list = this.multipleSelection
+        if (list.length) {
+          this.$confirm('确定要删除吗？', '提示', {
+            type: 'warning'
+          }).then(() => {
+            // this.$del(`${this.api.user}`, list.map(e => e.id)).then(res => {
+            //   this.$refs.table.clearSelection()
+            //   util.successMsg('删除成功')
+            //   this.getStaff()
+            // }).catch(res => {})
+          }).catch(() => {})
+        } else {
+          util.errorMsg('请先选择数据 ！')
+        }
       },
       // 删除
       handleDelete(row) {
@@ -285,7 +274,7 @@ export default {
       },
       // 预览
       preview(row) {
-        window.open(`http://192.168.31.${Setting.isDev ? 126 : 136}:8095/#/article?id=` + row.id)
+        window.open((Setting.isDev ? `http://${location.hostname}:8095` : 'http://192.168.31.136') + `/#/article?id=` + row.id)
       },
       // 编辑
       edit(row) {
diff --git a/src/pages/column/add/index.vue b/src/pages/column/add/index.vue
index 5d5bf46..e9b9f88 100644
--- a/src/pages/column/add/index.vue
+++ b/src/pages/column/add/index.vue
@@ -6,9 +6,9 @@
         <el-form-item prop="columnName" label="栏目名称">
           <el-input
             placeholder="请输入栏目名称"
-            v-model.trim="form.columnName"
+            v-model="form.columnName"
             clearable
-            maxlength="15"
+            maxlength="40"
             @change="nameChange"
           ></el-input>
         </el-form-item>
@@ -48,17 +48,10 @@
           <el-upload
             class="avatar-uploader avatar-uploader-lg"
             accept=".jpg,.png,.jpeg,.gif"
-            :before-upload="beforeUpload"
-            :on-remove="handleRemove"
-            :on-error="uploadError"
-            :on-success="uploadSuccess"
+            :on-change="changeFile"
             :show-file-list="false"
             :action="this.api.upload"
-            :data="{
-              quote: form.columnName,
-              site: site.siteName,
-              uploader: userName
-            }"
+            :auto-upload="false"
           >
             <img v-if="form.columnBanner" :src="form.columnBanner" class="avatar-lg">
             <div class="uploader-default" v-else>
@@ -66,7 +59,7 @@
               <p>点击上传</p>
             </div>
             <div slot="tip" class="el-upload__tip">
-              <p>请上传1920x500PX，1M以内的jpg，bmp，png格式</p>
+              <p>请上传1920x500PX，5M以内的jpg，bmp，png格式</p>
             </div>
           </el-upload>
         </el-form-item>
@@ -215,11 +208,11 @@
       <el-button @click="$router.push('/column')">取消</el-button>
     </div>
     <!-- 剪裁组件弹窗 -->
-    <el-dialog append-to-body :visible.sync="cropperModel" width="1100px">
+    <el-dialog title="图片裁剪" append-to-body :visible.sync="cropperModel" width="1100px" :close-on-click-modal="false">
       <Cropper
-        ref="vueCropper"
+        ref="cropper"
+        :img-file.sync="file"
         :is-upload="isUpload"
-        :img-file="file"
         :fixed="true"
         @upload="customUpload" />
     </el-dialog>
@@ -475,15 +468,54 @@ export default {
           this.nameRepeat = false
         }
       },
+      // 图片裁剪上传事件
       customUpload(data) {
-        // 自定义upload事件
-        // console.log(data);
-        // let _data = this.compress(img);
         const blob = this.dataURItoBlob(data)
         const formData = new FormData()
-        formData.append('file', blob, this.file.name) // 有的后台需要传文件名，不然会报错
+        formData.append('file', blob, this.file.name)
+        formData.append('quote', this.form.columnName)
+        formData.append('site', this.site.siteName)
+        formData.append('uploader', this.userName)
         this.imgUpload(formData)
       },
+      // 压缩图片
+      compress(img) {
+        const canvas = document.createElement('canvas')
+        const ctx = canvas.getContext('2d')
+        // let initSize = img.src.length;
+        const width = img.width
+        const height = img.height
+        canvas.width = width
+        canvas.height = height
+        // 铺底色
+        ctx.fillStyle = '#fff'
+        ctx.fillRect(0, 0, canvas.width, canvas.height)
+        ctx.drawImage(img, 0, 0, width, height)
+        // 进行压缩
+        const ndata = canvas.toDataURL('image/jpeg', 0.8)
+        return ndata
+      },
+      // base64转成bolb对象
+      dataURItoBlob(base64Data) {
+        let byteString
+        if (base64Data.split(',')[0].indexOf('base64') >= 0) {
+          byteString = atob(base64Data.split(',')[1])
+        } else {
+          byteString = unescape(base64Data.split(',')[1])
+        }
+        const mimeString = base64Data
+          .split(',')[0]
+          .split(':')[1]
+          .split(';')[0]
+        const ia = new Uint8Array(byteString.length)
+        for (let i = 0; i < byteString.length; i++) {
+          ia[i] = byteString.charCodeAt(i)
+        }
+        return new Blob([ia], {
+          type: mimeString
+        })
+      },
+      // 图片上传到服务器
       imgUpload(formData) {
         this.isUpload = true
         Axios({
@@ -494,52 +526,36 @@ export default {
             'Content-Type': 'multipart/form-data'
           },
         }).then(({ data }) => {
-          
+          let url = this.form.columnBanner
+          url && this.$del(this.api.delFile, [url.split('/').pop()]).then(res => {}).catch(e => {}) // 删除替换掉的图片
+          this.form.columnBanner = data.url
+          this.fileId = data.id
         }).catch(res => {})
-        // this.$api[this.uploadMethodName]({
-        //   data: formData,
-        //   showLoading: false
-        // }).then(res => {
-        //   // 上传成功将照片传回父组件
-        //   console.log(this.uploadList)
-        //   this.uploadList = this.isSingle ? res : this.uploadList.concat(res)
-        //   this.uploadList.forEach(item => {
-        //     item.name = item.fileId
-        //     item.url = `/common-service/file/downloadFileFromOSS?key=${item.fileId}`
-        //   })
-        // }).catch(() => {})
+        this.$refs.cropper.isDisabled = false
         this.isUpload = false
         this.cropperModel = false
       },
-      // 导入前的钩子
-      beforeUpload(file) {
+      // 图片改变钩子
+      changeFile(file) {
         const { size, name } = file
         const ext = name.substring(name.lastIndexOf('.') + 1)
         if (!util.isImg(ext)) {
           this.$message.error('请上传图片！')
           return false
         }
-        if (size / 1024 / 1024 > 1) {
-          this.$message.error('请上传1M以内的图片！')
+        if (size / 1024 / 1024 > 5) {
+          this.$message.error('请上传5M以内的图片！')
           return false
         }
-      },
-      uploadError(err, file, fileList) {
-        this.$message({
-          message: "上传出错，请重试！",
-          type: "error",
-          center: true
+        this.file = file
+        this.cropperModel = true
+        this.$nextTick(() => {
+          this.$refs.cropper.updateImg({
+            url: window.URL.createObjectURL(file.raw),
+            size: file.size
+          })
         })
       },
-      handleRemove(file, fileList) {
-        this.form.columnBanner = ''
-      },
-      uploadSuccess(res) {
-        let url = this.form.columnBanner
-        url && this.$del(this.api.delFile, [url.split('/').pop()]).then(res => {}).catch(e => {})
-        this.form.columnBanner = res.url
-        this.fileId = res.id
-      },
       // 预览
       preview() {
 
diff --git a/src/pages/column/list/index.vue b/src/pages/column/list/index.vue
index 4c6630a..6d90a18 100644
--- a/src/pages/column/list/index.vue
+++ b/src/pages/column/list/index.vue
@@ -17,7 +17,7 @@
           </el-dropdown-menu>
         </el-dropdown>
         <el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:新增'" type="primary" @click="add" >新增</el-button>
-        <el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:删除'" @click="batchDel">删除</el-button>
+        <!-- <el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:删除'" @click="batchDel">删除</el-button> -->
         <el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:更改排序'" class="lg" @click="sort">更改排序</el-button>
         <el-button v-auth="'/site/list:' + siteName + ':内容管理:栏目管理:导航样式设置'" class="lg" @click="styleSet">导航样式设置</el-button>
       </div>
@@ -290,11 +290,11 @@ export default {
           this.$confirm('确定要删除吗？', '提示', {
             type: 'warning'
           }).then(() => {
-            this.$del(`${this.api.user}`, list.map(e => e.id)).then(res => {
-              this.$refs.table.clearSelection()
-              util.successMsg('删除成功')
-              this.getStaff()
-            }).catch(res => {})
+            // this.$del(`${this.api.user}`, list.map(e => e.id)).then(res => {
+            //   this.$refs.table.clearSelection()
+            //   util.successMsg('删除成功')
+            //   this.getStaff()
+            // }).catch(res => {})
           }).catch(() => {})
         } else {
           util.errorMsg('请先选择数据 ！')
@@ -326,7 +326,7 @@ export default {
           columnName: '',
           templateId: '',
           typeId	: '',
-          isSort: 1
+          isSort: 0
         }).then(({ data }) => {
           this.sortColumns = data
         }).catch(err => {})
diff --git a/src/pages/column/page/about.vue b/src/pages/column/page/about.vue
index 3ad504f..b72e981 100644
--- a/src/pages/column/page/about.vue
+++ b/src/pages/column/page/about.vue
@@ -7,189 +7,192 @@
       <el-button @click="$router.back()">放弃编辑</el-button>
     </div>
 
-    <div class="relative">
-      <el-carousel height="480px">
-        <template v-for="(item, i) in modules[0].list">
-          <el-carousel-item v-if="item.pic" :key="i">
-            <img width="100%" height="100%" :src="item.pic" alt="">
-          </el-carousel-item>
-        </template>
-      </el-carousel>
-      <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
-    </div>
-    
-    <div class="block history gray">
-      <div class="inner c-wrap">
-        <h2 style="margin-left: 57px">{{ modules[1].form.title }}</h2>
-        <div class="texts">
-          <div class="left">
-            <h2>{{ modules[1].form.subTitle }}</h2>
-            <div class="line"></div>
-            <div class="des">{{ modules[1].form.des }}</div>
+    <div class="modules">
+      <p class="page-name mb">页面设置</p>
+      <div class="relative">
+        <el-carousel height="480px">
+          <template v-for="(item, i) in modules[0].list">
+            <el-carousel-item v-if="item.pic" :key="i">
+              <img width="100%" height="100%" :src="item.pic" alt="">
+            </el-carousel-item>
+          </template>
+        </el-carousel>
+        <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
+      </div>
+      
+      <div class="block history gray">
+        <div class="inner c-wrap">
+          <h2 style="margin-left: 57px">{{ modules[1].form.title }}</h2>
+          <div class="texts">
+            <div class="left">
+              <h2>{{ modules[1].form.subTitle }}</h2>
+              <div class="line"></div>
+              <div class="des">{{ modules[1].form.des }}</div>
+            </div>
+            <img class="bg" width="562" height="506" :src="modules[1].form.pic" alt="">
           </div>
-          <img class="bg" width="562" height="506" :src="modules[1].form.pic" alt="">
+          <div class="cover" @click="toSet(1)">点击更改图片、标题概述与链接</div>
         </div>
-        <div class="cover" @click="toSet(1)">点击更改图片、标题概述与链接</div>
       </div>
-    </div>
 
-    <div class="block">
-      <div class="inner">
-        <div class="c-wrap">
-          <h2 class="b-title">{{ modules[2].form.title }}</h2>
-          <p class="intro">{{ modules[2].form.des }}</p>
-          <div class="cover" @click="toSet(2)">点击更换标题与描述</div>
+      <div class="block">
+        <div class="inner">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[2].form.title }}</h2>
+            <p class="intro">{{ modules[2].form.des }}</p>
+            <div class="cover" @click="toSet(2)">点击更换标题与描述</div>
+          </div>
+          <ul class="card">
+            <li class="item1">
+              <h6>{{ modules[3].form.title }}</h6>
+              <div class="des" v-html="modules[3].form.des"></div>
+              <div class="cover" @click="toSet(3)">点击更换标题、概述与跳转</div>
+            </li>
+            <li class="item2">
+              <h6>{{ modules[4].form.title }}</h6>
+              <div class="des" v-html="modules[4].form.des"></div>
+              <div class="cover" @click="toSet(4)">点击更换标题、概述与跳转</div>
+            </li>
+            <li class="item3">
+              <h6>{{ modules[5].form.title }}</h6>
+              <div class="des" v-html="modules[5].form.des"></div>
+              <div class="cover" @click="toSet(5)">点击更换标题、概述与跳转</div>
+            </li>
+            <li class="item4">
+              <h6>{{ modules[6].form.title }}</h6>
+              <div class="des" v-html="modules[6].form.des"></div>
+              <div class="cover" @click="toSet(6)">点击更换标题、概述与跳转</div>
+            </li>
+          </ul>
         </div>
-        <ul class="card">
-          <li class="item1">
-            <h6>{{ modules[3].form.title }}</h6>
-            <div class="des" v-html="modules[3].form.des"></div>
-            <div class="cover" @click="toSet(3)">点击更换标题、概述与跳转</div>
-          </li>
-          <li class="item2">
-            <h6>{{ modules[4].form.title }}</h6>
-            <div class="des" v-html="modules[4].form.des"></div>
-            <div class="cover" @click="toSet(4)">点击更换标题、概述与跳转</div>
-          </li>
-          <li class="item3">
-            <h6>{{ modules[5].form.title }}</h6>
-            <div class="des" v-html="modules[5].form.des"></div>
-            <div class="cover" @click="toSet(5)">点击更换标题、概述与跳转</div>
-          </li>
-          <li class="item4">
-            <h6>{{ modules[6].form.title }}</h6>
-            <div class="des" v-html="modules[6].form.des"></div>
-            <div class="cover" @click="toSet(6)">点击更换标题、概述与跳转</div>
-          </li>
-        </ul>
       </div>
-    </div>
 
-    <div class="block gray">
-      <div class="inner">
-        <div class="c-wrap">
-          <h2 class="b-title">{{ modules[7].form.title }}</h2>
-          <p class="intro">{{ modules[7].form.des }}</p>
-          <div class="cover" @click="toSet(7)">点击更换标题与描述</div>
+      <div class="block gray">
+        <div class="inner">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[7].form.title }}</h2>
+            <p class="intro">{{ modules[7].form.des }}</p>
+            <div class="cover" @click="toSet(7)">点击更换标题与描述</div>
+          </div>
+          <ul class="stat">
+            <li>
+              <p class="num">{{ modules[8].form.title }}</p>
+              <p class="text">{{ modules[8].form.des }}</p>
+              <div class="cover" @click="toSet(8)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <p class="num">{{ modules[9].form.title }}</p>
+              <p class="text">{{ modules[9].form.des }}</p>
+              <div class="cover" @click="toSet(9)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <p class="num">{{ modules[10].form.title }}</p>
+              <p class="text">{{ modules[10].form.des }}</p>
+              <div class="cover" @click="toSet(10)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <p class="num">{{ modules[11].form.title }}</p>
+              <p class="text">{{ modules[11].form.des }}</p>
+              <div class="cover" @click="toSet(11)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <p class="num">{{ modules[12].form.title }}</p>
+              <p class="text">{{ modules[12].form.des }}</p>
+              <div class="cover" @click="toSet(12)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <p class="num">{{ modules[13].form.title }}</p>
+              <p class="text">{{ modules[13].form.des }}</p>
+              <div class="cover" @click="toSet(13)">点击更换标题与描述</div>
+            </li>
+          </ul>
         </div>
-        <ul class="stat">
-          <li>
-            <p class="num">{{ modules[8].form.title }}</p>
-            <p class="text">{{ modules[8].form.des }}</p>
-            <div class="cover" @click="toSet(8)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <p class="num">{{ modules[9].form.title }}</p>
-            <p class="text">{{ modules[9].form.des }}</p>
-            <div class="cover" @click="toSet(9)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <p class="num">{{ modules[10].form.title }}</p>
-            <p class="text">{{ modules[10].form.des }}</p>
-            <div class="cover" @click="toSet(10)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <p class="num">{{ modules[11].form.title }}</p>
-            <p class="text">{{ modules[11].form.des }}</p>
-            <div class="cover" @click="toSet(11)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <p class="num">{{ modules[12].form.title }}</p>
-            <p class="text">{{ modules[12].form.des }}</p>
-            <div class="cover" @click="toSet(12)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <p class="num">{{ modules[13].form.title }}</p>
-            <p class="text">{{ modules[13].form.des }}</p>
-            <div class="cover" @click="toSet(13)">点击更换标题与描述</div>
-          </li>
-        </ul>
       </div>
-    </div>
 
-    <div class="plan">
-      <div class="inner c-wrap">
-        <img class="pic" :src="modules[14].form.pic" alt="">
-        <div class="texts">
-          <h6>{{ modules[14].form.title }}</h6>
-          <div class="des">{{ modules[14].form.des }}</div>
-          <img src="@/assets/images/arrow-white.png" alt="">
+      <div class="plan">
+        <div class="inner c-wrap">
+          <img class="pic" :src="modules[14].form.pic" alt="">
+          <div class="texts">
+            <h6>{{ modules[14].form.title }}</h6>
+            <div class="des">{{ modules[14].form.des }}</div>
+            <img src="@/assets/images/arrow-white.png" alt="">
+          </div>
+          <div class="cover" @click="toSet(14)">点击更换标题、概述与跳转</div>
         </div>
-        <div class="cover" @click="toSet(14)">点击更换标题、概述与跳转</div>
       </div>
-    </div>
 
-    <div class="block">
-      <div class="inner">
-        <div class="c-wrap">
-          <h2 class="b-title">{{ modules[15].form.title }}</h2>
-          <p class="intro">{{ modules[15].form.des }}</p>
-          <div class="cover" @click="toSet(15)">点击更换标题与描述</div>
+      <div class="block">
+        <div class="inner">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[15].form.title }}</h2>
+            <p class="intro">{{ modules[15].form.des }}</p>
+            <div class="cover" @click="toSet(15)">点击更换标题与描述</div>
+          </div>
+          <ul class="people">
+            <li v-for="(item, i) in modules[16].list" :key="i">
+              <img class="pic" :src="item.pic" alt="">
+              <div class="texts">
+                <p class="sub">{{ item.title }}</p>
+                <h6>{{ item.subTitle }}</h6>
+                <p class="des">{{ item.des }}</p>
+                <img class="arrow" src="@/assets/images/arrow.png" alt="">
+              </div>
+            </li>
+            <div class="cover" @click="toSet(16)">点击更改图片、标题概述与链接</div>
+          </ul>
         </div>
-        <ul class="people">
-          <li v-for="(item, i) in modules[16].list" :key="i">
-            <img class="pic" :src="item.pic" alt="">
-            <div class="texts">
-              <p class="sub">{{ item.title }}</p>
-              <h6>{{ item.subTitle }}</h6>
-              <p class="des">{{ item.des }}</p>
-              <img class="arrow" src="@/assets/images/arrow.png" alt="">
-            </div>
-          </li>
-          <div class="cover" @click="toSet(16)">点击更改图片、标题概述与链接</div>
-        </ul>
       </div>
-    </div>
 
-    <div class="block list-block gray">
-      <div class="inner">
-        <div class="c-wrap">
-          <h2 class="b-title">{{ modules[17].form.title }}</h2>
-          <p class="intro">{{ modules[17].form.des }}</p>
-          <div class="cover" @click="toSet(17)">点击更换标题与描述</div>
+      <div class="block list-block gray">
+        <div class="inner">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[17].form.title }}</h2>
+            <p class="intro">{{ modules[17].form.des }}</p>
+            <div class="cover" @click="toSet(17)">点击更换标题与描述</div>
+          </div>
+          <ul class="list">
+            <li>
+              <img class="pic" :src="modules[18].form.pic" alt="">
+              <h6>{{ modules[18].form.title }}</h6>
+              <p class="des">{{ modules[18].form.des }}</p>
+              <div class="cover" @click="toSet(18)">点击更改图片、标题概述与链接</div>
+            </li>
+            <li>
+              <img class="pic" :src="modules[19].form.pic" alt="">
+              <h6>{{ modules[19].form.title }}</h6>
+              <p class="des">{{ modules[19].form.des }}</p>
+              <div class="cover" @click="toSet(19)">点击更改图片、标题概述与链接</div>
+            </li>
+            <li>
+              <img class="pic" :src="modules[20].form.pic" alt="">
+              <h6>{{ modules[20].form.title }}</h6>
+              <p class="des">{{ modules[20].form.des }}</p>
+              <div class="cover" @click="toSet(20)">点击更改图片、标题概述与链接</div>
+            </li>
+          </ul>
         </div>
-        <ul class="list">
-          <li>
-            <img class="pic" :src="modules[18].form.pic" alt="">
-            <h6>{{ modules[18].form.title }}</h6>
-            <p class="des">{{ modules[18].form.des }}</p>
-            <div class="cover" @click="toSet(18)">点击更改图片、标题概述与链接</div>
-          </li>
-          <li>
-            <img class="pic" :src="modules[19].form.pic" alt="">
-            <h6>{{ modules[19].form.title }}</h6>
-            <p class="des">{{ modules[19].form.des }}</p>
-            <div class="cover" @click="toSet(19)">点击更改图片、标题概述与链接</div>
-          </li>
-          <li>
-            <img class="pic" :src="modules[20].form.pic" alt="">
-            <h6>{{ modules[20].form.title }}</h6>
-            <p class="des">{{ modules[20].form.des }}</p>
-            <div class="cover" @click="toSet(20)">点击更改图片、标题概述与链接</div>
-          </li>
-        </ul>
       </div>
-    </div>
 
-    <div class="block">
-      <div class="inner">
-        <div class="c-wrap">
-          <h2 class="b-title">{{ modules[21].form.title }}</h2>
-          <p class="intro">{{ modules[21].form.des }}</p>
-          <div class="cover" @click="toSet(21)">点击更换标题与描述</div>
-        </div>
-        <div class="staff">
-          <div class="left">
-            <h6>{{ modules[22].form.title }}</h6>
-            <div class="des">{{ modules[22].form.des }}</div>
+      <div class="block">
+        <div class="inner">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[21].form.title }}</h2>
+            <p class="intro">{{ modules[21].form.des }}</p>
+            <div class="cover" @click="toSet(21)">点击更换标题与描述</div>
+          </div>
+          <div class="staff">
+            <div class="left">
+              <h6>{{ modules[22].form.title }}</h6>
+              <div class="des">{{ modules[22].form.des }}</div>
+            </div>
+            <img class="pic" :src="modules[22].form.pic" alt="">
+            <div class="cover" @click="toSet(22)">点击更改图片、标题概述与链接</div>
           </div>
-          <img class="pic" :src="modules[22].form.pic" alt="">
-          <div class="cover" @click="toSet(22)">点击更改图片、标题概述与链接</div>
         </div>
       </div>
     </div>
 
-    <Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
+    <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
   </div>
 </template>
 
@@ -211,7 +214,7 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
@@ -236,7 +239,7 @@ export default {
               required: true
             },
             {
-              type: 'input',
+              type: 'textarea',
               prop: 'subTitle',
               label: '小标题'
             },
@@ -261,7 +264,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -320,7 +323,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -357,7 +360,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -394,7 +397,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -431,7 +434,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -614,7 +617,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -658,7 +661,7 @@ export default {
               required: true
             },
             {
-              type: 'input',
+              type: 'textarea',
               prop: 'subTitle',
               label: '小标题'
             },
@@ -683,16 +686,17 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
             },
-            des: ''
+            des: '',
+            isEnable: 1
           },
           list: [
             {
-              pic: require('@/assets/images/channel/channel1.png'),
+              pic: require('@/assets/images/about/6.png'),
               title: 'Founder and 1st PRESIDENT OF THE INSTITUTE OF ADVANCED SCIENCE FACILITIES, SHENZHEN',
               subTitle: 'Sun Dongbai',
               link: {
@@ -701,13 +705,49 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
               },
               des: 'Dr. Sun was the executive vice president of Sun Yat- and vice president of the University of Science and Technology Beijing (2008-2017). One of the most widely well-known material scientists aation',
               isEnable: 1
+            },
+            {
+              pic: require('@/assets/images/about/7.png'),
+              title: 'Vice President of the Institute of Advanced Scienc, Shenzhen',
+              subTitle: 'Yang Xueming',
+              link: {
+                linkName: '无',
+                connectionType: 1,
+                columnId: [],
+                articleId: '',
+                linkAddress	: '',
+                site: '',
+                otherColumnId: [],
+                otherArticleId: '',
+                isOpen: 1
+              },
+              des: 'Dr. Yang is a world-recognized physical chemistry scientist, an Academician of the Chinese Academy of Science, an awardee of the National Science Fund for Distinguished Young Scholars',
+              isEnable: 1
+            },
+            {
+              pic: require('@/assets/images/about/8.png'),
+              title: 'The Chairman of Science and Technology Advisory Committee',
+              subTitle: 'Ulf KALSSON',
+              link: {
+                linkName: '无',
+                connectionType: 1,
+                columnId: [],
+                articleId: '',
+                linkAddress	: '',
+                site: '',
+                otherColumnId: [],
+                otherArticleId: '',
+                isOpen: 1
+              },
+              des: 'Dr. Ulf Karlsson is a joint professor of Linköping University and KTH Royal Institute of Technology. He established the laboratory of material science and was the director of the materials science platform',
+              isEnable: 1
             }
           ]
         },
@@ -767,7 +807,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -811,7 +851,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -855,7 +895,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -919,7 +959,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
diff --git a/src/pages/column/page/careers.vue b/src/pages/column/page/careers.vue
index 4cca254..35c4427 100644
--- a/src/pages/column/page/careers.vue
+++ b/src/pages/column/page/careers.vue
@@ -7,103 +7,106 @@
       <el-button @click="$router.back()">放弃编辑</el-button>
     </div>
 
-    <div class="relative">
-      <el-carousel height="480px">
-        <template v-for="(item, i) in modules[0].list">
-          <el-carousel-item v-if="item.pic" :key="i">
-            <img width="100%" height="100%" :src="item.pic" alt="">
-          </el-carousel-item>
-        </template>
-      </el-carousel>
-      <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
-    </div>
-
-    <div class="block">
-      <div class="inner">
-        <ul class="card">
-          <li>
-            <img class="pic" :src="modules[1].form.pic" alt="">
-            <div class="texts">
-              <h6>{{ modules[1].form.title }}</h6>
-              <p class="text">{{ modules[1].form.des }}</p>
-            </div>
-            <div class="arrow">
-              <img src="@/assets/images/arrow-white.png" alt="">
-            </div>
-            <div class="cover" @click="toSet(1)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <img class="pic" :src="modules[2].form.pic" alt="">
-            <div class="texts">
-              <h6>{{ modules[2].form.title }}</h6>
-              <p class="text">{{ modules[2].form.des }}</p>
-            </div>
-            <div class="arrow">
-              <img src="@/assets/images/arrow-white.png" alt="">
-            </div>
-            <div class="cover" @click="toSet(2)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <img class="pic" :src="modules[3].form.pic" alt="">
-            <div class="texts">
-              <h6>{{ modules[3].form.title }}</h6>
-              <p class="text">{{ modules[3].form.des }}</p>
-            </div>
-            <div class="arrow">
-              <img src="@/assets/images/arrow-white.png" alt="">
-            </div>
-            <div class="cover" @click="toSet(3)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <img class="pic" :src="modules[4].form.pic" alt="">
-            <div class="texts">
-              <h6>{{ modules[4].form.title }}</h6>
-              <p class="text">{{ modules[4].form.des }}</p>
-            </div>
-            <div class="arrow">
-              <img src="@/assets/images/arrow-white.png" alt="">
-            </div>
-            <div class="cover" @click="toSet(4)">点击更换标题与描述</div>
-          </li>
-        </ul>
+    <div class="modules">
+      <p class="page-name mb">页面设置</p>
+      <div class="relative">
+        <el-carousel height="480px">
+          <template v-for="(item, i) in modules[0].list">
+            <el-carousel-item v-if="item.pic" :key="i">
+              <img width="100%" height="100%" :src="item.pic" alt="">
+            </el-carousel-item>
+          </template>
+        </el-carousel>
+        <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
       </div>
-    </div>
 
-    <div class="block gray">
-      <div class="inner">
-        <div class="c-wrap">
-          <h2 class="b-title">{{ modules[5].form.title }}</h2>
-          <p class="intro">{{ modules[5].form.des }}</p>
-          <div class="cover" @click="toSet(5)">点击更换标题与描述</div>
+      <div class="block">
+        <div class="inner">
+          <ul class="card">
+            <li>
+              <img class="pic" :src="modules[1].form.pic" alt="">
+              <div class="texts">
+                <h6>{{ modules[1].form.title }}</h6>
+                <p class="text">{{ modules[1].form.des }}</p>
+              </div>
+              <div class="arrow">
+                <img src="@/assets/images/arrow-white.png" alt="">
+              </div>
+              <div class="cover" @click="toSet(1)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <img class="pic" :src="modules[2].form.pic" alt="">
+              <div class="texts">
+                <h6>{{ modules[2].form.title }}</h6>
+                <p class="text">{{ modules[2].form.des }}</p>
+              </div>
+              <div class="arrow">
+                <img src="@/assets/images/arrow-white.png" alt="">
+              </div>
+              <div class="cover" @click="toSet(2)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <img class="pic" :src="modules[3].form.pic" alt="">
+              <div class="texts">
+                <h6>{{ modules[3].form.title }}</h6>
+                <p class="text">{{ modules[3].form.des }}</p>
+              </div>
+              <div class="arrow">
+                <img src="@/assets/images/arrow-white.png" alt="">
+              </div>
+              <div class="cover" @click="toSet(3)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <img class="pic" :src="modules[4].form.pic" alt="">
+              <div class="texts">
+                <h6>{{ modules[4].form.title }}</h6>
+                <p class="text">{{ modules[4].form.des }}</p>
+              </div>
+              <div class="arrow">
+                <img src="@/assets/images/arrow-white.png" alt="">
+              </div>
+              <div class="cover" @click="toSet(4)">点击更换标题与描述</div>
+            </li>
+          </ul>
         </div>
-        <ul class="people">
-          <li v-for="(item, i) in modules[6].list" :key="i">
-            <img class="comma" src="@/assets/images/comma.png" alt="">
-            <div class="left">
-              <h6>{{ item.title }}</h6>
-              <div class="des">{{ item.des }}</div>
-            </div>
-            <img class="pic" :src="item.pic" alt="">
-          </li>
-          <div class="cover" @click="toSet(6)">点击更换标题与描述</div>
-        </ul>
       </div>
-    </div>
 
-    <ul class="shows">
-      <li v-for="(item, i) in modules[7].list" :key="i">
-        <img class="pic" :src="item.pic" alt="">
-        <div class="left">
-          <h6>{{ item.title }}</h6>
-          <div class="sub">{{ item.subTitle }}</div>
-          <div class="des">{{ item.des }}</div>
-          <img class="arrow" src="@/assets/images/arrow-white.png" alt="">
+      <div class="block gray">
+        <div class="inner">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[5].form.title }}</h2>
+            <p class="intro">{{ modules[5].form.des }}</p>
+            <div class="cover" @click="toSet(5)">点击更换标题与描述</div>
+          </div>
+          <ul class="people">
+            <li v-for="(item, i) in modules[6].list" :key="i">
+              <img class="comma" src="@/assets/images/comma.png" alt="">
+              <div class="left">
+                <h6>{{ item.title }}</h6>
+                <div class="des">{{ item.des }}</div>
+              </div>
+              <img class="pic" :src="item.pic" alt="">
+            </li>
+            <div class="cover" @click="toSet(6)">点击更换标题与描述</div>
+          </ul>
         </div>
-      </li>
-      <div class="cover" @click="toSet(7)">点击更换标题与描述</div>
-    </ul>
+      </div>
+
+      <ul class="shows">
+        <li v-for="(item, i) in modules[7].list" :key="i">
+          <img class="pic" :src="item.pic" alt="">
+          <div class="left">
+            <h6>{{ item.title }}</h6>
+            <div class="sub">{{ item.subTitle }}</div>
+            <div class="des">{{ item.des }}</div>
+            <img class="arrow" src="@/assets/images/arrow-white.png" alt="">
+          </div>
+        </li>
+        <div class="cover" @click="toSet(7)">点击更换标题与描述</div>
+      </ul>
+    </div>
     
-    <Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
+    <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
   </div>
 </template>
 
@@ -125,7 +128,7 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
@@ -169,7 +172,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -212,7 +215,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -255,7 +258,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -298,7 +301,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -361,7 +364,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -378,7 +381,41 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
+                otherColumnId: [],
+                otherArticleId: '',
+                isOpen: 1
+              },
+              des: 'Throughout the world, most of the top science and technology innovation centers are distributed in the bay areas, such as the San Francisco Bay area, the New York Bay area, and the Tokyo Bay area in Japan.',
+              isEnable: 1
+            },
+            {
+              pic: require('@/assets/images/careers/7.png'),
+              title: 'IASF started its journey to chase light, push the boundaries forward, and discover the unknown.',
+              link: {
+                linkName: '无',
+                connectionType: 1,
+                columnId: [],
+                articleId: '',
+                linkAddress	: '',
+                site: '',
+                otherColumnId: [],
+                otherArticleId: '',
+                isOpen: 1
+              },
+              des: 'Throughout the world, most of the top science and technology innovation centers are distributed in the bay areas, such as the San Francisco Bay area, the New York Bay area, and the Tokyo Bay area in Japan.',
+              isEnable: 1
+            },
+            {
+              pic: require('@/assets/images/careers/8.png'),
+              title: 'IASF started its journey to chase light, push the boundaries forward, and discover the unknown.',
+              link: {
+                linkName: '无',
+                connectionType: 1,
+                columnId: [],
+                articleId: '',
+                linkAddress	: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
@@ -387,7 +424,8 @@ export default {
               isEnable: 1
             }
           ]
-        },{
+        },
+        {
           type: 'introduce',
           forms: [
             {
@@ -403,7 +441,7 @@ export default {
               required: true
             },
             {
-              type: 'input',
+              type: 'textarea',
               prop: 'subTitle',
               label: '小标题'
             },
@@ -428,7 +466,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -446,7 +484,7 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
diff --git a/src/pages/column/page/edu.vue b/src/pages/column/page/edu.vue
index c8509a3..e71c76e 100644
--- a/src/pages/column/page/edu.vue
+++ b/src/pages/column/page/edu.vue
@@ -7,54 +7,60 @@
       <el-button @click="$router.back()">放弃编辑</el-button>
     </div>
 
-    <div class="relative">
-      <el-carousel height="480px">
-        <template v-for="(item, i) in modules[0].list">
-          <el-carousel-item v-if="item.pic" :key="i">
-            <img width="100%" height="100%" :src="item.pic" alt="">
-          </el-carousel-item>
-        </template>
-      </el-carousel>
-      <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
-    </div>
+    <div class="modules">
+      <p class="page-name mb">页面设置</p>
+      <div class="relative">
+        <el-carousel height="480px">
+          <template v-for="(item, i) in modules[0].list">
+            <el-carousel-item v-if="item.pic" :key="i">
+              <img width="100%" height="100%" :src="item.pic" alt="">
+            </el-carousel-item>
+          </template>
+        </el-carousel>
+        <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
+      </div>
 
-    <div class="block gray">
-      <div class="inner c-wrap">
-        <h2 class="b-title">{{ modules[1].form.title }}</h2>
-        <p class="intro">{{ modules[1].form.des }}</p>
-        <img width="100%" height="536" :src="modules[1].form.pic" alt="">
-        <div class="cover" @click="toSet(1)">点击更改图片、标题概述与链接</div>
+      <div class="block gray">
+        <div class="inner c-wrap">
+          <h2 class="b-title">{{ modules[1].form.title }}</h2>
+          <p class="intro">{{ modules[1].form.des }}</p>
+          <img width="100%" height="536" :src="modules[1].form.pic" alt="">
+          <div class="cover" @click="toSet(1)">点击更改图片、标题概述与链接</div>
+        </div>
       </div>
-    </div>
-    
-    <div class="block">
-      <div class="inner c-wrap">
-        <h2 class="b-title">{{ modules[2].form.title }}</h2>
-        <p class="intro">{{ modules[2].form.des }}</p>
-        <img width="100%" height="536" :src="modules[1].form.pic" alt="">
-        <div class="cover" @click="toSet(2)">点击更改图片、标题概述与链接</div>
+      
+      <div class="block">
+        <div class="inner c-wrap">
+          <h2 class="b-title">{{ modules[2].form.title }}</h2>
+          <p class="intro">{{ modules[2].form.des }}</p>
+          <img width="100%" height="536" :src="modules[1].form.pic" alt="">
+          <div class="cover" @click="toSet(2)">点击更改图片、标题概述与链接</div>
+        </div>
       </div>
-    </div>
-    
-    <div class="block gray">
-      <div class="inner c-wrap">
-        <h2 class="b-title">Engagement</h2>
-        <p class="intro">Serving Community</p>
-        <ul class="list">
-          <li v-for="(item, i) in modules[3].list" :key="i">
-            <img class="pic" :src="item.pic" alt="">
-            <div class="texts">
-              <h6>{{ item.title }}</h6>
-              <p class="sub">{{ item.subTitle }}</p>
-              <div class="des">{{ item.des }}</div>
-            </div>
-          </li>
-        </ul>
-        <div class="cover" @click="toSet(3)">点击更改图片、标题概述与链接</div>
+      
+      <div class="block gray">
+        <div class="inner">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[3].form.title }}</h2>
+            <p class="intro">{{ modules[3].form.des }}</p>
+            <div class="cover" @click="toSet(3)">点击更换标题与描述</div>
+          </div>
+          <ul class="list c-wrap">
+            <li v-for="(item, i) in modules[4].list" :key="i">
+              <img class="pic" :src="item.pic" alt="">
+              <div class="texts">
+                <h6>{{ item.title }}</h6>
+                <p class="sub">{{ item.subTitle }}</p>
+                <div class="des">{{ item.des }}</div>
+              </div>
+            </li>
+            <div class="cover" @click="toSet(4)">点击更改图片、标题概述与链接</div>
+          </ul>
+        </div>
       </div>
     </div>
 
-    <Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
+    <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
   </div>
 </template>
 
@@ -76,7 +82,7 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
@@ -120,7 +126,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -163,7 +169,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -171,6 +177,26 @@ export default {
             des: `Our campus is Shenzhen and Beyound`
           }
         },
+        {
+          type: 'form',
+          forms: [
+            {
+              type: 'input',
+              prop: 'title',
+              label: '标题',
+              required: true
+            },
+            {
+              type: 'textarea',
+              prop: 'des',
+              label: '概述'
+            }
+          ],
+          form: {
+            title: 'Engagement',
+            des: 'Serving Community'
+          }
+        },
         {
           type: 'introduce',
           forms: [
@@ -187,7 +213,7 @@ export default {
               required: true
             },
             {
-              type: 'input',
+              type: 'textarea',
               prop: 'subTitle',
               label: '小标题'
             },
@@ -212,7 +238,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -230,7 +256,7 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
diff --git a/src/pages/column/page/home.vue b/src/pages/column/page/home.vue
index eaed408..9940eb2 100644
--- a/src/pages/column/page/home.vue
+++ b/src/pages/column/page/home.vue
@@ -7,181 +7,184 @@
       <el-button @click="$router.back()">放弃编辑</el-button>
     </div>
 
-    <div class="relative">
-      <el-carousel height="500px">
-        <template v-for="(item, i) in modules[0].list">
-          <el-carousel-item v-if="item.pic" :key="i">
-            <img width="100%" height="100%" :src="item.pic" alt="">
-          </el-carousel-item>
-        </template>
-      </el-carousel>
-      <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
-    </div>
-    
-    <div class="block">
-      <div class="inner">
-        <div class="c-wrap">
-          <h2 class="b-title">{{ modules[1].form.title }}</h2>
-          <p class="intro">{{ modules[1].form.des }}</p>
-          <div class="cover" @click="toSet(1)">点击更换标题与描述</div>
+    <div class="modules">
+      <p class="page-name mb">页面设置</p>
+      <div class="relative">
+        <el-carousel height="500px">
+          <template v-for="(item, i) in modules[0].list">
+            <el-carousel-item v-if="item.pic" :key="i">
+              <img width="100%" height="100%" :src="item.pic" alt="">
+            </el-carousel-item>
+          </template>
+        </el-carousel>
+        <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
+      </div>
+      
+      <div class="block">
+        <div class="inner">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[1].form.title }}</h2>
+            <p class="intro">{{ modules[1].form.des }}</p>
+            <div class="cover" @click="toSet(1)">点击更换标题与描述</div>
+          </div>
+          <ul class="card">
+            <li>
+              <img width="100%" :src="modules[2].form.pic" alt="">
+              <div class="texts">
+                <h6>{{ modules[2].form.title }}</h6>
+                <p class="des">{{ modules[2].form.des }}</p>
+                <img class="arrow" src="@/assets/images/arrow.png" alt="">
+              </div>
+              <div class="cover" @click="toSet(2)">点击更改图片、标题概述与链接</div>
+            </li>
+            <li>
+              <img width="100%" :src="modules[3].form.pic" alt="">
+              <div class="texts">
+                <h6>{{ modules[3].form.title }}</h6>
+                <p class="des">{{ modules[3].form.des }}</p>
+                <img class="arrow" src="@/assets/images/arrow.png" alt="">
+              </div>
+              <div class="cover" @click="toSet(3)">点击更改图片、标题概述与链接</div>
+            </li>
+          </ul>
         </div>
-        <ul class="card">
-          <li>
-            <img width="100%" :src="modules[2].form.pic" alt="">
-            <div class="texts">
-              <h6>{{ modules[2].form.title }}</h6>
-              <p class="des">{{ modules[2].form.des }}</p>
-              <img class="arrow" src="@/assets/images/arrow.png" alt="">
-            </div>
-            <div class="cover" @click="toSet(2)">点击更改图片、标题概述与链接</div>
-          </li>
-          <li>
-            <img width="100%" :src="modules[3].form.pic" alt="">
-            <div class="texts">
-              <h6>{{ modules[3].form.title }}</h6>
-              <p class="des">{{ modules[3].form.des }}</p>
-              <img class="arrow" src="@/assets/images/arrow.png" alt="">
-            </div>
-            <div class="cover" @click="toSet(3)">点击更改图片、标题概述与链接</div>
-          </li>
-        </ul>
       </div>
-    </div>
-    
-    <div class="block news-block">
-      <div class="inner">
-        <div class="c-wrap">
-          <h2 class="b-title">{{ modules[4].form.title }}</h2>
-          <p class="intro">{{ modules[4].form.des }}</p>
-          <div class="cover" @click="toSet(4)">点击更换标题与描述</div>
+      
+      <div class="block news-block">
+        <div class="inner">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[4].form.title }}</h2>
+            <p class="intro">{{ modules[4].form.des }}</p>
+            <div class="cover" @click="toSet(4)">点击更换标题与描述</div>
+          </div>
+          <ul class="news">
+            <li>
+              <img src="@/assets/images/channel/channel1.png" alt="">
+              <div class="texts">
+                <h6>2022 New Year Message from President Sun Dongbai</h6>
+                <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
+                <span class="meta">2022.08.12</span>
+              </div>
+            </li>
+            <li>
+              <img src="@/assets/images/channel/channel1.png" alt="">
+              <div class="texts">
+                <h6>2022 New Year Message from President Sun Dongbai</h6>
+                <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
+                <span class="meta">2022.08.12</span>
+              </div>
+            </li>
+            <li>
+              <img src="@/assets/images/channel/channel1.png" alt="">
+              <div class="texts">
+                <h6>2022 New Year Message from President Sun Dongbai</h6>
+                <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
+                <span class="meta">2022.08.12</span>
+              </div>
+            </li>
+            <li>
+              <img src="@/assets/images/channel/channel1.png" alt="">
+              <div class="texts">
+                <h6>2022 New Year Message from President Sun Dongbai</h6>
+                <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
+                <span class="meta">2022.08.12</span>
+              </div>
+            </li>
+            <li>
+              <img src="@/assets/images/channel/channel1.png" alt="">
+              <div class="texts">
+                <h6>2022 New Year Message from President Sun Dongbai</h6>
+                <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
+                <span class="meta">2022.08.12</span>
+              </div>
+            </li>
+            <li>
+              <img src="@/assets/images/channel/channel1.png" alt="">
+              <div class="texts">
+                <h6>2022 New Year Message from President Sun Dongbai</h6>
+                <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
+                <span class="meta">2022.08.12</span>
+              </div>
+            </li>
+            <div class="cover" @click="toSet(5)">点击更换标题与描述</div>
+          </ul>
         </div>
-        <ul class="news">
-          <li>
-            <img src="@/assets/images/channel/channel1.png" alt="">
-            <div class="texts">
-              <h6>2022 New Year Message from President Sun Dongbai</h6>
-              <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
-              <span class="meta">2022.08.12</span>
-            </div>
-          </li>
-          <li>
-            <img src="@/assets/images/channel/channel1.png" alt="">
-            <div class="texts">
-              <h6>2022 New Year Message from President Sun Dongbai</h6>
-              <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
-              <span class="meta">2022.08.12</span>
-            </div>
-          </li>
-          <li>
-            <img src="@/assets/images/channel/channel1.png" alt="">
-            <div class="texts">
-              <h6>2022 New Year Message from President Sun Dongbai</h6>
-              <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
-              <span class="meta">2022.08.12</span>
-            </div>
-          </li>
-          <li>
-            <img src="@/assets/images/channel/channel1.png" alt="">
-            <div class="texts">
-              <h6>2022 New Year Message from President Sun Dongbai</h6>
-              <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
-              <span class="meta">2022.08.12</span>
-            </div>
-          </li>
-          <li>
-            <img src="@/assets/images/channel/channel1.png" alt="">
-            <div class="texts">
-              <h6>2022 New Year Message from President Sun Dongbai</h6>
-              <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
-              <span class="meta">2022.08.12</span>
-            </div>
-          </li>
-          <li>
-            <img src="@/assets/images/channel/channel1.png" alt="">
-            <div class="texts">
-              <h6>2022 New Year Message from President Sun Dongbai</h6>
-              <p class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</p>
-              <span class="meta">2022.08.12</span>
-            </div>
-          </li>
-          <div class="cover" @click="toSet(5)">点击更换标题与描述</div>
-        </ul>
       </div>
-    </div>
-    
-    <div class="block">
-      <div class="inner">
-        <div class="c-wrap">
-          <h2 class="b-title">{{ modules[6].form.title }}</h2>
-          <p class="intro">{{ modules[6].form.des }}</p>
-          <div class="cover" @click="toSet(6)">点击更换标题与描述</div>
+      
+      <div class="block">
+        <div class="inner">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[6].form.title }}</h2>
+            <p class="intro">{{ modules[6].form.des }}</p>
+            <div class="cover" @click="toSet(6)">点击更换标题与描述</div>
+          </div>
+          <ul class="people">
+            <li v-for="(item, i) in modules[7].list" :key="i">
+              <img class="pic" :src="item.pic" alt="">
+              <div class="texts">
+                <h6>{{ item.title }}</h6>
+                <p class="des">{{ item.des }}</p>
+                <img class="arrow" src="@/assets/images/arrow.png" alt="">
+              </div>
+            </li>
+            <div class="cover" @click="toSet(7)">点击更改图片、标题概述与链接</div>
+          </ul>
         </div>
-        <ul class="people">
-          <li v-for="(item, i) in modules[7].list" :key="i">
-            <img class="pic" :src="item.pic" alt="">
-            <div class="texts">
-              <h6>{{ item.title }}</h6>
-              <p class="des">{{ item.des }}</p>
-              <img class="arrow" src="@/assets/images/arrow.png" alt="">
-            </div>
-          </li>
-          <div class="cover" @click="toSet(7)">点击更改图片、标题概述与链接</div>
-        </ul>
       </div>
-    </div>
 
-    <div class="about">
-      <div class="inner">
-        <img src="@/assets/images/channel/about.png" alt="">
-        <div class="line"></div>
-        <div class="text">{{ modules[8].form.title }}</div>
-        <div class="des" v-html="modules[8].form.des"></div>
+      <div class="about">
+        <div class="inner">
+          <img src="@/assets/images/channel/about.png" alt="">
+          <div class="line"></div>
+          <div class="text">{{ modules[8].form.title }}</div>
+          <div class="des" v-html="modules[8].form.des"></div>
+        </div>
+        <div class="cover" @click="toSet(8)">点击更换标题与描述</div>
       </div>
-      <div class="cover" @click="toSet(8)">点击更换标题与描述</div>
-    </div>
 
-    <div class="block" style="padding-bottom: 0">
-      <div class="inner">
-        <div class="c-wrap">
-          <h2 class="glance">{{ modules[9].form.title }}</h2>
-          <div class="cover" @click="toSet(9)">点击更换标题与描述</div>
+      <div class="block" style="padding-bottom: 0">
+        <div class="inner">
+          <div class="c-wrap">
+            <h2 class="glance">{{ modules[9].form.title }}</h2>
+            <div class="cover" @click="toSet(9)">点击更换标题与描述</div>
+          </div>
+          <ul class="stat">
+            <li>
+              <p class="num">{{ modules[10].form.title }}</p>
+              <p class="text">{{ modules[10].form.des }}</p>
+              <div class="cover" @click="toSet(10)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <p class="num">{{ modules[11].form.title }}</p>
+              <p class="text">{{ modules[11].form.des }}</p>
+              <div class="cover" @click="toSet(11)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <p class="num">{{ modules[12].form.title }}</p>
+              <p class="text">{{ modules[12].form.des }}</p>
+              <div class="cover" @click="toSet(12)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <p class="num">{{ modules[13].form.title }}</p>
+              <p class="text">{{ modules[13].form.des }}</p>
+              <div class="cover" @click="toSet(13)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <p class="num">{{ modules[14].form.title }}</p>
+              <p class="text">{{ modules[14].form.des }}</p>
+              <div class="cover" @click="toSet(14)">点击更换标题与描述</div>
+            </li>
+            <li>
+              <p class="num">{{ modules[15].form.title }}</p>
+              <p class="text">{{ modules[15].form.des }}</p>
+              <div class="cover" @click="toSet(15)">点击更换标题与描述</div>
+            </li>
+          </ul>
         </div>
-        <ul class="stat">
-          <li>
-            <p class="num">{{ modules[10].form.title }}</p>
-            <p class="text">{{ modules[10].form.des }}</p>
-            <div class="cover" @click="toSet(10)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <p class="num">{{ modules[11].form.title }}</p>
-            <p class="text">{{ modules[11].form.des }}</p>
-            <div class="cover" @click="toSet(11)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <p class="num">{{ modules[12].form.title }}</p>
-            <p class="text">{{ modules[12].form.des }}</p>
-            <div class="cover" @click="toSet(12)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <p class="num">{{ modules[13].form.title }}</p>
-            <p class="text">{{ modules[13].form.des }}</p>
-            <div class="cover" @click="toSet(13)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <p class="num">{{ modules[14].form.title }}</p>
-            <p class="text">{{ modules[14].form.des }}</p>
-            <div class="cover" @click="toSet(14)">点击更换标题与描述</div>
-          </li>
-          <li>
-            <p class="num">{{ modules[15].form.title }}</p>
-            <p class="text">{{ modules[15].form.des }}</p>
-            <div class="cover" @click="toSet(15)">点击更换标题与描述</div>
-          </li>
-        </ul>
       </div>
     </div>
 
-    <Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
+    <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
   </div>
 </template>
 
@@ -203,7 +206,7 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
@@ -267,7 +270,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -310,7 +313,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -384,7 +387,7 @@ export default {
               required: true
             },
             {
-              type: 'input',
+              type: 'textarea',
               prop: 'subTitle',
               label: '小标题'
             },
@@ -409,7 +412,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -427,7 +430,7 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
@@ -466,7 +469,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
diff --git a/src/pages/column/page/news.vue b/src/pages/column/page/news.vue
index 1032446..f01a544 100644
--- a/src/pages/column/page/news.vue
+++ b/src/pages/column/page/news.vue
@@ -6,169 +6,169 @@
       <el-button type="primary" @click="save(1)">发布</el-button>
       <el-button @click="$router.back()">放弃编辑</el-button>
     </div>
+    <div class="modules">
+      <p class="page-name mb">页面设置</p>
+      <div class="relative">
+        <el-carousel height="480px">
+          <template v-for="(item, i) in modules[0].list">
+            <el-carousel-item v-if="item.pic" :key="i">
+              <img width="100%" height="100%" :src="item.pic" alt="">
+            </el-carousel-item>
+          </template>
+        </el-carousel>
+        <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
+      </div>
 
-    <div class="relative">
-      <el-carousel height="480px">
-        <template v-for="(item, i) in modules[0].list">
-          <el-carousel-item v-if="item.pic" :key="i">
-            <img width="100%" height="100%" :src="item.pic" alt="">
-          </el-carousel-item>
-        </template>
-      </el-carousel>
-      <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
-    </div>
-
-    <ul class="tabs">
-      <li :class="{active: item.id == active}" v-for="(item, i) in tabs" :key="i">
-        {{ item.name }}
-        <div class="cover" @click="toSet(1, i)">关联栏目</div>
-      </li>
-    </ul>
+      <ul class="tabs">
+        <li :class="{active: item.id == active}" v-for="(item, i) in modules[1].list" :key="i">
+          {{ item.columnName }}
+          <div class="cover" @click="toSet(1, i)">关联栏目</div>
+        </li>
+      </ul>
 
-    <div class="block">
-      <div class="inner">
-        <h2 class="b-title">Seminars & Workshops</h2>
-        <p class="intro">What makes a ligh chinese bay chaser</p>
-        <div class="banner">
-          <img width="100%" height="480" src="@/assets/images/about/5.png" alt="">
-          <div class="right">
-            <h6>IASF is driven to serve the Science and industry, and solve grand challenges through research and innovation. We are open and creative</h6>
-            <div class="des">Innovation centers are distributed in the bay areas, such as the San Francisco Bay area, the New York Bay area, and the Tokyo Bay area in Japan. And the Guangdong-Hong Kong-Macao Greater Bay </div>
-            <p class="meta">2022-07-24 | Research</p>
+      <div class="block">
+        <div class="inner">
+          <div class="banner">
+            <img width="100%" height="480" src="@/assets/images/about/5.png" alt="">
+            <div class="right">
+              <h6>IASF is driven to serve the Science and industry, and solve grand challenges through research and innovation. We are open and creative</h6>
+              <div class="des">Innovation centers are distributed in the bay areas, such as the San Francisco Bay area, the New York Bay area, and the Tokyo Bay area in Japan. And the Guangdong-Hong Kong-Macao Greater Bay </div>
+              <p class="meta">2022-07-24 | Research</p>
+            </div>
           </div>
+          <ul class="card">
+            <li>
+              <img class="pic" src="@/assets/images/about/9.png" alt="">
+              <div class="texts">
+                <p class="meta">2022-09-09 | Research</p>
+                <div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
+                <img class="arrow" src="@/assets/images/arrow.png" alt="">
+              </div>
+            </li>
+            <li>
+              <img class="pic" src="@/assets/images/about/10.png" alt="">
+              <div class="texts">
+                <p class="meta">2022-09-09 | Research</p>
+                <div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
+                <img class="arrow" src="@/assets/images/arrow.png" alt="">
+              </div>
+            </li>
+            <li>
+              <img class="pic" src="@/assets/images/about/11.png" alt="">
+              <div class="texts">
+                <p class="meta">2022-09-09 | Research</p>
+                <div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
+                <img class="arrow" src="@/assets/images/arrow.png" alt="">
+              </div>
+            </li>
+          </ul>
+          <div class="more">More news ></div>
         </div>
-        <ul class="card">
-          <li>
-            <img class="pic" src="@/assets/images/about/9.png" alt="">
-            <div class="texts">
-              <p class="meta">2022-09-09 | Research</p>
-              <div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
-              <img class="arrow" src="@/assets/images/arrow.png" alt="">
-            </div>
-          </li>
-          <li>
-            <img class="pic" src="@/assets/images/about/10.png" alt="">
-            <div class="texts">
-              <p class="meta">2022-09-09 | Research</p>
-              <div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
-              <img class="arrow" src="@/assets/images/arrow.png" alt="">
+      </div>
+
+      <div class="block gray">
+        <div class="inner lg">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[2].form.title }}</h2>
+            <p class="intro">{{ modules[2].form.des }}</p>
+            <div class="cover" @click="toSet(2)">点击更换标题与描述</div>
+          </div>
+          <div class="shop-shows">
+            <div class="left">
+              <img width="100%" height="400" src="@/assets/images/about/5.png" alt="">
+              <div class="texts">
+                <h6>2022 New Year Messag President Sun Dongbai….</h6>
+                <div class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</div>
+              </div>
             </div>
-          </li>
-          <li>
-            <img class="pic" src="@/assets/images/about/11.png" alt="">
-            <div class="texts">
-              <p class="meta">2022-09-09 | Research</p>
-              <div class="des">IASF is driven to serve the Science and industry, and solve grand </div>
-              <img class="arrow" src="@/assets/images/arrow.png" alt="">
+            <div class="right">
+              <ul class="show-card">
+                <li>
+                  <img class="pic" src="@/assets/images/about/9.png" alt="">
+                  <div class="des">Comprises the installation and nanostructuri</div>
+                </li>
+                <li>
+                  <img class="pic" src="@/assets/images/about/10.png" alt="">
+                  <div class="des">Prof. Stephan V. Roth's research</div>
+                </li>
+              </ul>
+              <ul class="card-list">
+                <li>
+                  <img class="pic" src="@/assets/images/about/9.png" alt="">
+                  <div class="texts">
+                    <h6>Hold doctorates or the highest degree in their field</h6>
+                    <div class="des">Characterization in Fibre and Polymer Technology, KTH Royal Institute of Technology.Characteriza Royal Institute of technology.…</div>
+                  </div>
+                </li>
+                <li>
+                  <img class="pic" src="@/assets/images/about/10.png" alt="">
+                  <div class="texts">
+                    <h6>This 2019 image depicted a Centers for Disease</h6>
+                    <div class="des">laboratory technician, dressed in personal protective equipment (PPE), in thelaboratory technician, dressed in personal in the…</div>
+                  </div>
+                </li>
+                <li>
+                  <img class="pic" src="@/assets/images/about/11.png" alt="">
+                  <div class="texts">
+                    <h6>Browse premium related images on iStock</h6>
+                    <div class="des">which would undergo analysis, here, in this laboratory environment.which would undergo analysis, here, in this laboratory environment.…</div>
+                  </div>
+                </li>
+              </ul>
             </div>
-          </li>
-        </ul>
-        <div class="more">More news ></div>
+            <div class="cover" @click="toSet(3)">关联栏目</div>
+          </div>
+        </div>
       </div>
-    </div>
 
-    <div class="block gray">
-      <div class="inner lg">
-        <div class="c-wrap">
-          <h2 class="b-title">{{ modules[2].form.title }}</h2>
-          <p class="intro">{{ modules[2].form.des }}</p>
-          <div class="cover" @click="toSet(2)">点击更换标题与描述</div>
-        </div>
-        <div class="shop-shows">
-          <div class="left">
-            <img width="100%" height="400" src="@/assets/images/about/5.png" alt="">
-            <div class="texts">
-              <h6>2022 New Year Messag President Sun Dongbai….</h6>
-              <div class="des">2021 is another challenging year for the Institute of Advanced Science Facilities, Shenzhen (IASF)…</div>
-            </div>
+      <div class="block conference">
+        <div class="inner lg">
+          <div class="c-wrap">
+            <h2 class="b-title">{{ modules[4].form.title }}</h2>
+            <p class="intro">{{ modules[4].form.des }}</p>
+            <div class="cover" @click="toSet(4)">点击更换标题与描述</div>
           </div>
-          <div class="right">
-            <ul class="show-card">
-              <li>
-                <img class="pic" src="@/assets/images/about/9.png" alt="">
-                <div class="des">Comprises the installation and nanostructuri</div>
-              </li>
-              <li>
-                <img class="pic" src="@/assets/images/about/10.png" alt="">
-                <div class="des">Prof. Stephan V. Roth's research</div>
-              </li>
-            </ul>
-            <ul class="card-list">
-              <li>
-                <img class="pic" src="@/assets/images/about/9.png" alt="">
-                <div class="texts">
-                  <h6>Hold doctorates or the highest degree in their field</h6>
-                  <div class="des">Characterization in Fibre and Polymer Technology, KTH Royal Institute of Technology.Characteriza Royal Institute of technology.…</div>
+          <div class="shows">
+            <div class="left">
+              <img width="100%" height="558" src="@/assets/images/about/5.png" alt="">
+              <div class="texts">
+                <div class="meta">
+                  <p class="date">09</p>
+                  <p class="year">2022-03</p>
                 </div>
-              </li>
-              <li>
-                <img class="pic" src="@/assets/images/about/10.png" alt="">
-                <div class="texts">
-                  <h6>This 2019 image depicted a Centers for Disease</h6>
-                  <div class="des">laboratory technician, dressed in personal protective equipment (PPE), in thelaboratory technician, dressed in personal in the…</div>
+                <div>
+                  <h6>Browse premium related images on iStock</h6>
+                  <div class="des">which would undergo analysis, here, in this laboratory environment.which would undergo analysis, here, in this laboratory environment.…</div>
                 </div>
-              </li>
+              </div>
+            </div>
+            <ul class="card-list">
               <li>
-                <img class="pic" src="@/assets/images/about/11.png" alt="">
+                <img class="pic" src="@/assets/images/about/9.png" alt="">
                 <div class="texts">
-                  <h6>Browse premium related images on iStock</h6>
-                  <div class="des">which would undergo analysis, here, in this laboratory environment.which would undergo analysis, here, in this laboratory environment.…</div>
+                  <h6>Professional technical Free electron laser device</h6>
+                  <p class="text">
+                    <img class="icon" src="@/assets/images/address.png" alt="">
+                    Jiahang Shao
+                  </p>
+                  <p class="text">
+                    <img class="icon" src="@/assets/images/address.png" alt="">
+                    Time: 2022.8.13  14:30
+                  </p>
+                  <p class="text">
+                    <img class="icon" src="@/assets/images/address.png" alt="">
+                    Address: Big conference room on the fourth floor of headquarters
+                  </p>
                 </div>
               </li>
             </ul>
+            <div class="cover" @click="toSet(5)">关联栏目</div>
           </div>
-          <div class="cover" @click="toSet(3)">关联栏目</div>
-        </div>
-      </div>
-    </div>
-
-    <div class="block conference">
-      <div class="inner lg">
-        <div class="c-wrap">
-          <h2 class="b-title">{{ modules[4].form.title }}</h2>
-          <p class="intro">{{ modules[4].form.des }}</p>
-          <div class="cover" @click="toSet(4)">点击更换标题与描述</div>
-        </div>
-        <div class="shows">
-          <div class="left">
-            <img width="100%" height="558" src="@/assets/images/about/5.png" alt="">
-            <div class="texts">
-              <div class="meta">
-                <p class="date">09</p>
-                <p class="year">2022-03</p>
-              </div>
-              <div>
-                <h6>Browse premium related images on iStock</h6>
-                <div class="des">which would undergo analysis, here, in this laboratory environment.which would undergo analysis, here, in this laboratory environment.…</div>
-              </div>
-            </div>
-          </div>
-          <ul class="card-list">
-            <li>
-              <img class="pic" src="@/assets/images/about/9.png" alt="">
-              <div class="texts">
-                <h6>Professional technical Free electron laser device</h6>
-                <p class="text">
-                  <img class="icon" src="@/assets/images/address.png" alt="">
-                  Jiahang Shao
-                </p>
-                <p class="text">
-                  <img class="icon" src="@/assets/images/address.png" alt="">
-                  Time: 2022.8.13  14:30
-                </p>
-                <p class="text">
-                  <img class="icon" src="@/assets/images/address.png" alt="">
-                  Address: Big conference room on the fourth floor of headquarters
-                </p>
-              </div>
-            </li>
-          </ul>
-          <div class="cover" @click="toSet(5)">关联栏目</div>
         </div>
       </div>
     </div>
 
-    <Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
+    <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
   </div>
 </template>
 
@@ -190,7 +190,7 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
@@ -209,7 +209,56 @@ export default {
             columnTitle: 1,
             columnTitleCustom: ''
           },
-          list: []
+          list: [
+            {
+              columnName: 'General news',
+              site: '',
+              column: '',
+              articleNum: '',
+              columnTitle: 1,
+              columnTitleCustom: ''
+            },
+            {
+              columnName: 'Research news',
+              site: '',
+              column: '',
+              articleNum: '',
+              columnTitle: 1,
+              columnTitleCustom: ''
+            },
+            {
+              columnName: 'General news',
+              site: '',
+              column: '',
+              articleNum: '',
+              columnTitle: 1,
+              columnTitleCustom: ''
+            },
+            {
+              columnName: 'General news',
+              site: '',
+              column: '',
+              articleNum: '',
+              columnTitle: 1,
+              columnTitleCustom: ''
+            },
+            {
+              columnName: 'Research news',
+              site: '',
+              column: '',
+              articleNum: '',
+              columnTitle: 1,
+              columnTitleCustom: ''
+            },
+            {
+              columnName: 'Journal covers',
+              site: '',
+              column: '',
+              articleNum: '',
+              columnTitle: 1,
+              columnTitleCustom: ''
+            },
+          ]
         },
         {
           type: 'form',
diff --git a/src/pages/column/page/newsPress.vue b/src/pages/column/page/newsPress.vue
index 8c5a241..8cbd009 100644
--- a/src/pages/column/page/newsPress.vue
+++ b/src/pages/column/page/newsPress.vue
@@ -7,35 +7,38 @@
       <el-button @click="$router.back()">放弃编辑</el-button>
     </div>
 
-    <div class="relative">
-      <el-carousel height="480px">
-        <template v-for="(item, i) in modules[0].list">
-          <el-carousel-item v-if="item.pic" :key="i">
-            <img width="100%" height="100%" :src="item.pic" alt="">
-          </el-carousel-item>
-        </template>
-      </el-carousel>
-      <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
-    </div>
+    <div class="modules">
+      <p class="page-name mb">页面设置</p>
+      <div class="relative">
+        <el-carousel height="480px">
+          <template v-for="(item, i) in modules[0].list">
+            <el-carousel-item v-if="item.pic" :key="i">
+              <img width="100%" height="100%" :src="item.pic" alt="">
+            </el-carousel-item>
+          </template>
+        </el-carousel>
+        <div class="cover" @click="toSet(0)">点击更换banner与链接</div>
+      </div>
 
-    <div class="block">
-      <div class="inner c-wrap">
-        <ul class="list">
-          <li v-for="(item, i) in modules[1].list" :key="i">
-            <img class="pic" :src="item.pic" alt="">
-            <div class="texts">
-              <h6>{{ item.title }}</h6>
-              <p class="sub">{{ item.subTitle }}</p>
-              <div class="des">{{ item.des }}</div>
-              <img src="@/assets/images/arrow.png" alt="">
-            </div>
-          </li>
-        </ul>
-        <div class="cover" @click="toSet(1)">点击更改图片、标题概述与链接</div>
+      <div class="block">
+        <div class="inner c-wrap">
+          <ul class="list">
+            <li v-for="(item, i) in modules[1].list" :key="i">
+              <img class="pic" :src="item.pic" alt="">
+              <div class="texts">
+                <h6>{{ item.title }}</h6>
+                <p class="sub">{{ item.subTitle }}</p>
+                <div class="des">{{ item.des }}</div>
+                <img src="@/assets/images/arrow.png" alt="">
+              </div>
+            </li>
+          </ul>
+          <div class="cover" @click="toSet(1)">点击更改图片、标题概述与链接</div>
+        </div>
       </div>
     </div>
 
-    <Module :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
+    <Module ref="module" :data.sync="curData" :visible.sync="diaVisible" @moduleSubmit="moduleSubmit" />
   </div>
 </template>
 
@@ -57,7 +60,7 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
@@ -82,7 +85,7 @@ export default {
               required: true
             },
             {
-              type: 'input',
+              type: 'textarea',
               prop: 'subTitle',
               label: '小标题'
             },
@@ -107,7 +110,7 @@ export default {
               columnId: [],
               articleId: '',
               linkAddress	: '',
-              siteSelection: '',
+              site: '',
               otherColumnId: [],
               otherArticleId: '',
               isOpen: 1
@@ -125,7 +128,7 @@ export default {
                 columnId: [],
                 articleId: '',
                 linkAddress	: '',
-                siteSelection: '',
+                site: '',
                 otherColumnId: [],
                 otherArticleId: '',
                 isOpen: 1
diff --git a/src/pages/user/list/index.vue b/src/pages/user/list/index.vue
index 5d8ff1f..0542175 100644
--- a/src/pages/user/list/index.vue
+++ b/src/pages/user/list/index.vue
@@ -509,9 +509,8 @@ export default {
       },
       // 点击树节点查询列表数据
       handleNodeClick(data) {
-        this.$refs.table.clearSelection()
         this.staffType = null
-        this.getStaff()
+        this.initData()
       },
       // 关闭组织新增编辑弹框
       closeOrg() {
diff --git a/src/router/permission.js b/src/router/permission.js
index f68ddf8..94bc7e8 100644
--- a/src/router/permission.js
+++ b/src/router/permission.js
@@ -8,6 +8,8 @@ router.beforeEach((to, from, next) => {
   const role = util.local.get(Setting.tokenKey)
   if (!role && !whiteList.includes(to.path)) {
     next('/login')
+  } else if (role && to.path === '/login') {
+    next('/site')
   } else {
     next()
   }
diff --git a/src/styles/common.scss b/src/styles/common.scss
index 2c795d4..c584702 100644
--- a/src/styles/common.scss
+++ b/src/styles/common.scss
@@ -39,17 +39,18 @@
     border-radius: 0;
   }
 }
+.page-name {
+  font-size: 16px;
+  font-weight: 600;
+  color: #333;
+  &.mb {
+    margin-bottom: 16px;
+  }
+}
 .page {
   position: relative;
   padding: 16px 20px;
   background-color: #fff;
-  .page-name {
-    font-size: 14px;
-    color: #333;
-    &.mb {
-      margin-bottom: 16px;
-    }
-  }
   .tool {
     display: flex;
     justify-content: space-between;
diff --git a/src/styles/page/page.scss b/src/styles/page/page.scss
index 6d280b1..e198c4a 100644
--- a/src/styles/page/page.scss
+++ b/src/styles/page/page.scss
@@ -37,6 +37,10 @@
   background-color: #F2F6F8;
 }
 
+.modules {
+  height: calc(100vh - 160px);
+  overflow: auto;
+}
 .actions {
   margin-bottom: 20px;
   text-align: right;
@@ -70,9 +74,10 @@
       display: flex;
       justify-content: space-between;
       align-items: center;
+      flex-direction: column;
     }
     .set-link {
-      margin-left: 10px;
+      margin-top: 5px;
     }
     .del {
       margin-left: 5px;