From da7d4f086f8f1f7b0d22e93dd78b7d912cd2aa67 Mon Sep 17 00:00:00 2001
From: song <srf428110@163.com>
Date: Thu, 24 Feb 2022 14:56:36 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AF=A6=E6=83=85=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .npmrc                                    |   1 +
 src/components/Banner/index.vue           |   4 +-
 src/components/Detail/addOrEdit.vue       |  55 +++-
 src/components/Detail/editor copy.vue     |  43 ++++
 src/components/Detail/editor.vue          |  54 ++--
 src/components/Detail/index.vue           | 100 ++++----
 src/components/News/addOrEdit.vue         | 190 ++++++++++++++
 src/components/News/index.vue             | 293 ++++++++++++++++++++++
 src/views/index/index.vue                 |   7 +-
 src/views/lists/detailsOfDistribution.vue | 118 ---------
 src/views/lists/form.vue                  |  48 ----
 src/views/lists/index.vue                 | 264 +++----------------
 src/views/richText/index.vue              |  19 +-
 13 files changed, 705 insertions(+), 491 deletions(-)
 create mode 100644 .npmrc
 create mode 100644 src/components/Detail/editor copy.vue
 create mode 100644 src/components/News/addOrEdit.vue
 create mode 100644 src/components/News/index.vue
 delete mode 100644 src/views/lists/detailsOfDistribution.vue
 delete mode 100644 src/views/lists/form.vue

diff --git a/.npmrc b/.npmrc
new file mode 100644
index 0000000..7549542
--- /dev/null
+++ b/.npmrc
@@ -0,0 +1 @@
+registry=https://registry.npmmirror.com
diff --git a/src/components/Banner/index.vue b/src/components/Banner/index.vue
index 53295f8..8106bed 100644
--- a/src/components/Banner/index.vue
+++ b/src/components/Banner/index.vue
@@ -132,9 +132,7 @@
                 showAdd: true,
             }
         },
-        mounted() {
-            this.getList()
-        },
+
         components: {
             AddOrEdit,
         },
diff --git a/src/components/Detail/addOrEdit.vue b/src/components/Detail/addOrEdit.vue
index 36041d0..08634e2 100644
--- a/src/components/Detail/addOrEdit.vue
+++ b/src/components/Detail/addOrEdit.vue
@@ -11,7 +11,13 @@
                 </el-cascader>
             </el-form-item>
             <el-form-item label="正文：" prop="content">
-                <editor />
+                <!-- <editor /> -->
+                <el-input
+                    type="textarea"
+                    :rows="2"
+                    placeholder="请输入内容"
+                    v-model="formLabelAlign.content">
+                </el-input>
             </el-form-item>
             <el-form-item>
                 <el-button type="primary" @click="submit(formLabelAlign)">确定</el-button>
@@ -22,21 +28,22 @@
 </template>
 
 <script>
-    import Editor from './editor.vue';
+    // import Editor from './editor.vue';
     import {BASE_API} from '../../config';
     import {tabList} from '../../filters/code';
     import {
         ADD_DETAIL,
         UPDATE_DETAIL,
+        QUERY_DETAIL
     } from '@/api/contentDetail';
     import Alert from "@/utils/alert";
 
     export default {
         name: "detailsOfDistribution",
         components: {
-            Editor,
+            // Editor,
         },
-        props: ['currList', 'showAdd'],
+        props: ['currList', 'showAdd', 'content'],
         data() {
             return {
                 labelPosition: 'right',
@@ -61,11 +68,11 @@
 
         mounted() {
             if(this.currList && this.currList && !this.showAdd){
-                const { id, showPage, content } = this.currList
-                this.formLabelAlign.id = id;
+                const { detailId, showPage } = this.currList
+                this.getDetail()
+                this.formLabelAlign.detailId = detailId;
                 this.formLabelAlign.showPage.splice(0, 1, showPage.slice(0, 2))
                 this.formLabelAlign.showPage.splice(1, 1, showPage)
-                this.formLabelAlign.content = content;
             }else{
                 const code = localStorage.getItem('code')
                 if(!code) return
@@ -96,7 +103,7 @@
             },
 
             /**
-             * 添加轮播图
+             * 添加详情
              */
             async addCarousel(formName){
                 const { showPage, content } = formName;
@@ -115,12 +122,12 @@
             },
 
             /**
-             * 修改轮播图
+             * 修改详情
              */
             async updateCarousel(formName){
-                const { id, showPage, content } = formName;
+                const { detailId, showPage, content } = formName;
                 const params = {
-                    id,
+                    detailId,
                     showPage: showPage[1],
                     content
                 };
@@ -132,7 +139,31 @@
                         Alert.fail(res.msg || '修改失败');
                     }
                 })
-            }
+            },
+
+            /**
+             * 单个内容详情
+             */
+            async getDetail(){
+                try {
+                    const { detailId, showPage } = this.currList
+                    const params = {
+                        detailId,
+                        pageNum: 1,
+                        pageSize: 10,
+                        showPage
+                    };
+                    await QUERY_DETAIL(params).then(res => {
+                        if(res.code === 200){
+                            this.formLabelAlign.content = res.data.content
+                        }else{
+                            Alert.fail(res.msg || '详情获取失败');
+                        }
+                    });
+                } catch (error) {
+                    console.log('error: ', error);
+                }
+            },
         }
     }
 </script>
