新增星云动态,行业应用,Banner管理以及关于我们等页面与组件

config/dev.env.js

 module.exports = {
   NODE_ENV: '"development"',
-  BASE_API: '"https://zzrsmgmt.upyuns.com"'
+  BASE_API: '"https://zzrsmgmt.upyuns.com"' // https://zzrsmgmt.upyuns.com/api/website/newsType/getAll
 }

config/index.js

+/*
+ * @Author: your name
+ * @Date: 2020-12-01 09:54:12
+ * @LastEditTime: 2020-12-02 09:13:17
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: \rs-cloud-platform-ui\config\index.js
+ */
 // see http://vuejs-templates.github.io/webpack for documentation.
 var path = require('path')
 
@@ -23,9 +31,8 @@ module.exports = {
         bundleAnalyzerReport: process.env.npm_config_report
     },
     dev: {
-
         env: require('./dev.env'),
-        port: 9527,
+        port: 9528,
         autoOpenBrowser: true,
         assetsSubDirectory: 'static',
         assetsPublicPath: '/',
@@ -56,4 +63,4 @@ module.exports = {
         // just be aware of this issue when enabling this option.
         cssSourceMap: false
     }
-}
+}
\ No newline at end of file

package-lock.json

@@ -5527,6 +5527,11 @@
       "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==",
       "dev": true
     },
+    "kindeditor": {
+      "version": "4.1.10",
+      "resolved": "https://registry.npm.taobao.org/kindeditor/download/kindeditor-4.1.10.tgz",
+      "integrity": "sha1-u7u6neOOE/hWggW+dl73M5621RU="
+    },
     "klaw": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
@@ -6417,7 +6422,8 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
       "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