diff --git a/src/components/Detail/editor copy.vue b/src/components/Detail/editor copy.vue
new file mode 100644
index 0000000..01d2efb
--- /dev/null
+++ b/src/components/Detail/editor copy.vue	
@@ -0,0 +1,43 @@
+<template>
+  <div id="editorSection" @change="handleChange"></div>
+</template>
+
+<script>
+import Editor from "tui-editor"; /* ES6 */
+import "tui-editor/dist/tui-editor.css"; // editor's ui
+import "tui-editor/dist/tui-editor-contents.css"; // editor's content
+import "codemirror/lib/codemirror.css"; // codemirror
+import "highlight.js/styles/github.css"; // code block highlight
+import { init } from "echarts/lib/echarts";
+
+export default {
+  name: "mytuieditor",
+  mounted() {
+    this.initialize();
+  },
+  beforeDestroy() {
+    this.tuieditor = null;
+    delete this.tuieditor;
+  },
+  methods: {
+    initialize() {
+      if (this.$el) {
+        this.tuieditor = new Editor({
+          el: document.querySelector("#editorSection"),
+          initialEditType: "wysiwyg",
+          previewStyle: "vertical",
+          height: "300px"
+        });
+        this.tuieditor.getHtml();
+      }
+    },
+
+    handleChange(value){
+      console.log('value: ', value);
+    }
+  }
+};
+</script>
+
+<style>
+</style>
diff --git a/src/components/Detail/editor.vue b/src/components/Detail/editor.vue
index 01d2efb..c1e74a4 100644
--- a/src/components/Detail/editor.vue
+++ b/src/components/Detail/editor.vue
@@ -1,42 +1,38 @@
 <template>
-  <div id="editorSection" @change="handleChange"></div>
+  <div class="ArticleDetail">
+  <div ref="editor" style="text-align:left"></div>
+</div>
 </template>
 
 <script>
-import Editor from "tui-editor"; /* ES6 */
-import "tui-editor/dist/tui-editor.css"; // editor's ui
-import "tui-editor/dist/tui-editor-contents.css"; // editor's content
-import "codemirror/lib/codemirror.css"; // codemirror
-import "highlight.js/styles/github.css"; // code block highlight
-import { init } from "echarts/lib/echarts";
+  import axios from 'axios';
+  import {Loading} from 'element-ui'
+  import E from 'wangeditor'
+  var editor;
 
-export default {
-  name: "mytuieditor",
-  mounted() {
-    this.initialize();
-  },
-  beforeDestroy() {
-    this.tuieditor = null;
-    delete this.tuieditor;
-  },
-  methods: {
-    initialize() {
-      if (this.$el) {
-        this.tuieditor = new Editor({
-          el: document.querySelector("#editorSection"),
-          initialEditType: "wysiwyg",
-          previewStyle: "vertical",
-          height: "300px"
-        });
-        this.tuieditor.getHtml();
+  export default {
+    name: "WriteArticle",
+    data: function () {
+      return {
+        Title:'',
+        Content:''
       }
     },
 
-    handleChange(value){
-      console.log('value: ', value);
+    mounted(){
+      var That = this;
+      editor = new E(this.$refs.editor);
+      editor.customConfig = {
+        onchange:function(html){
+          That.Content = html
+        },
+        uploadImgServer: '/api/UploadImg', // 上传图片到服务器
+        uploadFileName : 'Content', //后端使用这个字段获取图片信息
+        uploadImgMaxLength : 1 , // 限制一次最多上传 1 张图片
+      }
+      editor.create()
     }
   }
-};
 </script>
 
 <style>
diff --git a/src/components/Detail/index.vue b/src/components/Detail/index.vue
index 0d10dbe..833693c 100644
--- a/src/components/Detail/index.vue
+++ b/src/components/Detail/index.vue
@@ -10,15 +10,18 @@
         </el-button>
         <div class="table">
             <el-table
-                    :data="lists"
-                    style="width: 100%"
-                    @expand-change="getDetail"
-                    >
+                :data="lists"
+                style="width: 100%"
+                :expand-row-keys="keys"
+                :row-key="setKey"
+                @expand-change="getDetail"
+                >
                 <el-table-column type="expand">
-                    <template slot-scope="props">
+                    <template slot-scope="lists">
                         <el-form label-position="left" inline class="demo-table-expand">
-                            <el-form-item label="正文">
-                                {{ lists.row.content || '' }}
+                            <el-form-item>
+                                <div v-if="content" v-html="content"></div>
+                                <div v-else>暂无</div>
                             </el-form-item>
                         </el-form>
                     </template>
@@ -82,7 +85,7 @@
                             <p>确定删除吗？</p>
                             <div style="text-align: right; margin: 0">
                                 <el-button size="mini" type="text" @click="visible = false">取消</el-button>
-                                <el-button type="danger" size="mini" plain @click="deleteItem(lists.row.id)">确定</el-button>
+                                <el-button type="danger" size="mini" plain @click="deleteItem(lists.row.detailId)">确定</el-button>
                             </div>
                             <el-button slot="reference" @click="visible = true" type="danger" icon="el-icon-delete" size="mini">删除</el-button>
                         </el-popover>
@@ -106,7 +109,7 @@
             width="600px"
             :show-close="false"
             :visible.sync="showModal">
-            <add-or-edit ref="distribution" :show-add="showAdd" :currList="currList" v-if="showModal" @close="close"></add-or-edit>
+            <add-or-edit ref="distribution" :show-add="showAdd" :currList="currList" :content="content" v-if="showModal" @close="close"></add-or-edit>
         </el-dialog>
     </div>
 </template>
@@ -141,11 +144,11 @@
                 pageNum: 1,
                 visible: false,
                 showAdd: true,
+                content: '',
+                keys: []
             }
         },
-        mounted() {
-            this.getList()
-        },
+
         components: {
             AddOrEdit,
         },
@@ -162,7 +165,9 @@
                 };
                 POST_QUERY_DETAIL(params).then(res => {
                     if(res.code === 200){
-                        this.lists = res.data.list
+                        if(res.data.list && res.data.list.length){
+                            this.lists = res.data.list
+                        }
                         this.pageNum = res.data.pageNum
                         this.pageSize = res.data.pageSize
                         this.count = res.data.size
@@ -180,28 +185,39 @@
                 this.getList()
             },
 
+            setKey(row){
+                return row.detailId
+            },
+
             /**
              * 单个内容详情
              */
-            getDetail(row){
-                let arr = this.lists
-                let index = arr.findIndex(item => item.detailId === row.detailId)
-                const { showPage } = this;
-                const params = {
-                    detailId: row.detailId,
-                    pageNum: 1,
-                    pageSize: 10,
-                    showPage
-                };
-                QUERY_DETAIL(params).then(res => {
-                    console.log('res: ', res);
-                    if(res.code === 200){
-                        arr[index].content = res.data.content
-                        this.lists = [...arr]
-                    }else{
-                        Alert.fail('获取失败');
-                    }
-                });
+            async getDetail(row){
+                try {
+                    const { showPage } = this;
+                    const params = {
+                        detailId: row.detailId,
+                        pageNum: 1,
+                        pageSize: 10,
+                        showPage
+                    };
+                    await QUERY_DETAIL(params).then(res => {
+                        if(res.code === 200){
+                            this.content = res.data.content
+                            this.keys.forEach((key,index) =>{
+                                if(key === row.detailId){
+                                    this.keys.splice(index, 1)
+                                }else{
+                                    this.keys.push(row.detailId)
+                                }
+                            })
+                        }else{
+                            Alert.fail(res.msg || '详情获取失败');
+                        }
+                    });
+                } catch (error) {
+                    console.log('error: ', error);
+                }
             },
 
             // 设置显示位置
@@ -243,18 +259,18 @@
             /**
              * 删除
              */
-            deleteItem(id) {
+            deleteItem(detailId) {
                 const params = {
-                    id
+                    detailId
                 };
-                // DELETE_DETAIL(params).then((res) => {
-                //     if(res.code === 200){
-                        // Alert.success('删除成功');
-                //         this.getList()
-                //     }else{
-                //         Alert.fail(res.msg || '删除失败');
-                //     }
-                // });
+                DELETE_DETAIL(params).then((res) => {
+                    if(res.code === 200){
+                        Alert.success('删除成功');
+                        this.getList()
+                    }else{
+                        Alert.fail(res.msg || '删除失败');
+                    }
+                });
                 this.visible = false
             },
         }
diff --git a/src/components/News/addOrEdit.vue b/src/components/News/addOrEdit.vue
new file mode 100644
index 0000000..08634e2
--- /dev/null
+++ b/src/components/News/addOrEdit.vue
@@ -0,0 +1,190 @@
+<template>
+    <div class="container">
+        <div class="title">{{ showAdd ? '添加' : '修改' }}详情</div>
+        <el-form :model="formLabelAlign" :rules="rules" ref="ruleForm" label-width="80px" class="demo-ruleForm">
+            <el-form-item label="位置：" prop="showPage">
+                <el-cascader
+                    v-model="formLabelAlign.showPage"
+                    :props="props"
+                    :options="tabList"
+                    @change="handleChange">
+                </el-cascader>
+            </el-form-item>
+            <el-form-item label="正文：" prop="content">
+                <!-- <editor /> -->
+                <el-input
+                    type="textarea"
+                    :rows="2"
+                    placeholder="请输入内容"
+                    v-model="formLabelAlign.content">
+                </el-input>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" @click="submit(formLabelAlign)">确定</el-button>
+                <el-button @click="$emit('close')">取消</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+    // import Editor from './editor.vue';
+    import {BASE_API} from '../../config';
+    import {tabList} from '../../filters/code';
+    import {
+        ADD_DETAIL,
+        UPDATE_DETAIL,
+        QUERY_DETAIL
+    } from '@/api/contentDetail';
+    import Alert from "@/utils/alert";
+
+    export default {
+        name: "detailsOfDistribution",
+        components: {
+            // Editor,
+        },
+        props: ['currList', 'showAdd', 'content'],
+        data() {
+            return {
+                labelPosition: 'right',
+                formLabelAlign: {
+                    showPage: ['00', '0000'],
+                    content: ''
+                },
+                BASE_API,
+                tabList,
+                props: {
+                    value: 'code',
+                    label: 'title',
+                    children: 'children'
+                },
+                rules: {
+                    showPage: [
+                        { type: 'array', required: true, message: '请选择位置', trigger: 'change' }
+                    ],
+                }
+            }
+        },
+
+        mounted() {
+            if(this.currList && this.currList && !this.showAdd){
+                const { detailId, showPage } = this.currList
+                this.getDetail()
+                this.formLabelAlign.detailId = detailId;
+                this.formLabelAlign.showPage.splice(0, 1, showPage.slice(0, 2))
+                this.formLabelAlign.showPage.splice(1, 1, showPage)
+            }else{
+                const code = localStorage.getItem('code')
+                if(!code) return
+                this.formLabelAlign.showPage.splice(0, 1, code.slice(0, 2))
+                this.formLabelAlign.showPage.splice(1, 1, code)
+            }
+        },
+
+        methods: {
+            // 位置选择
+            handleChange(value) {
+                this.formLabelAlign.showPage = value
+            },
+
+            submit(formName) {
+                this.$refs.ruleForm.validate((valid) => {
+                    if (valid) {
+                        if(this.showAdd){
+                            this.addCarousel(formName)
+                        }else{
+                            this.updateCarousel(formName)
+                        }
+                    } else {
+                        console.log('error submit!!');
+                        return false;
+                    }
+                });
+            },
+
+            /**
+             * 添加详情
+             */
+            async addCarousel(formName){
+                const { showPage, content } = formName;
+                const params = {
+                    showPage: showPage[1],
+                    content
+                };
+                await ADD_DETAIL(params).then((res) => {
+                    if(res.code === 200){
+                        Alert.success('添加成功');
+                        this.$emit('close', true)
+                    }else{
+                        Alert.fail(res.msg || '添加失败');
+                    }
+                })
+            },
+
+            /**
+             * 修改详情
+             */
+            async updateCarousel(formName){
+                const { detailId, showPage, content } = formName;
+                const params = {
+                    detailId,
+                    showPage: showPage[1],
+                    content
+                };
+                await UPDATE_DETAIL(params).then((res) => {
+                    if(res.code === 200){
+                        Alert.success('修改成功');
+                        this.$emit('close', true)
+                    }else{
+                        Alert.fail(res.msg || '修改失败');
+                    }
+                })
+            },
+
+            /**
+             * 单个内容详情
+             */
+            async getDetail(){
+                try {
+                    const { detailId, showPage } = this.currList
+                    const params = {
+                        detailId,
+                        pageNum: 1,
+                        pageSize: 10,
+                        showPage
+                    };
+                    await QUERY_DETAIL(params).then(res => {
+                        if(res.code === 200){
+                            this.formLabelAlign.content = res.data.content
+                        }else{
+                            Alert.fail(res.msg || '详情获取失败');
+                        }
+                    });
+                } catch (error) {
+                    console.log('error: ', error);
+                }
+            },
+        }
+    }
+</script>
+
+<style lang="scss" scoped>
+    .title{
+        width: 100%;
+        margin-bottom: 30px;
+        font-size: 20px;
+        font-weight: bold;
+        text-align: center;
+    }
+
+    .avatar-uploader-icon {
+        display: inline-block;
+        border: 1px dashed #d9d9d9;
+        font-size: 28px;
+        color: #8c939d;
+        width: 178px;
+        height: 178px;
+        line-height: 178px;
+        text-align: center;
+    }
+</style>
diff --git a/src/components/News/index.vue b/src/components/News/index.vue
new file mode 100644
index 0000000..833693c
--- /dev/null
+++ b/src/components/News/index.vue
@@ -0,0 +1,293 @@
+<template>
+    <div>
+        <el-button
+            type="primary"
+            icon="el-icon-plus"
+            style="margin-bottom: 15px;"
+            @click="addModal"
+            >
+            添加
+        </el-button>
+        <div class="table">
+            <el-table
+                :data="lists"
+                style="width: 100%"
+                :expand-row-keys="keys"
+                :row-key="setKey"
+                @expand-change="getDetail"
+                >
+                <el-table-column type="expand">
+                    <template slot-scope="lists">
+                        <el-form label-position="left" inline class="demo-table-expand">
+                            <el-form-item>
+                                <div v-if="content" v-html="content"></div>
+                                <div v-else>暂无</div>
+                            </el-form-item>
+                        </el-form>
+                    </template>
+                </el-table-column>
+                <el-table-column
+                    prop="name"
+                    label="位置"
+                    align="center"
+                    >
+                    <template slot-scope="lists">
+                        {{ setCode(lists.row.showPage) }}
+                    </template>
+                </el-table-column>
+                <el-table-column
+                    prop="name"
+                    label="创建时间"
+                    align="center"
+                    >
+                    <template slot-scope="lists">
+                        {{ $moment(lists.row.createdAt).format('YYYY-MM-DD HH:mm') }}
+                    </template>
+                </el-table-column>
+                <el-table-column
+                    prop="name"
+                    label="修改时间"
+                    align="center"
+                    >
+                    <template slot-scope="lists">
+                        {{ $moment(lists.row.updatedAt).format('YYYY-MM-DD HH:mm') }}
+                    </template>
+                </el-table-column>
+                <el-table-column
+                    prop="name"
+                    label="最后修改人登录名"
+                    align="center"
+                    >
+                    <template slot-scope="lists">
+                        {{ lists.row.modifyName }}
+                    </template>
+                </el-table-column>
+
+                <el-table-column
+                    fixed="right"
+                    label="操作"
+                    align="center"
+                    >
+                    <template slot-scope="lists">
+                        <el-button
+                            type="primary"
+                            icon="el-icon-edit"
+                            style="margin-right: 15px;"
+                            @click="editModal(lists.row)"
+                            size="mini">
+                            编辑
+                        </el-button>
+
+                        <el-popover
+                            placement="top"
+                            width="160"
+                            :value="visible">
+                            <p>确定删除吗？</p>
+                            <div style="text-align: right; margin: 0">
+                                <el-button size="mini" type="text" @click="visible = false">取消</el-button>
+                                <el-button type="danger" size="mini" plain @click="deleteItem(lists.row.detailId)">确定</el-button>
+                            </div>
+                            <el-button slot="reference" @click="visible = true" type="danger" icon="el-icon-delete" size="mini">删除</el-button>
+                        </el-popover>
+
+                    </template>
+                </el-table-column>
+            </el-table>
+            <div class="pagination">
+                <el-pagination
+                    background
+                    :page-size="pageSize"
+                    layout="prev, pager, next"
+                    :total="count"
+                    @current-change="currentChange"
+                >
+                </el-pagination>
+            </div>
+        </div>
+
+        <el-dialog
+            width="600px"
+            :show-close="false"
+            :visible.sync="showModal">
+            <add-or-edit ref="distribution" :show-add="showAdd" :currList="currList" :content="content" v-if="showModal" @close="close"></add-or-edit>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+    const AddOrEdit = () => import('./addOrEdit.vue');
+    import {
+        POST_QUERY_DETAIL,
+        QUERY_DETAIL,
+        DELETE_DETAIL
+    } from '@/api/contentDetail'
+    import Alert from "@/utils/alert";
+    import {tabList} from '../../filters/code';
+
+    export default {
+        name: "index",
+        props: {
+            showPage: {
+                type: String,
+                default: "0000"
+            }
+        },
+        data() {
+            return {
+                count: 0,
+                id: '',
+                showModal: false,
+                tabList,
+                lists: [],
+                currList: null,
+                pageSize: 10,
+                pageNum: 1,
+                visible: false,
+                showAdd: true,
+                content: '',
+                keys: []
+            }
+        },
+
+        components: {
+            AddOrEdit,
+        },
+        methods: {
+            /**
+             * 获取详情列表
+             */
+            getList() {
+                const { pageNum, pageSize, showPage } = this;
+                const params = {
+                    pageNum,
+                    pageSize,
+                    showPage
+                };
+                POST_QUERY_DETAIL(params).then(res => {
+                    if(res.code === 200){
+                        if(res.data.list && res.data.list.length){
+                            this.lists = res.data.list
+                        }
+                        this.pageNum = res.data.pageNum
+                        this.pageSize = res.data.pageSize
+                        this.count = res.data.size
+                    }else{
+                        Alert.fail(res.msg || '获取失败');
+                    }
+                });
+            },
+
+            /**
+             * 分页
+             */
+            currentChange(res) {
+                this.pageNum = res;
+                this.getList()
+            },
+
+            setKey(row){
+                return row.detailId
+            },
+
+            /**
+             * 单个内容详情
+             */
+            async getDetail(row){
+                try {
+                    const { showPage } = this;
+                    const params = {
+                        detailId: row.detailId,
+                        pageNum: 1,
+                        pageSize: 10,
+                        showPage
+                    };
+                    await QUERY_DETAIL(params).then(res => {
+                        if(res.code === 200){
+                            this.content = res.data.content
+                            this.keys.forEach((key,index) =>{
+                                if(key === row.detailId){
+                                    this.keys.splice(index, 1)
+                                }else{
+                                    this.keys.push(row.detailId)
+                                }
+                            })
+                        }else{
+                            Alert.fail(res.msg || '详情获取失败');
+                        }
+                    });
+                } catch (error) {
+                    console.log('error: ', error);
+                }
+            },
+
+            // 设置显示位置
+            setCode(showPage){
+                let item = null
+                for (let i = 0; i < this.tabList.length; i++) {
+                    const list = this.tabList[i];
+                    for (let j = 0; j < list.children.length; j++) {
+                        const curItem = list.children[j];
+                        if(curItem.code == showPage){
+                            item = curItem
+                            break;
+                        }
+                    }
+                }
+                return item && item.title ? item.title : ''
+            },
+
+            addModal(){
+                this.showModal = true;
+                this.showAdd = true;
+            },
+
+            editModal(currList) {
+                this.showModal = true;
+                this.showAdd = false;
+                // this.id = id;
+                this.currList = currList
+            },
+
+            // 关闭弹窗
+            close(type){
+                this.showModal = false
+                if(type){
+                    this.getList()
+                }
+            },
+
+            /**
+             * 删除
+             */
+            deleteItem(detailId) {
+                const params = {
+                    detailId
+                };
+                DELETE_DETAIL(params).then((res) => {
+                    if(res.code === 200){
+                        Alert.success('删除成功');
+                        this.getList()
+                    }else{
+                        Alert.fail(res.msg || '删除失败');
+                    }
+                });
+                this.visible = false
+            },
+        }
+    }
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+    .table {
+        background: #fff;
+
+        .option-span {
+            color: #a90500;
+            cursor: pointer;
+        }
+    }
+
+    .pagination {
+        margin-top: 20px;
+    }
+</style>
diff --git a/src/views/index/index.vue b/src/views/index/index.vue
index 5c10e31..57d244c 100644
--- a/src/views/index/index.vue
+++ b/src/views/index/index.vue
@@ -2,7 +2,7 @@
     <div class="pa-4 white">
         <el-tabs type="border-card" v-model="activeName" @tab-click="handleClick(activeName)">
             <el-tab-pane label="轮播图管理" name="IMAGE">
-                <banner :showPage="showPage" />
+                <banner :showPage="showPage" ref="banner" />
             </el-tab-pane>
             <!-- <el-tab-pane label="详情页管理" name="DETAIL">
                 <detail />
@@ -27,6 +27,11 @@
                 showPage: '0000'
             }
         },
+        mounted() {
+            this.$nextTick(() => {
+                this.$refs.banner.getList()
+            })
+        },
         methods: {
             handleClick() {
                 console.log('切换tab');
diff --git a/src/views/lists/detailsOfDistribution.vue b/src/views/lists/detailsOfDistribution.vue
deleted file mode 100644
index a99e610..0000000
--- a/src/views/lists/detailsOfDistribution.vue
+++ /dev/null
@@ -1,118 +0,0 @@
-<template>
-    <el-row>
-        <el-col :span="24" style="margin-bottom: 10px;">
-            <div class="grid-content bg-purple-dark">
-                <el-col :span="12">
-                    <div class="grid-content bg-purple">分润对象:</div>
-                </el-col>
-                <el-col :span="12">
-                    <div class="grid-content bg-purple-light">分润比例:</div>
-                </el-col>
-            </div>
-        </el-col>
-        <el-col :span="24" v-for="(item,index) in lists" style="margin-bottom: 10px;">
-            <el-form :inline="true" class="demo-form-inline">
-                <div class="grid-content bg-purple-dark">
-                    <el-row :gutter="15">
-                        <el-col :span="10">
-                            <div class="grid-content bg-purple">
-                                <el-select v-model="item.userId" :value="item.userId" placeholder="选择分润对象">
-                                    <el-option v-for="opi in accounts" :label="opi.name" :value="opi.id"></el-option>
-                                </el-select>
-                            </div>
-                        </el-col>
-                        <el-col :span="10">
-                            <div class="grid-content bg-purple-light">
-                                <el-input placeholder="" @input="limitMax(item.rate,index)" v-model="item.rate" max="100" min="1"></el-input>
-                            </div>
-                        </el-col>
-                        <el-col :span="4">
-                            <div class="grid-content bg-purple-light">
-                                <el-button type="danger" @click="deleteObj(index)" icon="el-icon-delete"></el-button>
-                            </div>
-                        </el-col>
-
-                    </el-row>
-                </div>
-            </el-form>
-        </el-col>
-        <el-button @click="addObj">添加分润对象</el-button>
-    </el-row>
-</template>
-
-<script>
-    import {GET_ACCOUNT_LIST} from '@/api/privilegeManagement'
-    import {DETAIL_FIELD_LIST} from '@/api/distribution'
-    import Alert from "@/utils/alert";
-
-    export default {
-        name: "detailsOfDistribution",
-        props: ['currId'],
-        data() {
-            return {
-                lists: [],
-                accounts: []
-            }
-        },
-        watch: {
-            currId() {
-
-            }
-        },
-        mounted() {
-            this.getAccounts();
-            this.getDetail();
-        },
-        methods: {
-            getDetail() {
-                let params = {
-                    id: this.currId
-                };
-                DETAIL_FIELD_LIST(params).then(res => {
-                    this.lists = res
-                })
-            },
-            /**
-             * 添加分润对象
-             */
-            addObj() {
-                let obj = {
-                    userId: '',
-                    rate: ''
-                };
-                this.lists.push(obj)
-            },
-
-            /**
-             * 删除分润对象
-             */
-            deleteObj(idx) {
-                let lists = [];
-                this.lists.map((item, index) => {
-                    if (idx != index) {
-                        lists.push(item)
-                    }
-                    return item;
-                });
-                this.lists = lists
-            },
-            getAccounts() {
-                GET_ACCOUNT_LIST().then(res => {
-                    this.accounts = res;
-                })
-            },
-            limitMax(val, idx) {
-                if (val >= 100 || val <= 0) {
-                    Alert.fail('值不能大于100,小于0');
-                    val = ''
-                }
-
-                this.lists[idx].rate = val;
-            }
-        }
-    }
-</script>
-
-<style rel="stylesheet/scss" lang="scss" scoped>
-
-</style>
diff --git a/src/views/lists/form.vue b/src/views/lists/form.vue
deleted file mode 100644
index 17645f7..0000000
--- a/src/views/lists/form.vue
+++ /dev/null
@@ -1,48 +0,0 @@
-<template>
-    <div class="form-container">
-        <el-form :inline="true" :model="formInline" class="demo-form-inline">
-            <el-form-item label="类别">
-                <el-select v-model="formInline.locationId" value="" placeholder="场地">
-                    <el-option label="全部" value=""></el-option>
-                    <el-option label="其他链接" value="otherLink"></el-option>
-                    <el-option label="漂浮窗" value="piaochuang"></el-option>
-                </el-select>
-            </el-form-item>
-            <el-form-item label="描述">
-                <el-input v-model="formInline.description" placeholder="描述" />
-            </el-form-item>
-            <el-form-item style="padding-left:30px">
-                <el-button type="primary" @click="onSubmit">查询</el-button>
-            </el-form-item>
-        </el-form>
-    </div>
-</template>
-
-<script>
-    export default {
-        name: 'form-container',
-        props: ['label'],
-        data() {
-            return {
-                formInline: {
-                    locationId: '',
-                    description: '',
-                },
-                locationId: '',
-                description: '',
-            }
-        },
-        methods: {
-            onSubmit() {
-                this.$emit('submit', this.formInline)
-            },
-        }
-    }
-</script>
-
-<style rel="stylesheet/scss" lang="scss" scoped>
-    .form-container {
-        padding: 20px;
-        background: #fff;
-    }
-</style>
diff --git a/src/views/lists/index.vue b/src/views/lists/index.vue
index a439f94..872e314 100644
--- a/src/views/lists/index.vue
+++ b/src/views/lists/index.vue
@@ -1,259 +1,55 @@
 <template>
-    <div>
-        <form-container @submit="submitForm"></form-container>
-        <div class="table">
-            <el-table :data="lists" style="width: 100%">
-                <el-table-column prop="code" label="类型">
-                    <template slot-scope="lists">
-                        <span v-if="lists.row.code === 'piaochuang'">漂浮窗</span>
-                        <span v-else-if="lists.row.code === 'otherLink'">其他链接</span>
-                        <span v-else>其他</span>
-                    </template>
-                </el-table-column>
-                <el-table-column prop="startTime" label="开始时间">
-                    <template slot-scope="lists">
-                        <span v-if="lists.row.startTime-0">
-                            {{ $moment(lists.row.startTime-0).format("YYYY-MM-DD HH:mm") }}
-                        </span>
-                        <span v-else>
-                            暂无
-                        </span>
-                    </template>
-                </el-table-column>
-                <el-table-column prop="endTime" label="结束时间">
-                    <template slot-scope="lists">
-                        <span v-if="lists.row.endTime-0">
-                            {{ $moment(lists.row.endTime-0).format("YYYY-MM-DD HH:mm") }}
-                        </span>
-                        <span v-else>
-                            暂无
-                        </span>
-                    </template>
-                </el-table-column>
-                <el-table-column prop="description" label="常量值">
-                    <template slot-scope="lists">
-                        <div v-for="(item,index) in getValue(lists.row.value)" :key="index">
-                            <div>{{ item.title }}</div>
-                            <template v-if="Array.isArray(item.value)">
-                                <div v-for="(itemA,indexA) in item.value" :key="indexA">
-                                    <span>{{ itemA }}</span>
-                                    <el-input :value="itemA" @blur="changeValue($event,item.title,lists.row,indexA)" />
-                                </div>
-                            </template>
-                            <template v-else>
-                                <div>
-                                    <span>{{ item.value }}</span>
-                                    <el-input :value="item.value" @blur="changeValue($event,item.title,lists.row)" />
-                                </div>
-                            </template>
-                        </div>
-                    </template>
-                </el-table-column>
-                <el-table-column prop="description" label="描述">
-                    <template slot-scope="lists">
-                        <span> {{ lists.row.description }} </span>
-                    </template>
-                </el-table-column>
-                <el-table-column prop="modifyName" label="最后修改人登录名">
-                    <template slot-scope="lists">
-                        <span> {{ lists.row.modifyName }} </span>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <div class="pagination">
-                <el-pagination
-                    background
-                    :page-size="params.pageSize"
-                    layout="prev, pager, next"
-                    :total="dataList.total - 0"
-                    @current-change="currentChange"
-                >
-                </el-pagination>
-            </div>
-        </div>
-
-        <!-- <el-dialog
-            width="400px"
-            :show-close="false"
-            :visible.sync="isEdit"
-        >
-            <details-of-distribution ref="distribution" :currId="id" v-if="isEdit"></details-of-distribution>
-            <div slot="footer" class="dialog-footer">
-                <el-button @click="isEdit = false">取消</el-button>
-                <el-button type="primary" @click="determine('ruleForm')">确定</el-button>
-            </div>
-        </el-dialog> -->
-
+    <div class="pa-4 white">
+        <el-tabs type="border-card" v-model="activeName" @tab-click="handleClick(activeName)">
+            <el-tab-pane label="轮播图管理" name="IMAGE">
+                <banner :showPage="showPage" ref="banner" />
+            </el-tab-pane>
+            <el-tab-pane label="列表管理" name="NEWS">
+                <news :showPage="showPage" ref="news" />
+            </el-tab-pane>
+        </el-tabs>
     </div>
 </template>
 
 <script>
-    const FormContainer = () => import('./form.vue');
-    const DetailsOfDistribution = () => import('./detailsOfDistribution.vue');
-    import { GET_LIST,UPDATE_DATA } from '@/api/otherPage';
-    import Alert from "@/utils/alert";
-    import {pageSize} from '../../config';
+    import Banner from '@/components/Banner';
+    import News from '@/components/News';
 
     export default {
         name: "index",
+        components: {
+            Banner,
+            News
+        },
         data() {
             return {
-                count: 0,
-                id: '',
-                isEdit: false,
-                lists: [],
-                dataList: {},
-                params: {
-                    locationId: '',
-                    description: '',
-                    pageNum: 1,
-                    pageSize: 10,
-                }
+                activeName: 'IMAGE',
+                showPage: ''
             }
         },
-        mounted() {
-            this.getList()
+        created() {
+            this.showPage = localStorage.getItem('code')
         },
-        components: {
-            FormContainer,
-            DetailsOfDistribution
+        mounted() {
+            this.$nextTick(() => {
+                this.$refs.banner.getList()
+            })
         },
         methods: {
-            // 搜索查询按钮
-            submitForm(res) {
-                this.params = {
-                    ...this.params,
-                    pageNum: 1,
-                    description: res.description,
-                    locationId: res.locationId,
-                };
-                this.getList()
-            },
-            // 获取数组
-            async getList() {
-                await GET_LIST(this.params).then(res => {
-                    const { code,msg,data } = res
-                    if(code === 200) {
-                        this.lists = data.list
-                        this.dataList = data
-                    } else {
-                        Alert(msg)
-                    }
-                });
-            },
-            // 将常量值JSON字符串解析
-            getValue(value) {
-                const arr = JSON.parse(value)
-                let itemList = []
-                if(Array.isArray(arr)) {
-                    for(let i = 0; i < arr.length; i++) {
-                        const item = arr[i]
-                        for(let key in item) {
-                            if(Array.isArray(item[key])) {
-                                const obj = {
-                                    title: key,
-                                    value: item[key]
-                                }
-                                itemList.push(obj)
-                            } else {
-                                const obj = {
-                                    title: item.content,
-                                    value: item.url
-                                }
-                                itemList.push(obj)
-                                break
-                            }
-                        }
-                    }
-                } else {
-                    for(let key in arr) {
-                        const obj = {
-                            title: key,
-                            value: arr[key]
-                        }
-                        itemList.push(obj)
-                    }
-                }
-                console.log('itemList',itemList)
-                return itemList
-            },
-            // 修改常量值,将其反转成JSON后提交
-            changeValue(e,title,defaultValue,index) {
-                let dValue = JSON.parse(defaultValue.value);
-                if(Array.isArray(dValue)) {
-                    for(let i = 0; i < dValue.length; i++) {
-                        const item = dValue[i]
-                        for(let key in item) {
-                            if(Array.isArray(item[key]) && key === title) {
-                                item[key][index] = e.target.value
-                            } else {
-                                if(item.content === title) {
-                                    item.url = e.target.value
-                                    break;
-                                }
-                            }
-                        }
-                    }
-                } else {
-                    for(let key in dValue) {
-                        if(key === title) {
-                            dValue[key] = e.target.value
-                        }
-                    }
+            handleClick(value) {
+                console.log('value: ', value);
+                this.activeName  =value
+                if(value === 'IMAGE'){
+                    this.$refs.banner.getList()
                 }
-                const params = {
-                    code: defaultValue.code,
-                    constantId: defaultValue.constantId,
-                    value: JSON.stringify(dValue)
+                if(value === 'NEWS'){
+                    this.$refs.news.getList()
                 }
-                this.updateData(params)
-            },
-            // 常量修改
-            async updateData(params) {
-                await UPDATE_DATA(params).then(res => {
-                    const { code } = res
-                    console.log('code: ', code);
-                    if(code === 200) {
-                        Alert.success('修改成功')
-                        this.getList()
-                    }
-                });
-            },
-
-            /**
-             * 分页
-             */
-            currentChange(res) {
-                this.params = {
-                    ...this.params,
-                    from: parseInt(res - 1) * this.params.size,
-                    size: pageSize,
-                };
-                this.getList()
-            },
-
-            editModal(id) {
-                this.isEdit = true;
-                this.id = id;
             },
-
         }
     }
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-    .table {
-        margin-top: 20px;
-        padding: 30px;
-        background: #fff;
 
-        .option-span {
-            color: #a90500;
-            cursor: pointer;
-        }
-    }
-
-    .pagination {
-        margin-top: 20px;
-    }
 </style>
diff --git a/src/views/richText/index.vue b/src/views/richText/index.vue
index deabf90..7b22ecb 100644
--- a/src/views/richText/index.vue
+++ b/src/views/richText/index.vue
@@ -2,10 +2,10 @@
     <div class="pa-4 white">
         <el-tabs type="border-card" v-model="activeName" @tab-click="handleClick(activeName)">
             <el-tab-pane label="轮播图管理" name="IMAGE">
-                <banner :showPage="showPage" />
+                <banner :showPage="showPage" ref="banner" />
             </el-tab-pane>
             <el-tab-pane label="详情页管理" name="DETAIL">
-                <detail :showPage="showPage" />
+                <detail :showPage="showPage" ref="detail" />
             </el-tab-pane>
         </el-tabs>
     </div>
@@ -30,9 +30,20 @@
         created() {
             this.showPage = localStorage.getItem('code')
         },
+        mounted() {
+            this.$nextTick(() => {
+                this.$refs.banner.getList()
+            })
+        },
         methods: {
-            handleClick() {
-                console.log('切换tab');
+            handleClick(value) {
+                this.activeName  =value
+                if(value === 'IMAGE'){
+                    this.$refs.banner.getList()
+                }
+                if(value === 'DETAIL'){
+                    this.$refs.detail.getList()
+                }
             },
         }
     }