-      "dev": true
+      "dev": true,
+      "optional": true
     },
     "normalize-range": {
       "version": "0.1.2",
@@ -6924,7 +6930,8 @@
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.2.tgz",
       "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==",
-      "dev": true
+      "dev": true,
+      "optional": true
     },
     "pify": {
       "version": "2.3.0",

package.json

@@ -28,6 +28,7 @@
     "js-cookie": "2.1.4",
     "jsonlint": "1.6.2",
     "jszip": "^3.1.5",
+    "kindeditor": "^4.1.10",
     "mockjs": "1.0.1-beta3",
     "normalize.css": "3.0.2",
     "nprogress": "0.2.0",

src/api/website/banner/index.js

+import fetch from 'utils/fetch';
+
+export function page(query) {
+  return fetch({
+    url: '/api/website/banner/getList',
+    method: 'get',
+    params: query
+  });
+}
+
+export function update(query) {
+  return fetch({
+    url: '/api/website/banner/addUpdate',
+    method: 'post',
+    data: query
+  });
+}

src/api/website/industryApplication/index.js

+/*
+ * @Author: Jenkins
+ * @Date: 2020-12-02 09:20:18
+ * @LastEditTime: 2020-12-02 10:53:27
+ * @LastEditors: Please set LastEditors
+ * @Description: 行业应用页请求接口
+ * @FilePath: \rs-cloud-platform-ui\src\api\wsmanagement\industryApplication\index.js
+ */
+
+import fetch from 'utils/fetch';
+
+/**
+ * 获取所有行业应用类型
+ * @param {Object} indexShow 
+ */
+export function getAllApplicationType(indexShow){
+    return fetch({
+        url: '/api/website/industryApplicationType/getAll',
+        method: 'get',
+        param: {indexShow:indexShow}
+    });
+}
+
+/**
+ * 分页获取所有行业应用类型
+ * @param {Object} obj
+ */
+export function getListApplicationType(obj){
+    return fetch({
+        url: '/api/website/industryApplicationType/getList',
+        method: 'get',
+        param: obj
+    });
+}
+
+/**
+ * 新增或更新行业应用类型
+ * @param {Object} obj 
+ */
+export function addUpdateApplicationType(obj){
+    return fetch({
+        url: '/api/website/industryApplicationType/addUpdate',
+        method: 'post',
+        data: obj
+    });
+}
+
+/**
+ * 分页获取行业应用信息
+ * @param {Object} obj 
+ */
+export function getListApplicationInfo(obj){
+    return fetch({
+        url: '/api/website/industryApplicationInfo/getList',
+        method: 'get',
+        param: obj
+    });
+}
+
+/**
+ * 新增或更新行业应用信息
+ * @param {Object} obj 
+ */
+export function addUpdateApplicationInfo(obj){
+    return fetch({
+        url: '/api/website/industryApplicationInfo/addUpdate',
+        method: 'post',
+        data: obj
+    });
+}

src/api/website/newsCategory/index.js

+/*
+ * @Author: Jenkins
+ * @Date: 2020-12-02 09:18:01
+ * @LastEditTime: 2020-12-03 11:07:18
+ * @LastEditors: Please set LastEditors
+ * @Description: 星云动态页请求接口
+ * @FilePath: \rs-cloud-platform-ui\src\api\wsmanagement\newsCategory\index.js
+ */
+
+import fetch from 'utils/fetch';
+
+/**
+ * 获取所有新闻类型
+ */
+export function getAllnewsType(){
+    return fetch({
+        url: '/api/admin/user/front/menu/all',
+        method: 'get'
+    });
+}
+
+/**
+ * 分页获取新闻类型
+ * @param {Object} obj 
+ */
+export function getListnewsType(obj){
+    return fetch({
+        url: '/api/website/newsType/getList',
+        method: 'get',
+        params: obj
+    });
+}
+
+/**
+ * 添加或更新新闻类型
+ * @param {Object} obj 
+ */
+export function addUpdateNewsType(obj){
+    return fetch({
+        url: '/api/website/newsType/addUpdate',
+        method: 'post',
+        data: obj
+    });
+}
+
+/**
+ * 分页查询新闻资讯
+ * @param {Object} obj 
+ */
+export function getListNewsInfo(obj){
+    return fetch({
+        url: '/api/website/newsInfo/getList',
+        method: 'get',
+        params: obj
+    });
+}
+
+/**
+ * 添加或更新新闻资讯
+ * @param {Object} obj 
+ */
+export function addUpdateNewsInfo(obj){
+    return fetch({
+        url: '/api/website/newsInfo/addUpdate',
+        method: 'post',
+        data: obj
+    });
+}
+
+/**
+ * 上传图片
+ * @param {Object} obj 
+ */
+export function uploadFile(obj){
+    return fetch({
+        url: '/api/universal/file/app/unauth/admin/upload',
+        method: 'post',
+        data: obj
+    });
+}

src/api/website/satelliteIntroduction/index.js

+import fetch from 'utils/fetch';
+
+export function page(query) {
+  return fetch({
+    url: '/api/website/imageInformation/getList',
+    method: 'get',
+    params: query
+  });
+}
+
+export function update(query) {
+  return fetch({
+    url: '/api/website/imageInformation/addUpdate',
+    method: 'post',
+    data: query
+  });
+}

src/components/CustomForm/index.vue

+<template>
+  <el-form
+    ref="ruleForm"
+    size="small"
+    label-position="right"
+    :model="getForm.formVal"
+    :rules="getForm.rules"
+    label-width="100px"
+    class="demo-ruleForm">
+    <el-form-item v-for="(item, index) in getForm.formItem" :key="index" :label="item.label" :prop="index">
+      <!-- 上传文件 -->
+      <div v-if="item.type && item.type == 'file'">
+        <my-upload :value="getForm.formVal[index]" @input="(val) => getSrc(index, val)"></my-upload>
+      </div>
+      <!-- 单选组 -->
+      <div v-else-if="item.type && item.type == 'radio'">
+        <el-radio-group v-model="getForm.formVal[index]">
+          <el-radio v-for="(item, index) in item.radioArr" :key="~~index" :label="~~index">{{item}}</el-radio>
+        </el-radio-group>
+      </div>
+      <!-- 自定义 -->
+      <div v-else-if="item.type && item.type == 'custom'">
+        <custom-input ref="customInput" :value="getForm.formVal" @input="getCustomInput" @reset="resetParams"></custom-input>
+      </div>
+
+      <div v-else-if="item.type && item.type == 'kindEditor'">
+        <kind-editor ref="kindEditor" :html="html" @input="getContent"></kind-editor>
+      </div>
+
+      <!-- 输入框 -->
+      <div v-else>
+        <el-input v-model="getForm.formVal[index]" :placeholder="item.placeholder || `请输入${item.label}`"></el-input>
+      </div>
+    </el-form-item>
+    <el-form-item>
+      <el-button type="primary" @click="submitForm()">确定</el-button>
+      <el-button type="info" @click="resetForm()">取消</el-button>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script>
+import MyUpload from "@/components/Upload/singleImageX"//上传组件
+import CustomInput from "@/components/CustomInput"//自定义组件
+import KindEditor from "@/components/Kindeditor"//富文本
+
+export default {
+  name: "CustomForm",
+  components: {
+    MyUpload,
+    CustomInput,
+    KindEditor
+  },
+  props: {
+    formData: {
+      type: Object,
+      default: () => {}
+    }
+  },
+  data() {
+    return {
+      html: 'https://ebusiness-1255313385.cosbj.myqcloud.com/image/20190823/center2019082304054532.html',
+      // html: '#',
+      content: ""
+    }
+  },
+  computed: {
+    getForm() {
+      this.$nextTick(() => this.$refs.ruleForm.resetFields())
+      return this.formData
+    }
+  },
+  methods: {
+    getContent(val) {
+      console.log('富文本', val)
+    },
+    resetParams(val) {
+      this.getForm.formVal.jumpType = val;
+      this.getForm.formVal.url = '';
+      this.getForm.formVal.jumpId = null;
+    },
+    //获取图片链接
+    getSrc(index, val) {
+      let formVal = this.getForm.formVal
+      formVal[index] = val
+    },
+    //获取自定义组件值
+    getCustomInput(val) {
+      let formVal = this.getForm.formVal
+      formVal.url = val
+    },
+    submitForm() {
+      let _this = this;
+      this.$refs.ruleForm.validate((valid) => {
+        let a = _this.checkCustom()
+        if (valid && a) {
+          this.$emit('submitFunc', this.getForm.formVal)
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+
+    },
+    //校验自定义input
+    checkCustom() {
+      let form = this.getForm.formVal;
+
+      if (form.jumpType === 1 && form.url == '') {
+        this.$refs.customInput[0].showErr('请输入链接地址')
+        return false
+      } else if ((form.jumpType !== 0 && form.jumpType !== 1) && (form.jumpId === null || form.jumpId === '')) {
+        this.$refs.customInput[0].showErr('请选择')
+        return false
+      }
+      this.$refs.customInput[0].showErr('')
+      return true
+    },
+    resetForm() {
+      this.$refs.ruleForm.resetFields();
+      this.$emit('reset')
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

src/components/CustomInput/index.vue

+<template>
+  <div class="custom-input">
+    <el-select v-model="select.jumpType" placeholder="请选择" @change="selectType">
+      <el-option
+        v-for="(item, index) in linkTypes"
+        :key="~~index"
+        :label="item"
+        :value="~~index">
+      </el-option>
+    </el-select>
+
+    <div class="link-type-input" v-if="select.jumpType === 1">
+      <el-input v-model="select.url" placeholder="请输入外部链接" @input="blurFunc"></el-input>
+    </div>
+    <div class="link-type-input" v-if="select.jumpType === 2">
+      <el-select v-model="select.jumpId" placeholder="请选择">
+        <el-option
+          v-for="item in satelliteList"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value">
+        </el-option>
+      </el-select>
+    </div>
+    <div class="link-type-input" v-if="select.jumpType === 3">
+      <el-button type="primary" icon="el-icon-plus" v-if="!select.jumpId" @click="visible.news = true">选择动态</el-button>
+      <el-tag type="success" v-if="select.jumpId">已选择</el-tag>
+    </div>
+    <div class="link-type-input" v-if="select.jumpType === 4">
+      <el-select v-model="select.jumpId" placeholder="请选择">
+        <el-option
+          v-for="item in applicationList"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value">
+        </el-option>
+      </el-select>
+    </div>
+    <div class="link-type-input" v-if="select.jumpType === 5">
+      <el-button type="primary" icon="el-icon-plus" v-if="!select.jumpId" @click="visible.details = true">选择应用详情</el-button>
+      <el-tag type="success" v-if="select.jumpId">已选择</el-tag>
+    </div>
+    <div class="el-form-item__error" v-if="select.jumpType !== 0 && !!hasErr">{{hasErr}}</div>
+
+
+    <!-- 动态弹窗 -->
+    <el-dialog title="星云动态" :visible.sync="visible.news" append-to-body>
+      <el-table :data="newsList">
+        <el-table-column type="index" label="序号" width="50"></el-table-column>
+        <el-table-column property="title" label="标题" width="200"></el-table-column>
+        <el-table-column property="address" label="简介"></el-table-column>
+        <el-table-column property="address" label="类型"></el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+            <el-button type="primary" @click="selectFunc(scope.row)">选择</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-dialog>
+
+    <!-- 应用详情弹窗 -->
+    <el-dialog title="选择资讯" :visible.sync="visible.details" append-to-body>
+      <el-table :data="detailsList">
+        <el-table-column type="index" label="序号" width="50"></el-table-column>
+        <el-table-column property="name" label="应用类别" width="200"></el-table-column>
+        <el-table-column property="address" label="应用名称"></el-table-column>
+        <el-table-column property="address" label="发布时间"></el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+            <el-button type="primary" @click="selectFunc(scope.row)">选择</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-dialog>
+
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: "index",
+  props: {
+    value: {
+      type: Object,
+      default: () => {}
+    }
+  },
+  watch: {
+    value: {
+      handler(newVal) {
+        this.select.jumpType = newVal.jumpType
+        this.select.url = newVal.url
+        this.select.jumpId = newVal.jumpId
+      },
+      deep: true
+    }
+  },
+  data() {
+    return {
+      //跳转类型
+      linkTypes: {
+        0: "不跳转",
+        1: '外部链接',
+        2: '卫星影像',
+        3: '星云动态',
+        4: '行业应用类别',
+        5: '行业应用详情',
+      },
+      satelliteList: [],//卫星影像
+      applicationList: [],//行业应用
+      //选择的类型与对应的值
+      select: {
+        jumpType: 0,
+        url: '',
+        jumpId: null,
+        jumpObj: {}
+      },
+      visible: {
+        news: false,
+        details: false
+      },
+      newsList: [],
+      detailsList: [],
+      hasErr: ''
+    };
+  },
+  methods: {
+    showErr(err) {
+      this.hasErr = err
+    },
+    selectType() {
+      this.$emit('reset', this.select.jumpType)
+      this.showErr('')
+    },
+    blurFunc() {
+      this.emitInput(this.select.url)
+    },
+    emitInput(val) {
+      this.$emit('input', val)
+    }
+  }
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.link-type-input {
+  display: inline-block;
+}
+</style>

src/components/Kindeditor/config/fontSizeTable.js

+/*
+ * @Author: your name
+ * @Date: 2020-12-03 11:25:35
+ * @LastEditTime: 2020-12-03 11:25:35
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: \rs-cloud-platform-ui\src\components\Kindeditor\config\fontSizeTable.js
+ */
+// 字体配置
+const fontSizeTable = [
+    "9px",
+    "10px",
+    "12px",
+    "14px",
+    "16px",
+    "18px",
+    "24px",
+    "32px"
+  ];
+  export default fontSizeTable;
+  
+  
+  
\ No newline at end of file

src/components/Kindeditor/config/htmlTags.js

+/*
+ * @Author: your name
+ * @Date: 2020-12-03 11:25:13
+ * @LastEditTime: 2020-12-03 11:25:14
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: \rs-cloud-platform-ui\src\components\Kindeditor\config\htmlTags.js
+ */
+const htmlTags = {
+    font: ["color", "size", "face", ".background-color"],
+    span: ["style"],
+    div: ["class", "align", "style"],
+    table: [
+      "class",
+      "border",
+      "cellspacing",
+      "cellpadding",
+      "width",
+      "height",
+      "align",
+      "style"
+    ],
+    "td,th": [
+      "class",
+      "align",
+      "valign",
+      "width",
+      "height",
+      "colspan",
+      "rowspan",
+      "bgcolor",
+      "style"
+    ],
+    a: ["class", "href", "target", "name", "style"],
+    embed: [
+      "src",
+      "width",
+      "height",
+      "type",
+      "loop",
+      "autostart",
+      "quality",
+      "style",
+      "align",
+      "allowscriptaccess",
+      "/"
+    ],
+    img: [
+      "src",
+      "width",
+      "height",
+      "border",
+      "alt",
+      "title",
+      "align",
+      "style",
+      "/"
+    ],
+    hr: ["class", "/"],
+    br: ["/"],
+    "p,ol,ul,li,blockquote,h1,h2,h3,h4,h5,h6": ["align", "style"],
+    "tbody,tr,strong,b,sub,sup,em,i,u,strike": []
+  };
+  
+  export default htmlTags;
+  
+  
+  
\ No newline at end of file

src/components/Kindeditor/config/items.js

+/*
+ * @Author: your name
+ * @Date: 2020-12-03 11:24:54
+ * @LastEditTime: 2020-12-03 11:24:54
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: \rs-cloud-platform-ui\src\components\Kindeditor\config\items.js
+ */
+// toolbar配置
+const items = [
+    // "source",
+    // "|",
+    "undo",
+    "redo",
+    "|",
+    "preview",
+    // "print",
+    // "template",
+    // "code",
+    "cut",
+    "copy",
+    "paste",
+    "plainpaste",
+    "wordpaste",
+    "|",
+    "justifyleft",
+    "justifycenter",
+    "justifyright",
+    "justifyfull",
+    "insertorderedlist",
+    "insertunorderedlist",
+    "indent",
+    "outdent",
+    "subscript",
+    "superscript",
+    "clearhtml",
+    "quickformat",
+    // "selectall",
+    "|",
+    "fullscreen",
+    "/",
+    "formatblock",
+    // "fontname",
+    "fontsize",
+    "|",
+    "forecolor",
+    "hilitecolor",
+    "bold",
+    "italic",
+    "underline",
+    "strikethrough",
+    "lineheight",
+    "removeformat",
+    "|",
+    "image",
+    // "multiimage",
+    // "flash",
+    // "media",
+    // "insertfile",
+    // "table",
+    "hr",
+    // "emoticons",
+    // "baidumap",
+    "pagebreak",
+    "anchor",
+    "link",
+    "unlink",
+    "|",
+    "about"
+  ];
+  
+  export default items;
+  
+  
+  
\ No newline at end of file

src/components/Kindeditor/config/otherConfig.js

+/*
+ * @Author: your name
+ * @Date: 2020-12-03 11:25:52
+ * @LastEditTime: 2020-12-03 11:25:52
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: \rs-cloud-platform-ui\src\components\Kindeditor\config\otherConfig.js
+ */
+// 其他非主要配置项
+const otherConfig = {
+    noDisableItems: {
+      type: Array,
+      default: function() {
+        return ["source", "fullscreen"];
+      }
+    },
+    filterMode: {
+      type: Boolean,
+      default: true
+    },
+  
+    wellFormatMode: {
+      type: Boolean,
+      default: true
+    },
+    resizeType: {
+      type: Number,
+      default: 2
+    },
+  
+    designMode: {
+      type: Boolean,
+      default: true
+    },
+    fullscreenMode: {
+      type: Boolean,
+      default: false
+    },
+    basePath: {
+      type: String
+    },
+    themesPath: {
+      type: String
+    },
+    pluginsPath: {
+      type: String,
+      default: ""
+    },
+    langPath: {
+      type: String
+    },
+    minChangeSize: {
+      type: Number,
+      default: 5
+    },
+    loadStyleMode: {
+      type: Boolean,
+      default: true
+    },
+    urlType: {
+      type: String,
+      default: ""
+    },
+    newlineTag: {
+      type: String,
+      default: "p"
+    },
+    pasteType: {
+      type: Number,
+      default: 2
+    },
+    dialogAlignType: {
+      type: String,
+      default: "page"
+    },
+    shadowMode: {
+      type: Boolean,
+      default: true
+    },
+    zIndex: {
+      type: Number,
+      default: 811213
+    },
+    useContextmenu: {
+      type: Boolean,
+      default: true
+    },
+    syncType: {
+      type: String,
+      default: "form"
+    },
+    indentChar: {
+      type: String,
+      default: "\t"
+    },
+    cssPath: {
+      type: [String, Array]
+    },
+    cssData: {
+      type: String
+    },
+  
+    colorTable: {
+      type: Array
+    },
+    afterCreate: {
+      type: Function
+    },
+  
+    afterTab: {
+      type: Function
+    },
+    afterFocus: {
+      type: Function
+    },
+    afterBlur: {
+      type: Function
+    },
+    afterUpload: {
+      type: Function
+    },
+    uploadJson: {
+      type: String
+    },
+    fileManagerJson: {
+      type: String
+    },
+    allowPreviewEmoticons: {
+      type: Boolean,
+      default: true
+    },
+    allowImageUpload: {
+      type: Boolean,
+      default: true
+    },
+    allowFlashUpload: {
+      type: Boolean,
+      default: true
+    },
+    allowMediaUpload: {
+      type: Boolean,
+      default: true
+    },
+    allowFileUpload: {
+      type: Boolean,
+      default: true
+    },
+    allowFileManager: {
+      type: Boolean,
+      default: false
+    },
+  
+    imageTabIndex: {
+      type: Number,
+      default: 0
+    },
+    formatUploadUrl: {
+      type: Boolean,
+      default: true
+    },
+    fullscreenShortcut: {
+      type: Boolean,
+      default: false
+    },
+    extraFileUploadParams: {
+      type: Object,
+      default: function() {
+        return {};
+      }
+    },
+    filePostName: {
+      type: String,
+      default: "imgFile"
+    },
+    fillDescAfterUploadImage: {
+      type: Boolean,
+      default: false
+    },
+    afterSelectFile: {
+      type: Function
+    },
+    pagebreakHtml: {
+      type: String,
+      default: '<hr style="page-break-after: always;" class="ke-pagebreak" />'
+    },
+    allowImageRemote: {
+      type: Boolean,
+      default: true
+    },
+    autoHeightMode: {
+      type: Boolean,
+      default: false
+    },
+    fixToolBar: {
+      type: Boolean,
+      default: false
+    },
+    tabIndex: {
+      type: Number
+    }
+  };
+  
+  export default otherConfig;
+  
+  
+  
\ No newline at end of file

src/components/Kindeditor/index.vue

+<!--
+ * @Author: your name
+ * @Date: 2020-12-03 11:23:35
+ * @LastEditTime: 2020-12-03 14:15:19
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: \rs-cloud-platform-ui\src\components\Kindeditor\index.vue
+-->
+
+<template>
+  <div class="margin-top-20">
+    <textarea :id="id" name="content" v-model="outContent"></textarea>
+    <input @change="selectedFile" style="visibility: hidden;height:0;" type="file" name id="inputFile"/>
+  </div>
+</template>
+<script>
+import axios from 'axios';
+import "kindeditor/themes/default/default.css";
+import "kindeditor/kindeditor-all-min.js";
+import "kindeditor/lang/zh-CN.js";
+
+// 以下四个配置文件见下文
+import items from "./config/items";
+import htmlTags from "./config/htmlTags";
+import fontSizeTable from "./config/fontSizeTable";
+import otherConfig from "./config/otherConfig";
+
+export default {
+  name: "kindeditor-component",
+  props: {
+    // 编辑器内容 url
+    html: {
+      type: String,
+      default: ""
+    },
+    // 编辑器内容
+    content: {
+      type: String,
+      default: ""
+    },
+    // 编辑器id
+    id: {
+      type: String,
+      // required: true,
+      default: "kindeditor-id"
+    },
+    // 宽
+    width: {
+      type: String,
+      default: `100%`
+    },
+    // 高
+    height: {
+      type: String,
+      default: "400"
+    },
+    // 最小宽
+    minWidth: {
+      type: Number,
+      default: 650
+    },
+    // 最小高
+    minHeight: {
+      type: Number,
+      default: 400
+    },
+    // toolbar 工具栏配置
+    items: {
+      type: Array,
+      default: function() {
+        return [...items];
+      }
+    },
+    // 标签配置
+    htmlTags: {
+      type: Object,
+      default: function() {
+        return { ...htmlTags };
+      }
+    },
+    //字号配置
+    fontSizeTable: {
+      type: Array,
+      default: function() {
+        return [...fontSizeTable];
+      }
+    },
+    // 语言配置
+    langType: {
+      type: String,
+      default: "zh-CN"
+    },
+    // 主题配置
+    themeType: {
+      type: String,
+      default: "default"
+    },
+    // body 的样式
+    bodyClass: {
+      type: String,
+      default: "ke-content"
+    },
+    // 其他配置项
+    ...otherConfig
+  },
+  data() {
+    return {
+      editor: null,
+      outContent: this.content
+    };
+  },
+
+  watch: {
+    content(val) {
+      this.editor && val !== this.outContent && this.editor.html(val);
+    },
+    // 分发编辑器内容改变事件
+    outContent(val) {
+      this.$emit("update:content", val);
+      this.$emit("on-content-change", val);
+      this.$emit("input", val);
+    },
+    // 初始化编辑器内容
+    html(val) {
+      if (
+        this.html &&
+        (this.html.startsWith("https://") || this.html.startsWith("http://"))
+      ) {
+        this.loadUrl(val);
+      } else {
+        this.outContent = "";
+        this.outContent ? this.editor.appendHtml(this.outContent) : "";
+      }
+    }
+  },
+  created() {
+    if (
+      this.html &&
+      (this.html.startsWith("https://") || this.html.startsWith("http://"))
+    ) {
+      this.loadUrl(this.html);
+    } else {
+      this.outContent = "";
+      setTimeout(() => {
+        this.outContent ? this.editor.appendHtml(this.outContent) : "";
+      }, 1000);
+    }
+  },
+  mounted() {
+    // 初始访问时创建
+    this.initEditor();
+    //  添加焦点
+    // this.editor.focus();
+    // 添加点击图片回调函数
+    this.editor.clickToolbar("image", () => {
+      // 禁用自带的图片弹窗
+      this.editor.hideDialog();
+      // 打开文件
+      this.handleOpenFile();
+    });
+  },
+  activated() {
+    // keep-alive 进入时创建
+    this.initEditor();
+  },
+  deactivated() {
+    // keep-alive 离开时移除
+    this.removeEditor();
+  },
+  beforeDestroy() {
+    // 实例销毁之前移除
+    this.removeEditor();
+  },
+  methods: {
+    // 打开文件
+    handleOpenFile() {
+      let input = document.getElementById("inputFile");
+      // 解决同一个文件不能监听的问题
+      input.addEventListener(
+        "click",
+        function() {
+          this.value = "";
+        },
+        false
+      );
+      // 点击input
+      input.click();
+    },
+    // 选择好文件
+  async  selectedFile($event) {
+      const file = $event.target.files[0];
+
+    // 把图片上传到后端服务器 拿到url  uploadImage 是自己后端上传图片的接口
+    // 调用appendHtml方法把图片追加到富文本
+
+    // const url= await  uploadImage (file)
+    //   this.editor.appendHtml(
+    //           `<img style="max-width:100%;" src="https://${data.Location}">`
+    //         ); 
+    },
+    // 编辑器内容上传到cos，调用返回url
+    async content2Url() {
+   // 把html片段上传到后端服务器 拿到url  uploadHtml 是自己后端上传的接口
+    //   try {
+    //     const res = await uploadHtml(this.outContent)
+    //     return res
+    //   } catch (error) {
+    //     this.$message({
+    //       message: error.data.message,
+    //       type: 'error'
+    //     })
+    //   }
+    },
+    // 加载html填充编辑器内容
+    loadUrl(url) {
+      if (url && url.length > 0) {
+        axios.get(url)
+          .then(response => {
+            // 处理HTML显示
+            this.outContent = response.data;
+            this.editor.appendHtml(this.outContent);
+            this.$emit("subLoadUrlToHtml", response.data);
+          })
+          .catch(() => {
+            this.outContent = "服务器数据加载失败，请重试!";
+            this.editor.appendHtml(this.outContent);
+          });
+      }
+    },
+    // 移除编辑器实例
+    removeEditor() {
+      window.KindEditor.remove(`#${this.id}`);
+    },
+    // 初始化编辑器
+    initEditor() {
+      this.removeEditor();
+      this.editor = window.KindEditor.create("#" + this.id, {
+        width: this.width,
+        height: this.height,
+        minWidth: this.minWidth,
+        minHeight: this.minHeight,
+        items: this.items,
+        noDisableItems: this.noDisableItems,
+        filterMode: this.filterMode,
+        htmlTags: this.htmlTags,
+        wellFormatMode: this.wellFormatMode,
+        resizeType: this.resizeType,
+        themeType: this.themeType,
+        langType: this.langType,
+        designMode: this.designMode,
+        fullscreenMode: this.fullscreenMode,
+        basePath: this.basePath,
+        themesPath: this.themesPath,
+        pluginsPath: this.pluginsPath,
+        langPath: this.langPath,
+        minChangeSize: this.minChangeSize,
+        loadStyleMode: this.loadStyleMode,
+        urlType: this.urlType,
+        newlineTag: this.newlineTag,
+        pasteType: this.pasteType,
+        dialogAlignType: this.dialogAlignType,
+        shadowMode: this.shadowMode,
+        zIndex: this.zIndex,
+        useContextmenu: this.useContextmenu,
+        syncType: this.syncType,
+        indentChar: this.indentChar,
+        cssPath: this.cssPath,
+        cssData: this.cssData,
+        bodyClass: this.bodyClass,
+        colorTable: this.colorTable,
+        afterCreate: this.afterCreate,
+        // 编辑器内容改变回调
+        afterChange: () => {
+          this.editor ? (this.outContent = this.editor.html()) : "";
+        },
+        afterTab: this.afterTab,
+        afterFocus: this.afterFocus,
+        afterBlur: this.afterBlur,
+        afterUpload: this.afterUpload,
+        uploadJson: this.uploadJson,
+        fileManagerJson: this.fileManagerJson,
+        allowPreviewEmoticons: this.allowPreviewEmoticons,
+        allowImageUpload: this.allowImageUpload,
+        allowFlashUpload: this.allowFlashUpload,
+        allowMediaUpload: this.allowMediaUpload,
+        allowFileUpload: this.allowFileUpload,
+        allowFileManager: this.allowFileManager,
+        fontSizeTable: this.fontSizeTable,
+        imageTabIndex: this.imageTabIndex,
+        formatUploadUrl: this.formatUploadUrl,
+        fullscreenShortcut: this.fullscreenShortcut,
+        extraFileUploadParams: this.extraFileUploadParams,
+        filePostName: this.filePostName,
+        fillDescAfterUploadImage: this.fillDescAfterUploadImage,
+        afterSelectFile: this.afterSelectFile,
+        pagebreakHtml: this.pagebreakHtml,
+        allowImageRemote: this.allowImageRemote,
+        autoHeightMode: this.autoHeightMode,
+        fixToolBar: this.fixToolBar,
+        tabIndex: this.tabIndex
+      });
+    }
+  }
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+
+</style>
\ No newline at end of file

src/components/Upload/singleImage.vue

 <template>
-    <div class="upload-container">
-        <el-upload class="image-uploader" :data="dataObj" drag :multiple="false" :show-file-list="false" action="https://httpbin.org/post"
-            :on-success="handleImageScucess">
-            <i class="el-icon-upload"></i>
-            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
-        </el-upload>
-        <div class="image-preview">
-            <div class="image-preview-wrapper" v-show="imageUrl.length>1">
-                <img :src="imageUrl+'?imageView2/1/w/200/h/200'">
-                <div class="image-preview-action">
-                    <i @click="rmImage" class="el-icon-delete"></i>
-                </div>
-            </div>
+  <div class="upload-container">
+    <el-upload class="image-uploader" action="#" :data="dataObj" drag :multiple="false" :limit="1" :show-file-list="false" :auto-upload="false" v-show="imageUrl==''" :http-request="onUploadRequest"  :on-success="onSuccess">
+      <i class="el-icon-upload"></i>
+      <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+    </el-upload>
+    <div class="image-preview" v-show="imageUrl!=''">
+      <div class="image-preview-wrapper">
+        <img :src="imageUrl" />
+        <div class="image-preview-action">
+          <i @click="changeImage" class="el-icon-delete"></i>
         </div>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
-	// 预览效果见付费文章
-	import { getToken } from 'api/qiniu';
-	export default {
-	  name: 'singleImageUpload',
-	  props: {
-	    value: String
+import { uploadFile } from '@/api/website/newsCategory/index';
+export default {
+  name: "singleImageUpload",
+  props: {
+    value: String,
   },
-	  computed: {
-	    imageUrl() {
-	      return this.value
-    }
+  computed: {
+    imageUrl() {
+      return (!!this.value) ? this.value : '';
+    },
   },
-	  data() {
-	    return {
-	      tempUrl: '',
-	      dataObj: { token: '', key: '' }
+  data() {
+    return {
+      tempUrl: "",
+      dataObj: { token: "", key: "" },
     };
   },
-	  methods: {
-	    rmImage() {
-	      this.emitInput('');
+  methods: {
+    changeImage(file="") {
+      this.$emit("imagePreview",file)
     },
-	    emitInput(val) {
-	      this.$emit('input', val);
+    onSuccess(){
+      this.changeImage(this.tempUrl)
     },
-	    handleImageScucess() {
-	      this.emitInput(this.tempUrl)
+    //上传请求
+    onUploadRequest(data) {
+      let fileObj = data.file;
+      // FormData 对象
+      let form = new FormData();
+      // 文件对象
+      form.append("file", fileObj);
+      uploadFile(form).then(res => {
+        if (res.status == 200) {
+          console.log(res.data)
+        } else {
+          this.$message.error(res.message)
+        }
+      })
     },
-	    beforeUpload() {
-	      const _self = this;
-	      return new Promise((resolve, reject) => {
-	        getToken().then(response => {
-	          const key = response.data.qiniu_key;
-	          const token = response.data.qiniu_token;
-	          _self._data.dataObj.token = token;
-	          _self._data.dataObj.key = key;
-	          this.tempUrl = response.data.qiniu_url;
-	          resolve(true);
-        }).catch(err => {
-	          console.log(err);
-	          reject(false)
-        });
-      });
-    }
-  }
-	};
+  },
+};
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-    @import "src/styles/mixin.scss";
-    .upload-container {
+@import "src/styles/mixin.scss";
+.upload-container {
+  width: 100%;
+  position: relative;
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-start;
+  align-items: center;
+  @include clearfix;
+  .image-uploader {
+    width: 60%;
+    float: left;
+  }
+  .image-preview {
+    width: 200px;
+    height: 200px;
+    position: relative;
+    border: 1px dashed #d9d9d9;
+    float: left;
+    margin-left: 50px;
+    .image-preview-wrapper {
+      position: relative;
+      width: 100%;
+      height: 100%;
+      img {
         width: 100%;
-        position: relative;
-        @include clearfix;
-        .image-uploader {
-            width: 60%;
-            float: left;
-        }
-        .image-preview {
-            width: 200px;
-            height: 200px;
-            position: relative;
-            border: 1px dashed #d9d9d9;
-            float: left;
-            margin-left: 50px;
-            .image-preview-wrapper {
-                position: relative;
-                width: 100%;
-                height: 100%;
-                img {
-                    width: 100%;
-                    height: 100%;
-                }
-            }
-            .image-preview-action {
-                position: absolute;
-                width: 100%;
-                height: 100%;
-                left: 0;
-                top: 0;
-                cursor: default;
-                text-align: center;
-                color: #fff;
-                opacity: 0;
-                font-size: 20px;
-                background-color: rgba(0, 0, 0, .5);
-                transition: opacity .3s;
-                cursor: pointer;
-                text-align: center;
-                line-height: 200px;
-                .el-icon-delete {
-                    font-size: 36px;
-                }
-            }
-            &:hover {
-                .image-preview-action {
-                    opacity: 1;
-                }
-            }
-        }
+        height: 100%;
+      }
     }
-
+    .image-preview-action {
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      left: 0;
+      top: 0;
+      cursor: default;
+      text-align: center;
+      color: #fff;
+      opacity: 0;
+      font-size: 20px;
+      background-color: rgba(0, 0, 0, 0.5);
+      transition: opacity 0.3s;
+      cursor: pointer;
+      text-align: center;
+      line-height: 200px;
+      .el-icon-delete {
+        font-size: 36px;
+      }
+    }
+    &:hover {
+      .image-preview-action {
+        opacity: 1;
+      }
+    }
+  }
+}
 </style>

src/components/Upload/singleImage2.vue

@@ -18,7 +18,7 @@
 
 <script>
 	// 预览效果见专题
-	import { getToken } from 'api/qiniu';
+	// import { getToken } from 'api/qiniu';
 	export default {
 	  name: 'singleImageUpload2',
 	  props: {
@@ -46,20 +46,20 @@
 	      this.emitInput(this.tempUrl)
     },
 	    beforeUpload() {
-	      const _self = this;
-	      return new Promise((resolve, reject) => {
-	        getToken().then(response => {
-	          const key = response.data.qiniu_key;
-	          const token = response.data.qiniu_token;
-	          _self._data.dataObj.token = token;
-	          _self._data.dataObj.key = key;
-	          this.tempUrl = response.data.qiniu_url;
-	          resolve(true);
-        }).catch(err => {
-	          console.log(err);
-	          reject(false)
-        });
-      });
+	//       const _self = this;
+	//       return new Promise((resolve, reject) => {
+	//         getToken().then(response => {
+	//           const key = response.data.qiniu_key;
+	//           const token = response.data.qiniu_token;
+	//           _self._data.dataObj.token = token;
+	//           _self._data.dataObj.key = key;
+	//           this.tempUrl = response.data.qiniu_url;
+	//           resolve(true);
+    //     }).catch(err => {
+	//           console.log(err);
+	//           reject(false)
+    //     });
+    //   });
     }
   }
 	};

src/components/Upload/singleImage3.vue

@@ -27,7 +27,7 @@
 
 <script>
 	// 预览效果见文章
-	import { getToken } from 'api/qiniu';
+	// import { getToken } from 'api/qiniu';
 	export default {
 	  name: 'singleImageUpload',
 	  props: {
@@ -55,20 +55,20 @@
 	      this.emitInput(file.files.file)
     },
 	    beforeUpload() {
-	      const _self = this;
-	      return new Promise((resolve, reject) => {
-	        getToken().then(response => {
-	          const key = response.data.qiniu_key;
-	          const token = response.data.qiniu_token;
-	          _self._data.dataObj.token = token;
-	          _self._data.dataObj.key = key;
-	          this.tempUrl = response.data.qiniu_url;
-	          resolve(true);
-        }).catch(err => {
-	          console.log(err);
-	          reject(false)
-        });
-      });
+	//       const _self = this;
+	//       return new Promise((resolve, reject) => {
+	//         getToken().then(response => {
+	//           const key = response.data.qiniu_key;
+	//           const token = response.data.qiniu_token;
+	//           _self._data.dataObj.token = token;
+	//           _self._data.dataObj.key = key;
+	//           this.tempUrl = response.data.qiniu_url;
+	//           resolve(true);
+    //     }).catch(err => {
+	//           console.log(err);
+	//           reject(false)
+    //     });
+    //   });
     }
   }
 	};

src/components/Upload/singleImageX.vue

+<template>
+  <div class="upload-container">
+    <el-upload
+    v-show="!imageUrl"
+      ref="upload"
+      drag
+      v-loading="uploading"
+      action="#"
+      :http-request="onUploadRequest"
+      :show-file-list="false"
+      :multiple="false"
+      :limit="1">
+      <i class="el-icon-upload"></i>
+      <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+      <div class="el-upload__text">只能上传1个文件</div>
+    </el-upload>
+    <div class="image-preview" v-show="imageUrl">
+      <div class="image-preview-wrapper">
+        <img :src="imageUrl" />
+        <div class="image-preview-action">
+          <i @click="rmImage" class="el-icon-delete"></i>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+// 预览效果见专题
+import { uploadFile } from "@/api/website/newsCategory/index";
+export default {
+  name: "singleImageUpload2",
+  props: {
+    //图片地址
+    value: {
+      type: String,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      uploading: false
+    };
+  },
+  computed: {
+    imageUrl() {
+      return (!!this.value) ? this.value : ""
+    }
+  },
+  methods: {
+    //删除图片
+    rmImage() {
+      this.$refs.upload.clearFiles()
+      this.emitFunc("");
+    },
+    //上传请求
+    onUploadRequest(data) {
+      this.uploading = true;
+      let fileObj = data.file;
+      // FormData 对象
+      let form = new FormData();
+      // 文件对象
+      form.append("file", fileObj);
+
+      uploadFile(form).then(res => {
+        this.uploading = false;
+
+        if (res.status == 200) {
+          this.emitFunc(res.data)
+        } else {
+          this.emitFunc("");
+          this.$message.error(res.message)
+        }
+      })
+    },
+    //组件通信
+    emitFunc(val) {
+      this.$emit('input', val)
+    }
+  },
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+@import "src/styles/mixin.scss";
+.upload-container {
+  width: 100%;
+  display: flex;
+  @include clearfix;
+  .image-uploader {
+    width: 60%;
+    float: left;
+  }
+  .image-preview {
+    width: 200px;
+    height: 200px;
+    position: relative;
+    border: 1px dashed #d9d9d9;
+    float: left;
+    .image-preview-wrapper {
+      position: relative;
+      width: 100%;
+      height: 100%;
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+    .image-preview-action {
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      left: 0;
+      top: 0;
+      cursor: default;
+      text-align: center;
+      color: #fff;
+      opacity: 0;
+      font-size: 20px;
+      background-color: rgba(0, 0, 0, 0.5);
+      transition: opacity 0.3s;
+      cursor: pointer;
+      text-align: center;
+      line-height: 200px;
+      .el-icon-delete {
+        font-size: 36px;
+      }
+    }
+    &:hover {
+      .image-preview-action {
+        opacity: 1;
+      }
+    }
+  }
+}
+</style>

src/components/Upload/singleImageXdemo.vue

+<template>
+  <div class="upload-container">
+    <div class="image-preview" v-show="imageUrl">
+      <div class="image-preview-wrapper">
+        <img :src="imageUrl" />
+        <div class="image-preview-action">
+          <i @click="rmImage" class="el-icon-delete"></i>
+        </div>
+      </div>
+    </div>
+    <el-upload
+      v-show="!imageUrl" 
+      ref="upload"
+      drag
+      v-loading="uploading"
+      action="#"
+      :http-request="onUploadRequest"
+      :show-file-list="false"
+      :multiple="false"
+      :limit="1">
+      <i class="el-icon-upload"></i>
+      <div class="el-upload__text">将文件拖到此处或<em>点击上传</em></div>
+    </el-upload>
+  </div>
+</template>
+
+<script>
+// 预览效果见专题
+import { uploadFile } from "@/api/website/newsCategory/index";
+export default {
+  name: "singleImageUpload2",
+  props: {
+    //图片地址
+    value: {
+      type: String,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      uploading: false
+    };
+  },
+  computed: {
+    imageUrl() {
+      return (!!this.value) ? this.value : ""
+    }
+  },
+  methods: {
+    //删除图片
+    rmImage() {
+      this.$refs.upload.clearFiles()
+      this.emitFunc("");
+    },
+    //上传请求
+    onUploadRequest(data) {
+      this.uploading = true;
+      let fileObj = data.file;
+      // FormData 对象
+      let form = new FormData();
+      // 文件对象
+      form.append("file", fileObj);
+      // 上传文件
+      uploadFile(form).then(res => {
+        this.uploading = false;
+        if (res.status == 200) {
+          this.emitFunc(res.data)
+        } else {
+          this.emitFunc("");
+          this.$message.error(res.message)
+        }
+      })
+    },
+    //组件通信
+    emitFunc(val) {
+      this.$emit('onPreview', val)
+    }
+  },
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+@import "src/styles/mixin.scss";
+.upload-container {
+  width: 100%;
+  display: flex;
+  @include clearfix;
+  .image-uploader {
+    width: 60%;
+    float: left;
+  }
+  .image-preview {
+    width: 200px;
+    height: 200px;
+    position: relative;
+    border: 1px dashed #d9d9d9;
+    float: left;
+    .image-preview-wrapper {
+      position: relative;
+      width: 100%;
+      height: 100%;
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+    .image-preview-action {
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      left: 0;
+      top: 0;
+      cursor: default;
+      text-align: center;
+      color: #fff;
+      opacity: 0;
+      font-size: 20px;
+      background-color: rgba(0, 0, 0, 0.5);
+      transition: opacity 0.3s;
+      cursor: pointer;
+      text-align: center;
+      line-height: 200px;
+      .el-icon-delete {
+        font-size: 36px;
+      }
+    }
+    &:hover {
+      .image-preview-action {
+        opacity: 1;
+      }
+    }
+  }
+}
+</style>

src/router/index.js

@@ -105,6 +105,24 @@ export const asyncRouterMap = [{
     authority: 'gateLogManager'
   }]
 },
+{
+  path: '/industryApplication',
+  component: Layout,
+  name: '基础配置管理',
+  icon: 'setting',
+  authority: 'industryApplication',
+  children: [{
+    path: 'applicationList',
+    component: _import('webSiteManagement/industryApplication/applicationList/index'),
+    name: '应用详情',
+    authority: 'applicationList'
+  },{
+    path: 'applicationCate',
+    component: _import('webSiteManagement/industryApplication/applicationCate/index'),
+    name: '类别管理',
+    authority: 'applicationCate'
+  }],
+},
 {
   path: '/webSiteManagement',
   component: Layout,
@@ -113,10 +131,34 @@ export const asyncRouterMap = [{
   authority: 'webSiteManagement',
   children: [{
     path: 'nebulaDynamics',
-    component: _import('nebulaDynamics/newsCategory'),
+    component: _import('webSiteManagement/newsCategory/index'),
     name: '星云动态',
-    authority: 'nebulaDynamics'
+    authority: 'nebulaDynamics',
+    children: [{
+      path: 'newsCreator',
+      component: _import('webSiteManagement/newsCategory/newsCreator/index'),
+      name: '创建资讯文章',
+      authority: 'newsCreator',
+    }]
+  },{
+    path: 'bannerSetting',
+    component: _import('webSiteManagement/bannerSetting/index'),
+    name: 'banner管理',
+    authority: 'bannerSetting',
+  },{
+    path: 'satelliteIntroduction',
+    component: _import('webSiteManagement/satelliteIntroduction/index'),
+    name: '卫星介绍',
+    authority: 'satelliteIntroduction',
+  },{
+    path: 'imageLibrary',
+    component: _import('webSiteManagement/imageLibrary/index'),
+    name: '影像图库',
+    authority: 'imageLibrary',
+  },{
+    path: 'aboutUs',
+    component: _import('webSiteManagement/aboutUs/index'),
+    name: '关于我们',
+    authority: 'aboutUs',
   }]
-}
-];
+}];
\ No newline at end of file
-

src/utils/formDatas.js

+//单选组
+let radioGroup = {
+  isDel: {
+    0: '否',
+    1: '是'
+  },
+  status: {
+    1: '启用',
+    2: '禁用',
+  },
+  indexShow: {
+    1: '展示',
+    2: '不展示',
+  },
+  jumpType: {
+    0: '不跳转',
+    1: '商品详情页',
+    2: '店铺首页',
+  }
+}
+
+
+//banner表单项
+export const banner = {
+  init: () => ({
+    title: "",
+    cover: "",
+    rank: "",
+    url: "",
+    status: 1,
+    jumpType: 0,
+    jumpId: '',
+    id: null
+  }),
+  rules: {
+    title: [
+      { required: true, message: '请输入标题', trigger: 'blur' }
+    ],
+    cover: [
+      { required: true, message: '请上传封面图片', trigger: 'change' }
+    ],
+    rank: [
+      { required: true, message: '请设置0-10000，数值越大排序越靠前', trigger: 'blur' }
+    ],
+    status: [
+      { required: true, message: '请选择是否启用', trigger: 'change' }
+    ]
+  },
+  formInfo: {
+    title: { label: "标题" },
+    cover: { label: "封面地址", type: 'file' },
+    rank: { label: "排序", placeholder: '请设置0-10000，数值越大排序越靠前'},
+    url: { label: "链接到", type: 'custom' },
+    status: { label: "状态", type: 'radio', radioArr: radioGroup.status },//是否启用，1、启用，2、禁用
+  }
+}
+
+//卫星介绍表单项
+export const satelliteIntroduction = {
+  init: () => ({
+    name: "",//标题名称
+    resolution: "",//分辨率
+    coverImg: "",//封面图
+    iconImg: "",//图标
+    // intro: "",//介绍
+    content: "",//详细内容
+    rank: '',//排序
+    status: 1//是否启用
+  }),
+  rules: {
+    name: [
+      { required: true, message: '请输入卫星名称', trigger: 'blur' }
+    ],
+    resolution: [
+      { required: true, message: '请输入分辨率', trigger: 'blur' }
+    ],
+    rank: [
+      { required: true, message: '请设置0-10000，数值越大排序越靠前', trigger: 'blur' }
+    ],
+    coverImg: [
+      { required: true, message: '请输入封面图链接', trigger: 'blur' }
+    ],
+    iconImg: [
+      { required: true, message: '请输入图标链接', trigger: 'blur' }
+    ],
+    content: [
+      { required: true, message: '请输入详细内容', trigger: 'blur' }
+    ],
+    // intro: [
+    //   { required: true, message: '请输入介绍', trigger: 'blur' }
+    // ]
+  },
+  formInfo: {
+    name: { label: "卫星名称" },
+    resolution: { label: "分辨率" },
+    coverImg: { label: "封面图", type: 'file'},
+    iconImg: { label: "图标", type: 'file'},
+    rank: { label: "排序" },
+    // intro: { label: "介绍"},
+    content: { label: "详细内容", type: 'kindEditor'},
+  }
+}

src/views/admin/user/index.vue

 <template>
   <div class="app-container calendar-list-container">
     <div class="filter-container">
-      <el-button
-        class="add-btn-default"
-        type="primary"
-        v-waves
-        @click="handleCreate"
-      >
+      <el-button class="add-btn-default" type="primary" v-waves @click="handleCreate">
         <i class="el-icon-plus"></i>添加后台用户
       </el-button>
     </div>
-    <el-table
-      :key="tableKey"
-      :data="list"
-      v-loading.body="listLoading"
-      border
-      fit
-      highlight-current-row
-      style="width: 100%"
-    >
+    <el-table :key="tableKey" :data="list" v-loading.body="listLoading" border fit highlight-current-row style="width: 100%">
       <el-table-column align="center" label="ID" width="65">
         <template slot-scope="scope">
           <span>{{scope.row.id}}</span>
@@ -41,12 +28,7 @@
       </el-table-column>
       <el-table-column align="center" label="操作">
         <template slot-scope="scope">
-          <el-button
-            v-if="userManager_btn_edit"
-            size="small"
-            type="success"
-            @click="handleUpdate(scope.row)"
-          >编辑</el-button>
+          <el-button v-if="userManager_btn_edit" size="small" type="success" @click="handleUpdate(scope.row)">编辑</el-button>
 <!--          <el-button-->
 <!--            v-if="scope.row.status==2"-->
 <!--            size="small"-->
@@ -59,56 +41,29 @@
 <!--            type="warning"-->
 <!--            @click="UpdateStatus(scope.row,2)"-->
 <!--          >停用</el-button>-->
-          <el-button
-            v-if="userManager_btn_del"
-            size="small"
-            type="danger"
-            @click="handleDelete(scope.row)"
-          >删除</el-button>
+          <el-button v-if="userManager_btn_del" size="small" type="danger" @click="handleDelete(scope.row)">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
     <div v-show="!listLoading" class="pagination-container">
-      <el-pagination
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-        :current-page.sync="listQuery.page"
-        :page-sizes="[10,20,30, 50]"
-        :page-size="listQuery.limit"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="total"
-      ></el-pagination>
+      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="listQuery.page" :page-sizes="[10,20,30, 50]" :page-size="listQuery.limit" layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
     </div>
+    <!-- 弹窗框 -->
     <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
       <el-form :model="form" :rules="rules" ref="form" label-width="100px">
         <el-form-item label="账号" prop="username">
           <!--v-if="dialogStatus == 'create'"-->
           <el-input  v-model="form.username" style="width:30%" placeholder="请输入账号"></el-input>
         </el-form-item>
-        <el-form-item
-          v-if="dialogStatus == 'create'"
-          label="密码"
-          placeholder="请输入密码"
-          prop="password"
-        >
+        <el-form-item v-if="dialogStatus == 'create'" label="密码" placeholder="请输入密码" prop="password">
           <el-input type="password" style="width:30%" v-model="form.password"></el-input>
         </el-form-item>
         <el-form-item v-if="dialogStatus == 'update'" label="密码" placeholder="请输入密码" prop="passwordEdit">
           <el-input type="password" style="width:30%" v-model="form.passwordEdit"></el-input>
         </el-form-item>
         <el-form-item label="角色" prop="members">
-          <el-select
-            class="filter-item"
-            v-model="form.members"
-            placeholder="请选择角色"
-            filterable
-          >
-            <el-option
-              v-for="(val, key, index) in list_All "
-              :key="val.id"
-              :label="val.name"
-              :value="val.id"
-            ></el-option>
+          <el-select class="filter-item" v-model="form.members" placeholder="请选择角色" filterable>
+            <el-option v-for="(val, key, index) in list_All " :key="val.id" :label="val.name" :value="val.id"></el-option>
           </el-select>
 <!--          <el-autocomplete-->
 <!--            class="inline-input"-->
@@ -590,4 +545,4 @@ export default {
     }
   }
 };
-</script>
+</script>
\ No newline at end of file

src/views/layout/AppMain.vue

+<!--
+ * @Author: your name
+ * @Date: 2020-12-01 09:54:12
+ * @LastEditTime: 2020-12-01 10:51:47
+ * @LastEditors: your name
+ * @Description: In User Settings Edit
+ * @FilePath: \rs-cloud-platform-ui\src\views\layout\AppMain.vue
+-->
 <template>
-
+  <!-- 分页栏 -->
 	<section class="app-main" style="min-height: 100%;">
 		<transition name="fade" mode="out-in">
 			<router-view :key="key"></router-view>

src/views/layout/Layout.vue

 <template>
   <div class="app-wrapper">
     <div class="stair">
-      <!-- 一级 -->
+
+      <!-- 一级列表 -->
       <div :class="{ pandect: true, firstChange: isFirstChange }">
         <ul class="stairList">
-          <li
-            :class="{ active: firstActive == '' }"
-            @click="getSecondRoute('', '', '')"
-          >
+          <li :class="{ active: firstActive == '' }" @click="getSecondRoute('', '', '')">
             <i class="el-icon-shopping-bag-1"></i>
             <p>概况</p>
           </li>
-          <li
-            v-for="(item, index) in permissionMenusArr"
-            :key="index"
-            @click="getSecondRoute(index, item.code, item.title, 1)"
-            :class="{ active: firstActive == item.title }"
-          >
+          <li v-for="(item, index) in permissionMenusArr" :key="index" @click="getSecondRoute(index, item.code, item.title, 1)" :class="{ active: firstActive == item.title }">
             <i class="el-icon-shopping-bag-1"></i>
             <p>{{ item.title }}</p>
           </li>
         </ul>
       </div>
+
       <!-- 折叠按钮 -->
       <!-- <div :class="{folded:true,mySecondBtn:isMySecondBtn,firstBtn:isFirstBtn}">
         <div v-show="foldedStatus != 3" class="fold" @click="secondFoldBtn"><i class="el-icon-arrow-left"></i></div>
         <div v-show="foldedStatus == 1 || foldedStatus == 3 " class="foldFirst" @click="openFoldBtn"><i class="el-icon-arrow-right"></i></div>
       </div>-->
 
-      <!-- 顶部 -->
+      <!-- 顶部栏 -->
       <div class="topNav">
         <div class="navName"> 管理平台 </div>
         <p class="topHead">
@@ -43,56 +37,30 @@
           </el-dropdown>
         </p>
       </div>
-      <!-- 二级 -->
-      <div
-        :class="{
-          secondLevel: true,
-          isStatistics: secondFold,
-          secondChnage: isSecondChnage,
-        }"
-        v-show="!unStatistics"
-      >
+
+      <!-- 二级列表 -->
+      <div :class="{secondLevel: true,isStatistics: secondFold,secondChnage: isSecondChnage,}" v-show="!unStatistics">
         <ul>
-          <li
-            :class="{
-              active: secondActive == item.title,
-              unright: item.menuStatus == 1,
-            }"
-            v-for="(item, index) in secondRoute"
-            :key="index"
-            @click="getThreeRoute(index, item.code, item.title, 1)"
-          >
+          <li :class="{ active: secondActive == item.title,unright: item.menuStatus == 1,}" v-for="(item, index) in secondRoute" :key="index" @click="getThreeRoute(index, item.code, item.title, 1)">
             {{ item.title }}
           </li>
         </ul>
       </div>
+
       <!-- 主体内容 -->
-      <div
-        :class="{
-          'main-content': true,
-          mainAnimation: isMainAnimation,
-          firstMain: isFirstMain,
-          secondMain: isSecondMain,
-        }"
-        v-show="!unStatistics"
-      >
+      <div :class="{ 'main-content': true,mainAnimation: isMainAnimation,firstMain: isFirstMain,secondMain: isSecondMain,}" v-show="!unStatistics">
         <div class="main-container">
+          <!-- 路由标题栏 -->
           <ul class="entPly" v-if="threeRoute.children != ''">
-            <li
-              :class="{ active: threeActive == item.title }"
-              v-for="(item, index) in threeRoute.children"
-              :key="index"
-              @click="getContent(index, item.code, item.title)"
-            >
+            <li :class="{ active: threeActive == item.title }" v-for="(item, index) in threeRoute.children" :key="index" @click="getContent(index, item.code, item.title)">
               {{ item.title }}
             </li>
           </ul>
-          <app-main
-            v-show="threeMain"
-            :threeRoutes="threeRoute.children != '' ? 2 : 1"
-          ></app-main>
+          <!-- 内容组件 -->
+          <app-main v-show="threeMain" :threeRoutes="threeRoute.children != '' ? 2 : 1"></app-main>
         </div>
       </div>
+
     </div>
   </div>
 </template>
@@ -472,13 +440,14 @@ export default {
       this.firstActive = name;
       this.threeMain = false;
       this.unStatistics = true;
-      console.log(this.permissionMenusArr)
+      console.log("permissionMenusArr=>",this.permissionMenusArr)
+      console.log(this.permissionMenusArr[1].children[1].title,this.permissionMenusArr[1].children[1].children)
       if (code) {
         this.secondRoute = objDeepCopy(this.permissionMenus[val].children);
         this.secondName = this.permissionMenusArr[val].code;
         this.unStatistics = false;
         this.secondActive = this.secondRoute[0].title;
-        console.log(this.secondActive);
+        console.log("secondActive=>",this.secondActive);
         this.threeMain = true;
         // 点击一级自动打开子级第一个页面
         if (this.secondRoute[0].children == "") {
@@ -497,14 +466,18 @@ export default {
               }
             );
           } else if (!type) {
+
           } else {
             this.threeRoute.children = [];
             this.$router.push("/" + code + "/" + this.secondRoute[0].code);
+            console.log("二级列表导航=>","/" + code + "/" + this.secondRoute[0].code);
           }
         } else if (!type) {
+
         } else {
           this.threeActive = this.secondRoute[0].children[0].title;
           this.threeRoute.children = objDeepCopy(this.secondRoute[0].children);
+          console.log("threeRoute.children=>",this.threeRoute.children)
           // console.log( this.secondRoute[0]);
           this.threeName = this.secondRoute[0].code;
           if (this.secondRoute[0].menuStatus == 1) {
@@ -522,18 +495,13 @@ export default {
               }
             );
           } else {
-            this.$router.push(
-              "/" +
-                this.secondRoute[0].code +
-                "/" +
-                this.secondRoute[0].children[0].code
-            );
+            this.$router.push("/" + this.secondRoute[0].code + "/" + this.secondRoute[0].children[0].code);
+            console.log("二级列表导航=>","/" + this.secondRoute[0].code + "/" + this.secondRoute[0].children[0].code);
           }
         }
       } else {
         this.unStatistics = true;
         this.secondRoute = [];
-
         this.$router.push({
           path: "/",
         });
@@ -542,11 +510,11 @@ export default {
     // 获取三级列表
     getThreeRoute(val, code, name, type) {
       this.secondActive = name;
-      console.log(this.secondActive);
-
+      console.log("secondActive=>",this.secondActive);
       this.threeRoute = this.secondRoute[val];
       this.threeMain = true;
       if (this.threeRoute.children == "") {
+        console.log("三级列表导航路径1=>","/" + this.secondName + "/" + this.threeRoute.code);
         this.$router.push("/" + this.secondName + "/" + this.threeRoute.code);
       } else if (!type) {
         this.threeName = this.threeRoute.code;
@@ -566,10 +534,10 @@ export default {
             }
           );
         } else {
-          this.$router.push(
-            "/" + this.threeRoute.code + "/" + this.threeRoute.children[0].code
-          );
+          console.log("三级列表导航路径2=>","/" + this.threeRoute.code + "/" + this.threeRoute.children[0].code);
+          this.$router.push("/" + this.threeRoute.code + "/" + this.threeRoute.children[0].code);
           this.threeActive = this.threeRoute.children[0].title;
+          console.log("threeRoute.children=>",this.threeRoute.children)
         }
       }
     },
@@ -578,6 +546,8 @@ export default {
       this.threeActive = name;
       this.threeMain = true;
       this.$router.push("/" + this.threeName + "/" + code);
+      console.log("threeActive",name)
+      console.log("主题内容导航=>","/" + this.threeName + "/" + code);
     },
   },
 };
@@ -600,8 +570,7 @@ body {
   z-index: 70;
   top: 70vh;
   left: 223px;
-  .fold,
-  .foldFirst {
+  .fold,.foldFirst {
     color: rgba(81, 120, 242, 1);
     background: #fff;
     padding: 6px 0px;
@@ -614,7 +583,6 @@ body {
     margin-top: 5px;
   }
 }
-
 li {
   list-style: none;
 }
@@ -1037,4 +1005,4 @@ li {
     /*margin-left: 210px;*/
   }
 }
-</style>
+</style>
\ No newline at end of file

src/views/nebulaDynamics/newsCategory.vue

-<template>
-</template>

src/views/nebulaDynamics/newsList.vue

-<template>
-</template>

src/views/webSiteManagement/aboutUs/index.vue

+<!--
+ * @Author: your name
+ * @Date: 2020-12-01 09:07:41
+ * @LastEditTime: 2020-12-03 15:40:18
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: \rs-cloud\src\views\webSiteManagement\aboutUs.vue
+-->
+<template>
+  <div id="AboutUs">
+    <!-- 顶部功能栏 -->
+    <div class="top">
+      <div class="title">关于我们</div>
+    </div>
+    <div class="content">
+      <el-form ref="form" :model="form" label-width="180px">
+        <el-form-item label="*联系电话">
+          <el-col :span="12">
+              <el-input v-model="form.title" placeholder="请输入联系电话"></el-input>
+          </el-col>
+        </el-form-item>
+        <el-form-item label="*邮箱">
+          <el-col :span="12">
+              <el-input v-model="form.email" placeholder="请输入邮箱"></el-input>
+          </el-col>
+        </el-form-item>
+        <el-form-item label="*公司地址">
+          <el-col :span="12">
+              <el-input v-model="form.address" placeholder="请输入公司地址"></el-input>
+          </el-col>
+        </el-form-item>
+        <el-form-item label="">
+          <div id="map-container">
+            <baidu-map class="bm-view"></baidu-map>
+          </div>
+        </el-form-item>
+        <el-form-item label="*公司简介">
+            <el-col :span="20">
+                <Kind-editor  ref="kindeditor" :html="form.html" @input="getContent"></Kind-editor>
+            </el-col>
+        </el-form-item>
+        <el-form-item>
+          <el-button>取消</el-button>
+          <el-button type="primary" @click="onSubmit">确定</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+  </div>
+</template>
+
+<script>
+import KindEditor from "@/components/Kindeditor"; 
+export default {
+  name: "AboutUs",
+  components: {
+      KindEditor
+  },
+  data() {
+    return {
+      form: {
+          title: '',
+          email: '',
+          address: '',  
+          html: 'https://ebusiness-1255313385.cosbj.myqcloud.com/image/20190823/center2019082304054532.html',
+          introduce: ''
+      }
+    };
+  },
+  mounted() {
+
+  },
+  methods: {
+    // 获取编辑器内容
+    getContent(introduce) {
+        this.form.introduce = introduce
+    },
+    // 编辑器内容转换成在线url
+    async getcontent2Url() {
+        try {
+            const htmlUrl =  await this.$refs.kindeditor.content2Url()
+            return htmlUrl
+        } catch (error) {
+            console.log(error)
+        }
+    },
+    onSubmit() {
+      console.log('submit!');
+    }
+  },
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+#AboutUs {
+  margin: 0 1% 0 1%;
+  width: 98%;
+  height: auto;
+  .top {
+    width: 100%;
+    height: 68px;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    overflow: hidden;
+    border-bottom: 1px solid #eeeeee;
+    .title {
+      width: 114px;
+      height: 46px;
+      display: flex;
+      flex-direction: row;
+      justify-content: center;
+      align-items: center;
+      color: #000000;
+      overflow: hidden;
+    }
+  }
+  .content {
+    margin: 1% 1% 0 1%;
+    width: 98%;
+    height: calc(99% - 68px);
+  }
+  #map-container{
+    width: 500px;
+    height: 250px;
+  }
+}
+</style>
\ No newline at end of file

src/views/webSiteManagement/bannerSetting/index.vue

+<template>
+  <div class="container">
+    <!-- 头部 -->
+    <div class="head">
+      <div>banner列表</div>
+      <el-button type="primary" @click="addItem">添加banner</el-button>
+    </div>
+    <!-- 主体 -->
+    <div class="app-container calendar-list-container">
+      <!-- 条件搜索 -->
+      <div class="filter-container">
+        <el-form :inline="true" :model="searchForm" class="demo-form-inline">
+          <el-form-item label="所有状态">
+            <el-select v-model="searchForm.status">
+              <el-option v-for="(item, index) in bannerStatus" :key="index" :label="item" :value="~~index"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="banner标题">
+            <el-input v-model="searchForm.title" placeholder="请输入banner标题"></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" plain @click="filterData">搜索</el-button>
+            <el-button type="primary" plain @click="clearFilterData">清除搜索</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+
+      <!-- 数据列表 -->
+      <el-table :data="list" v-loading.body="listLoading" border fit highlight-current-row style="width: 100%">
+        <el-table-column align="center" type="index" label="序号" width="65"></el-table-column>
+        <el-table-column align="center" label="banner标题" prop="title"></el-table-column>
+        <el-table-column align="center" label="banner图">
+          <template slot-scope="scope">
+            <img class="cover" :src="scope.row.cover" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="状态">
+          <template slot-scope="scope">
+            <!-- 根据状态获取对应中文 -->
+            {{ getStatus(scope.row.status) }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="操作" width="250">
+          <template slot-scope="scope">
+            <el-button type="primary" size="mini" @click="edit(scope.row)">编辑</el-button>
+            <el-button :type="scope.row.status === 1 ? 'info': 'warning'" size="mini" @click="changeParams(scope.row, 'status')">{{scope.row.status === 1 ? '下架': '上架'}}</el-button>
+            <el-button type="danger" size="mini" @click="changeParams(scope.row, 'isDel')">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!-- 分页 -->
+      <div class="page-foot">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :page-size="listQuery.limit"
+          :total="total" @current-change="currentChange">
+        </el-pagination>
+      </div>
+
+
+      <!-- 添加、编辑弹窗 -->
+       <el-dialog
+        top="10%"
+        :close-on-click-modal="false"
+        :title="dialogTitle"
+        :visible.sync="dialogVisible">
+        <!--<el-form
+          ref="ruleForm"
+          size="small"
+          label-position="right"
+          :model="editForm"
+          :rules="editFormRules"
+          label-width="100px"
+          class="demo-ruleForm">
+          <el-form-item v-for="(item, index) in editFormInfo" :key="index" :label="item.label" :prop="index">
+
+            <div v-if="item.type && item.type == 'file'">
+              <my-upload :value="editForm.cover" @input="getSrc"></my-upload>
+            </div>
+
+            <div v-else-if="item.type && item.type == 'radio'">
+              <el-radio-group v-model="editForm[index]">
+                <el-radio v-for="(item, index) in item.radioArr" :key="~~index" :label="~~index">{{item}}</el-radio>
+              </el-radio-group>
+            </div>
+
+            <div v-else-if="item.type && item.type == 'custom'">
+              <custom-input @input="getCustomInput"></custom-input>
+            </div>
+
+            <div v-else>
+              <el-input v-model="editForm[index]" :placeholder="item.placeholder || `请输入banner${item.label}`"></el-input>
+            </div>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="submitForm()">确定</el-button>
+            <el-button type="info" @click="resetForm()">取消</el-button>
+          </el-form-item>
+        </el-form> -->
+
+        <custom-form
+        :formData="formObject"
+        @submitFunc="updateFunc"
+        @reset="resetForm"
+        ></custom-form>
+      </el-dialog>
+
+    </div>
+
+  </div>
+</template>
+
+<script>
+import { banner } from "@/utils/formDatas.js"//表单数据
+import { page, update } from "@/api/website/banner"//接口
+
+// import myUpload from "@/components/Upload/singleImageX"//上传组件
+// import customInput from "@/components/CustomInput"//自定义组件
+import CustomForm from "@/components/CustomForm"
+
+export default {
+  name: "bannerSetting",
+  components: {
+    CustomForm
+  },
+  data() {
+    return {
+      data: null,//原数据
+      list: null,//赋值数据 | 过滤数据
+      total: null,//总个数
+      listLoading: true,//请求加载状态
+      //请求参数。页码页数等
+      listQuery: {
+        page: 1,
+        limit: 20
+      },
+      //搜索表单
+      searchForm: {
+        status: 0,
+        title: ""
+      },
+      // //添加banner与修改banner的form对象
+      // editForm: banner.init(),//提交的表单参数
+      // editFormInfo: banner.formInfo,//表单项。
+      // editFormRules: banner.rules,//表单规则
+      formObject: {
+        formVal: banner.init(),//提交的表单参数
+        rules: banner.rules,//表单规则
+        formItem: banner.formInfo,//表单项。
+      },
+      //是否启用，1、启用，2、禁用
+      bannerStatus: {
+        0: '全部',
+        1: '启用',
+        2: '禁用',
+      },
+      dialogVisible: false,//弹窗显示控制
+      dialogTitle: "新增banner"//弹窗标题
+    }
+  },
+  mounted() {
+    this.getList()//获取数据
+  },
+  methods: {
+    //获取图片链接
+    getSrc(val) {
+      this.editForm.cover = val
+    },
+    //获取自定义组件值
+    getCustomInput(val) {
+      this.editForm.url = val
+    },
+    //清除搜索
+    filterData() {
+      if (this.searchForm.status === 0 && this.searchForm.title === '') {
+        this.list = this.data;
+        return ;
+      }
+      let temp = this.data.filter(v => this.searchForm.status === 0 ? true: !!(this.searchForm.status === v.status))
+      if (!!this.searchForm.title) {
+        temp = temp.filter(v => v.title.includes(this.searchForm.title))
+      }
+
+      this.list = temp
+    },
+    //清除搜索
+    clearFilterData() {
+      this.searchForm = {
+        status: 0,
+        title: ""
+      }
+      this.list = this.data;
+    },
+    //切换页码
+    currentChange(val) {
+      this.listQuery.page = val;
+      this.getList();
+    },
+    //编辑
+    edit(row) {
+      this.dialogTitle = "编辑banner";
+
+      this.formObject.formVal = this.filterParams(row)
+      this.dialogVisible = true;
+
+      console.log(this.formObject.formVal)
+    },
+    //更新方法
+    updateFunc(params) {
+      params.rank = ~~params.rank;
+      update(params).then(res => {
+        if (res.status ==  200) {
+          this.dialogVisible = false;
+          this.getList();
+        } else {
+          this.$message.error(res.message);
+        }
+      })
+    },
+    //取消表单
+    resetForm() {
+      this.dialogVisible = false;
+    },
+    //新增banner
+    addItem() {
+      this.dialogTitle = "新增banner";
+      this.dialogVisible = true;
+      this.formObject.formVal = banner.init();
+    },
+    filterParams(row) {
+      let a = {};
+      for (let i in this.formObject.formVal) {
+        a[i] = row[i] || null
+      }
+      return a
+    },
+    //获取状态
+    getStatus(val) {
+      return this.bannerStatus[val]
+    },
+    //上下架、删除更新
+    changeParams(row, key) {
+      this.$confirm('确定继续执行该操作吗?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          this.formObject.formVal = row;
+          this.formObject.formVal = this.filterParams(row)
+          if (key == 'isDel') {
+            this.formObject.formVal[key] = row[key] == 0 ? 1 : 0;
+          } else {
+            this.formObject.formVal[key] = row[key] == 1 ? 2 : 1;
+          }
+
+          //更新专题
+          this.updateFunc(this.formObject.formVal);
+        })
+
+    },
+    //获取banner列表
+    getList() {
+      this.listLoading = true;
+      page(this.listQuery).then(res => {
+        this.list = res.data.data
+        this.data = res.data.data
+        this.total = res.data.totalCount;
+        this.listLoading = false;
+      }).catch(err => {
+        this.listLoading = false;
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 20px;
+  width: 100%;
+  border-bottom: 1px solid #e6e6e6;
+}
+.cover {
+  max-width: 200px;
+  height: auto;
+}
+.page-foot {
+  display: flex;
+  justify-content: center;
+  margin-top: 20px;
+}
+</style>

src/views/webSiteManagement/imageLibrary/index.vue

+<!--
+ * @Author: your name
+ * @Date: 2020-12-01 09:06:33
+ * @LastEditTime: 2020-12-01 09:06:53
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: \rs-cloud\src\views\webSiteManagement\imageLibrary.vue
+-->
+<template>
+  <div id='Container'>
+      影像图库
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Container',
+  components: {
+
+  },
+  data(){
+    return {
+
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+
+  },
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+
+</style>

src/views/webSiteManagement/industryApplication/applicationList/index.vue

+<!--
+ * @Author: your name
+ * @Date: 2020-12-02 10:27:53
+ * @LastEditTime: 2020-12-03 17:26:12
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: \rs-cloud-platform-ui\src\views\webSiteManagement\industryApplication\applicationList\index.vue
+-->
+<template>
+  <div id="ApplicationList">
+    <!-- 操作表格栏 -->
+    <div class="operators">
+      <div class="applyName">
+        <span>应用名称</span>
+        <el-col :span="16">
+          <el-input
+            v-model="applyName"
+            placeholder="请输入类型名称"
+            size="100px"
+          ></el-input>
+        </el-col>
+      </div>
+      <div class="status">
+        <span>所有状态</span>
+        <el-select v-model="currentStatus" placeholder="全部">
+          <el-option
+            v-for="item in status"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </div>
+      <div class="types">
+        <span>应用类别</span>
+        <el-select v-model="currentType" placeholder="全部">
+          <el-option
+            v-for="item in types"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </div>
+      <div class="controls">
+        <div
+          class="item"
+          v-for="(item, index) in operatorControls"
+          :key="index"
+        >
+          {{ item.name }}
+        </div>
+      </div>
+      <div class="addCate">
+          <div class="add">
+              新增应用
+          </div>
+      </div>
+    </div>
+    <!-- 添加类别弹框 -->
+    <!-- <el-dialog title="添加类别" :visible.sync="typeManagerVisible" append-to-body>
+        <div id="addCateManager">
+          <el-form ref="form" :model="form" label-width="80px">
+            <el-form-item label="*应用类别">
+                <el-col :span="12">
+                    <el-input v-model="form.type" placeholder="请输入资讯标题"></el-input>
+                </el-col>
+            </el-form-item>
+            <el-form-item label="*封面图">
+                <singleImageX :value="form.coverImg" @input="onPreview"></singleImageX>
+            </el-form-item>
+            <el-form-item label="*简介">
+                <el-col :span="12">
+                    <el-input v-model="form.introduce" placeholder="请输入资讯简介"></el-input>
+                </el-col>
+            </el-form-item>
+            <el-form-item label="*排序">
+                <el-col :span="12">
+                    <el-input v-model="form.sort" placeholder="请输入序号"></el-input>
+                </el-col>
+            </el-form-item>
+            <el-form-item>
+                <el-button @click="typeManagerVisible=false">取消</el-button>
+                <el-button type="primary" @click="onSubmit">确定</el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+    </el-dialog> -->
+    <!-- 表格 -->
+    <div class="table">
+      <el-table :data="tableData" border fit highlight-current-row style="width: 100%">
+        <el-table-column label="序号" width="100" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.id }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="应用类别" width="200" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.type }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="应用名称" align="center">
+          <template slot-scope="scope">
+            <span class="introduce">{{ scope.row.name }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="详情图" align="center">
+          <template slot-scope="scope">
+            <span>
+              <img
+                class="icon"
+                :src="scope.row.icon.url"
+                @click="showPreview(scope.row.icon)"
+              />
+            </span>
+          </template>
+        </el-table-column>
+        <el-table-column label="发布时间" width="150" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.date }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="状态" width="150" align="center">
+          <template slot-scope="scope">
+            <span>{{ scope.row.status }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" width="150" align="center">
+          <template slot-scope="scope">
+            <!-- <span>{{scope.row.operator}}</span> -->
+            <span>
+              <div class="operators">
+                <div class="edit">编辑</div>
+                <div class="offshelf">下架</div>
+                <div class="delete">删除</div>
+              </div>
+            </span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <!-- 使用图片查看器预览当前缩略图 -->
+    <el-image-viewer
+      v-if="currentIcon.showPreview"
+      :on-close="closePreview"
+      :url-list="[currentIcon.url]"
+    />
+  </div>
+</template>
+
+<script>
+// 导入组件
+import ElImageViewer from "element-ui/packages/image/src/image-viewer";
+import singleImageX from '@/components/Upload/singleImageX';
+// 导入请求
+import {
+  getAllApplicationType,
+  getListApplicationType,
+  addUpdateApplicationType,
+} from "api/website/industryApplication/index";
+export default {
+  name: "ApplicationList",
+  components: {
+    ElImageViewer,
+    singleImageX
+  },
+  data() {
+    return {
+      currentIcon: "",
+      // 功能按钮
+      operatorControls: [
+        {
+          name: "搜索",
+        },
+        {
+          name: "清空搜索",
+        },
+      ],
+      applyName: "",
+      //所有状态
+      status: [
+        {
+          value: "1",
+          label: "全部",
+        },
+        {
+          value: "2",
+          label: "上架",
+        },
+        {
+          value: "3",
+          label: "下架",
+        },
+      ],
+      // 所有类别
+      types: [
+        {
+          value: "1",
+          label: "全部",
+        },
+        {
+          value: "2",
+          label: "数字农业",
+        },
+      ],
+      currentType: "全部",
+      currentStatus: "全部",
+      // 表格数据
+      tableData: [
+        {
+          id: "1",
+          type: "类别",
+          name: "名称",
+          icon: {
+            url: "https://onemap.obtdata.com/wx/download/world.png",
+            showPreview: false,
+          },
+          date: "发布时间",
+          status: "状态",
+        },
+      ],
+      // typeManagerVisible: false,
+      // form:{
+      //   type: '',
+      //   coverImg: '',
+      //   introduce: '',
+      //   sort: '',
+      // }
+    };
+  },
+  mounted() {},
+  methods: {
+    onPreview(url){   
+        this.form.coverImg = url
+    },
+    showPreview(icon) {
+      this.currentIcon = icon;
+      this.currentIcon.showPreview = true;
+    },
+    closePreview() {
+      this.currentIcon.showPreview = false;
+    },
+  },
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+#ApplicationList {
+  margin: 0 1% 0 1%;
+  width: 98%;
+  height: auto;
+  #addCateManager{
+    padding: 0 5%;
+    width: 90%;
+    height: auto;
+  }
+  .operators {
+    // margin: 0 1% 0 1%;
+    width: 100%;
+    height: 68px;
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    align-items: center;
+    .applyName,.status,.types {
+      width: auto;
+      height: 46px;
+      display: flex;
+      flex-direction: row;
+      justify-content: center;
+      align-items: center;
+      overflow: hidden;
+      span {
+        margin: 0 10px 0 20px;
+      }
+    }
+    .addCate{
+      width: 260px;
+      height: 46px;
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-end;
+      align-items: center;
+      overflow: hidden;
+      .add{
+        width: 50%;
+        height: 36px;
+        display: flex;
+        flex-direction: row;
+        justify-content: center;
+        align-items: center;
+        border-radius: 5px;
+        background-color: #1890ff;
+        color: #FFFFFF;
+        cursor: pointer;
+      }
+    }
+    .controls {
+      margin-left: 40px;
+      width: 260px;
+      height: 46px;
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      align-items: center;
+      .item {
+        width: 120px;
+        height: 36px;
+        display: flex;
+        flex-direction: row;
+        justify-content: center;
+        align-items: center;
+        font-weight: 400;
+        color: #5178f2;
+        border: 1px solid #5178f2;
+        border-radius: 5px;
+        cursor: pointer;
+      }
+    }
+  }
+  .table {
+    margin: 1% 1% 0 1%;
+    width: 98%;
+    height: auto;
+    span {
+      display: flex;
+      flex-direction: row;
+      justify-content: center;
+      align-items: center;
+      .icon {
+        width: 50px;
+        height: 50px;
+        object-fit: cover;
+      }
+      .operators {
+        width: 300px;
+        height: 46px;
+        display: flex;
+        flex-direction: row;
+        justify-content: space-around;
+        align-items: center;
+        .edit,
+        .offshelf,
+        .delete {
+          width: auto;
+          height: 36px;
+          display: flex;
+          flex-direction: row;
+          justify-content: center;
+          align-items: center;
+          cursor: pointer;
+        }
+        .edit,
+        .offshelf {
+          color: #1890ff;
+        }
+        .delete {
+          color: #fe4066;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/webSiteManagement/newsCategory/index.vue

+<!--
+ * @Author: your name
+ * @Date: 2020-12-01 09:54:12
+ * @LastEditTime: 2020-12-02 16:35:10
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: \rs-cloud-platform-ui\src\views\webSiteManagement\newsCategory\index.vue
+-->
+<template>
+  <div id='Container'>
+    <transition name="fade">
+        <component v-show="componentName" :is="`${componentName}`"></component>
+    </transition>
+  </div>
+</template>
+
+<script>
+import nebulaDynamics from './nebulaDynamics/index'
+import newsCreator from './newsCreator/index'
+export default {
+  name: 'Container',
+  components: {
+      nebulaDynamics,
+      newsCreator
+  },
+  data(){
+    return {
+        componentName: 'nebulaDynamics',
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+
+  },
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+    .fade-enter-active, .fade-leave-active {
+        transition: opacity .5s
+    }
+    .fade-enter, .fade-leave-active {
+        opacity: 0
+    }
+</style>
\ No newline at end of file

src/views/webSiteManagement/newsCategory/newsCreator/index.vue

+<!--
+ * @Author: Jenkins
+ * @Date: 2020-12-02 14:49:10
+ * @LastEditTime: 2020-12-03 16:16:11
+ * @LastEditors: Please set LastEditors
+ * @Description: 创建新闻
+ * @FilePath: \rs-cloud-platform-ui\src\views\webSiteManagement\newsCategory\newsCreator\index.vue
+-->
+<template>
+  <div id='newsCreator'>
+    <div class="top">
+        <div class="title" @click="$parent.componentName='nebulaDynamics'">
+            <img src="/static/images/return.png"/>
+            返回上一页
+        </div>
+    </div>
+    <div class="form">
+        <el-form ref="form" :model="form" label-width="80px">
+            <el-form-item label="*资讯标题">
+                <el-col :span="12">
+                    <el-input v-model="form.title" placeholder="请输入资讯标题"></el-input>
+                </el-col>
+            </el-form-item>
+            <el-form-item label="*封面图">
+                <singleImageX :value="form.coverImg" @input="onPreview"></singleImageX>
+            </el-form-item>
+            <el-form-item label="*资讯简介">
+                <el-col :span="12">
+                    <el-input v-model="form.introduce" placeholder="请输入资讯简介"></el-input>
+                </el-col>
+            </el-form-item>
+            <el-form-item label="*资讯类型">
+                <el-col :span="8">
+                    <el-select v-model="form.region" placeholder="请选择选择资讯类型">
+                        <el-option label="类型一" value="type1"></el-option>
+                        <el-option label="类型二" value="type2"></el-option>
+                    </el-select> 
+                </el-col>
+            </el-form-item>
+            <el-form-item label="*资讯详情">
+                <el-col :span="20">
+                    <Kind-editor  ref="kindeditor" :html="form.html" @input="getContent"></Kind-editor>
+                </el-col>
+            </el-form-item>
+            <el-form-item label="*排序">
+                <el-col :span="12">
+                    <el-input v-model="form.sort" placeholder="请输入序号"></el-input>
+                </el-col>
+            </el-form-item>
+            <el-form-item>
+                <el-button @click="$parent.componentName='nebulaDynamics'">取消</el-button>
+                <el-button type="primary" @click="onSubmit">确定</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+  </div>
+</template>
+
+<script>
+import singleImageX from '@/components/Upload/singleImageX';
+import KindEditor from "@/components/Kindeditor";
+export default {
+  name: 'newsCreator',
+  components: {
+      singleImageX,
+      KindEditor
+  },
+  data(){
+    return {
+        form: {
+          title: '',
+          coverImg: '',
+          introduce: '',
+          region: '',
+          sort: '',
+          content: '',
+          html: 'https://ebusiness-1255313385.cosbj.myqcloud.com/image/20190823/center2019082304054532.html',
+        },
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    // 获取编辑器内容
+    getContent(content) {
+        this.form.content = content
+    },
+    // 编辑器内容转换成在线url
+    async getcontent2Url() {
+        try {
+            const htmlUrl =  await this.$refs.kindeditor.content2Url()
+            return htmlUrl
+        } catch (error) {
+            console.log(error)
+        }
+    },
+    onPreview(url){   
+        this.form.coverImg = url
+    },
+    onSubmit() {
+        console.log('submit!');
+    }
+  },
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+    #newsCreator{
+        margin: 0 1% 0 1%;
+        width: 98%;
+        display: flex;
+        flex-direction: column;
+        justify-content: flex-start;
+        align-items: center;
+        color: #5178F2;
+        .top{
+            width: 100%;
+            height: 68px;
+            display: flex;
+            flex-direction: row;
+            justify-content: space-between;
+            align-items: center;
+            overflow: hidden;
+            border-bottom: 1px solid #EEEEEE;
+            .title{ 
+                width: auto;
+                margin: 0 0 0 30px;
+                height: 46px;
+                display: flex;
+                flex-direction: row;
+                justify-content: center;
+                align-items: center;
+                color: #5178F2;
+                overflow: hidden;
+                cursor: pointer;
+            }
+        }
+        .form{
+            padding: 30px 60px;
+            width: calc(100% - 30px);
+            height: calc(100% - 68px - 60px);
+            display: flex;
+            flex-direction: column;
+            justify-content: flex-start;
+            color: #5178F2;
+        }
+    }
+</style>
\ No newline at end of file

src/views/webSiteManagement/satelliteIntroduction/edit.vue

+<template>
+  <div class="block">
+    <div class="head">
+      <div class="go-back" @click="goBack"><i class="el-icon-back"></i>返回上一页</div>
+    </div>
+
+    <div class="body">
+      <custom-form
+        :formData="formObject"
+        @submitFunc="updateFunc"
+        @reset="goBack"
+        ></custom-form>
+    </div>
+  </div>
+</template>
+
+<script>
+import CustomForm from "@/components/CustomForm"
+
+import { satelliteIntroduction } from "@/utils/formDatas.js"//表单数据
+import { update } from "@/api/website/satelliteIntroduction"
+
+export default {
+  components: {
+    CustomForm
+  },
+  data() {
+    return {
+      formObject: {
+        formVal: satelliteIntroduction.init(),//提交的表单参数
+        rules: satelliteIntroduction.rules,//表单规则
+        formItem: satelliteIntroduction.formInfo,//表单项。
+      },
+    }
+  },
+  methods: {
+    goBack() {
+      this.$emit('change', 'list')
+    },
+    //更新方法
+    updateFunc(params) {
+      params.rank = ~~params.rank;
+      update(params).then(res => {
+        if (res.status ==  200) {
+          //返回上一页，更新列表
+          this.goBack();
+
+        } else {
+          this.$message.error(res.message);
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 20px;
+  width: 100%;
+  border-bottom: 1px solid #e6e6e6;
+  .go-back {
+    height: 30px;
+    line-height: 30px;
+    font-size: 16px;
+    color: #1989fa;
+    cursor: pointer;
+    i {
+      margin-right: 10px;
+    }
+  }
+}
+.body {
+  padding: 20px 50px 40px
+}
+</style>

src/views/webSiteManagement/satelliteIntroduction/index.vue

+<template>
+  <div class="container">
+    <component :is="componentVal" :params="datas" @change="changePage"></component>
+  </div>
+</template>
+
+<script>
+import { satelliteIntroduction } from "@/utils/formDatas.js"
+import { page, update } from "@/api/website/satelliteIntroduction"
+
+export default {
+  name: "satelliteIntroduction",
+  data() {
+    return {
+      componentVal: () => import("./list"),
+      datas: null
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    changePage(name, val) {
+      this.componentVal = () => import(`./${name}`)
+
+      if (!!val) {
+        this.datas = val
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/webSiteManagement/satelliteIntroduction/list.vue

+<template>
+  <div class="container">
+    <div class="head">
+      <div>卫星介绍</div>
+      <el-button type="primary" @click="addItem">添加卫星</el-button>
+    </div>
+    <div class="app-container calendar-list-container">
+      <div class="filter-container">
+        <el-form :inline="true" :model="searchForm" class="demo-form-inline">
+          <el-form-item label="所有状态">
+            <el-select v-model="searchForm.status">
+              <el-option v-for="(item, index) in bannerStatus" :key="index" :label="item" :value="~~index"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="卫星名称">
+            <el-input v-model="searchForm.title" placeholder="请输入卫星名称"></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" plain @click="filterData">搜索</el-button>
+            <el-button type="primary" plain @click="clearFilterData">清除搜索</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+      <el-table :data="list" v-loading.body="listLoading" border fit highlight-current-row style="width: 100%">
+        <el-table-column align="center" type="index" label="序号" width="65"></el-table-column>
+        <el-table-column align="center" label="卫星名称" prop="name"></el-table-column>
+        <el-table-column align="center" label="缩略图">
+          <template slot-scope="scope">
+            <img class="cover" :src="scope.row.coverImg" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="分辨率" prop="resolution"></el-table-column>
+        <el-table-column align="center" label="排序" prop="rank"></el-table-column>
+        <el-table-column align="center" label="状态">
+          <template slot-scope="scope">
+            {{ getStatus(scope.row.status) }}
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="操作" width="250">
+          <template slot-scope="scope">
+            <el-button type="primary" size="mini" @click="edit(scope.row)">编辑</el-button>
+            <el-button :type="scope.row.status === 1 ? 'info': 'warning'" size="mini" @click="changeParams(scope.row, 'status')">{{scope.row.status === 1 ? '下架': '上架'}}</el-button>
+            <el-button type="danger" size="mini" @click="changeParams(scope.row, 'isDel')">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <div class="page-foot">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :page-size="listQuery.limit"
+          :total="total" @current-change="currentChange">
+        </el-pagination>
+      </div>
+
+
+      <el-dialog
+        top="10%"
+        :close-on-click-modal="false"
+        :title="dialogTitle"
+        :visible.sync="dialogVisible">
+        <el-form
+          ref="ruleForm"
+          size="small"
+          label-position="right"
+          :model="editForm"
+          :rules="editFormRules"
+          label-width="100px"
+          class="demo-ruleForm">
+          <el-form-item v-for="(item, index) in editFormInfo" :key="index" :label="item.label" :prop="index">
+            <div v-if="item.type && item.type == 'radio'">
+              <el-radio-group v-model="editForm[index]">
+                <el-radio v-for="(item, index) in item.radioArr" :key="~~index" :label="~~index">{{item}}</el-radio>
+              </el-radio-group>
+            </div>
+            <div v-else>
+              <el-input v-model="editForm[index]" :placeholder="`请输入${item.label}`"></el-input>
+            </div>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="submitForm()">确定</el-button>
+            <el-button type="info" @click="resetForm()">取消</el-button>
+          </el-form-item>
+        </el-form>
+      </el-dialog>
+
+    </div>
+
+  </div>
+</template>
+
+<script>
+import { satelliteIntroduction } from "@/utils/formDatas.js"
+import { page, update } from "@/api/website/satelliteIntroduction"
+
+export default {
+  name: "satelliteIntroduction",
+  data() {
+    return {
+      data: null,//原数据
+      list: null,//赋值数据 | 过滤数据
+      total: null,
+      listLoading: true,//请求加载状态
+      //请求参数。页码页数等
+      listQuery: {
+        page: 1,
+        limit: 20
+      },
+      //搜索表单
+      searchForm: {
+        status: 0,
+        title: ""
+      },
+      //添加banner与修改banner的form对象
+      editForm: satelliteIntroduction.init(),//提交的表单参数
+      editFormInfo: satelliteIntroduction.formInfo,//表单项。
+      editFormRules: satelliteIntroduction.rules,//表单规则
+      //是否启用，1、启用，2、禁用
+      bannerStatus: {
+        0: '全部',
+        1: '启用',
+        2: '禁用',
+      },
+      dialogVisible: false,
+      dialogTitle: "新增卫星"
+    }
+  },
+  mounted() {
+    this.getList()
+  },
+  methods: {
+    //清除搜索
+    filterData() {
+      if (this.searchForm.status === 0 && this.searchForm.title === '') {
+        this.list = this.data;
+        return ;
+      }
+      let temp = this.data.filter(v => this.searchForm.status === 0 ? true: !!(this.searchForm.status === v.status))
+      if (!!this.searchForm.title) {
+        temp = temp.filter(v => v.title.includes(this.searchForm.title))
+      }
+
+      this.list = temp
+    },
+    //清除搜索
+    clearFilterData() {
+      this.searchForm = {
+        status: 0,
+        title: ""
+      }
+      this.list = this.data;
+    },
+    //切换页码
+    currentChange(val) {
+      this.listQuery.page = val;
+      this.getList();
+    },
+    //编辑
+    edit(row) {
+      this.dialogTitle = "编辑卫星";
+      this.dialogVisible = true;
+      this.editForm = row
+    },
+    //校验表单
+    submitForm() {
+      let _this = this;
+      this.$refs.ruleForm.validate((valid) => {
+        if (valid) {
+          _this.updateFunc();
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    //更新方法
+    updateFunc() {
+      update(this.editForm).then(res => {
+        if (res.status ==  200) {
+          this.dialogVisible = false;
+          this.getList();
+        } else {
+          this.$message.error(res.message);
+        }
+      })
+    },
+    //取消表单
+    resetForm() {
+      this.$refs.ruleForm.resetFields();
+      this.dialogVisible = false;
+    },
+    //新增banner
+    addItem() {
+      // this.dialogTitle = "新增卫星";
+      // this.dialogVisible = true;
+      // this.editForm = satelliteIntroduction.init();
+      this.$emit('change', 'edit')
+    },
+    //获取状态
+    getStatus(val) {
+      return this.bannerStatus[val]
+    },
+    //上下架、删除更新
+    changeParams(row, key) {
+      this.editForm = row;
+      if (key == 'isDel') {
+        this.editForm[key] = row[key] == 0 ? 1 : 0;
+      } else {
+        this.editForm[key] = row[key] == 1 ? 2 : 1;
+      }
+
+      //更新专题
+      this.updateFunc();
+    },
+    //获取banner列表
+    getList() {
+      this.listLoading = true;
+      page(this.listQuery).then(res => {
+        this.list = res.data.data
+        this.data = res.data.data
+        this.total = res.data.totalCount;
+        this.listLoading = false;
+      }).catch(err => {
+        this.listLoading = false;
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 20px;
+  width: 100%;
+  border-bottom: 1px solid #e6e6e6;
+}
+.cover {
+  max-width: 200px;
+  height: auto;
+}
+.page-foot {
+  display: flex;
+  justify-content: center;
+  margin-top: 20px;
+}
+</style>