底部文件

src/api/common.js

@@ -437,10 +437,10 @@ export const HttpReq = {
         method: 'get'
       })
     },
-    // 首页-友情链接
-    homePageGetFriendshipUrl: function(params) {
+    // 首页-底部导航
+    homePageGetBottomNavigation: function(params) {
       return request({
-        url: '/api/bsw/bigScreen/index/friendshipUrl?' + qs.stringify(params, { indices: false }),
+        url: '/api/bsw/bigScreen/index/bottomNavigationBar?' + qs.stringify(params, { indices: false }),
         method: 'get'
       })
     },

src/router/index.js

@@ -9,7 +9,7 @@ import { filterAsyncRouter } from '@/store/modules/permission'
 
 NProgress.configure({ showSpinner: false })// NProgress Configuration
 
-const whiteList = ['/login', '/backlogin', '/home', '/product', '/supplier', '/project', '/software', '/course', '/information']// 免登录路由白名单
+const whiteList = ['/login', '/backlogin', '/home', '/product', '/supplier', '/project', '/software', '/course', '/information', '/footer']// 免登录路由白名单
 const backUrlList = ['/dashboard', '/system', '/monitor', '/sys-tools', '/backstage']// 后台路由
 
 router.beforeEach((to, from, next) => {

src/router/routers.js

@@ -158,6 +158,30 @@ export const constantRouterMap = [
     },
     hidden: true
   },
+  {
+    path: '/footer/about/:id',
+    meta: { title: '', noCache: true },
+    component: (resolve) => {
+      return require(['@/views/homepage/footer/index'], resolve)
+    },
+    hidden: true
+  },
+  {
+    path: '/footer/opinion',
+    meta: { title: '提供建议', noCache: true },
+    component: (resolve) => {
+      return require(['@/views/homepage/footer/opinion'], resolve)
+    },
+    hidden: true
+  },
+  {
+    path: '/footer/cooperate',
+    meta: { title: '我要合作', noCache: true },
+    component: (resolve) => {
+      return require(['@/views/homepage/footer/cooperate'], resolve)
+    },
+    hidden: true
+  },
   {
     path: '/console',
     meta: { title: '个人中心', noCache: true },

src/views/backstage/contentMgt/homePage/add.vue

 <template>
   <!-- 表单渲染 -->
   <el-dialog append-to-body :close-on-click-modal="false" :before-close="cancelView" :visible="visible" :title="title" width="860px">
-    <el-form ref="formViewRef" :model="formData" :rules="rules" :status-icon="true" label-width="240px">
+    <el-form ref="formViewRef" :model="formData" :rules="rules" :status-icon="true" label-width="220px">
       <el-form-item label="位置：" class="form-cell" prop="type">
         <div class="cell-box">
-          <el-select v-model="formData.type" placeholder="无" class="cell-select">
+          <el-select v-model="formData.type" placeholder="无" class="cell-select" @change="typeChang">
             <el-option v-for="item in dict.home_setting" :key="item.value" :label="item.label" :value="item.value" />
           </el-select>
         </div>
@@ -83,6 +83,44 @@
             />
           </div>
         </el-form-item>
+        <el-form-item label="封面与LOGO：" class="form-cell" prop="partnerLogo">
+          <div class="cell-box">
+            <ul class="el-upload-list el-upload-list--picture-card" style="float: left">
+              <li v-for="(item, index) in imgList" :key="index" tabindex="0" class="el-upload-list__item is-success">
+                <img :src="imgSrcStart+item" class="el-upload-list__item-thumbnail">
+                <label class="el-upload-list__item-status-label"><i class="el-icon-upload-success el-icon-check" /></label>
+                <span class="el-upload-list__item-actions">
+                  <span class="el-upload-list__item-preview" @click="dialogImgUrl=item;dialogImgVisible=true"><i class="el-icon-zoom-in" /></span>
+                  <span class="el-upload-list__item-delete" @click="handleRemoveImg(item)"><i class="el-icon-delete" /></span>
+                </span>
+              </li>
+            </ul>
+            <el-dialog append-to-body :visible.sync="dialogImgVisible">
+              <img width="100%" :src="imgSrcStart+dialogImgUrl">
+            </el-dialog>
+            <el-upload
+              ref="uploadCom"
+              action="/api/bsw/common/uploadPicture"
+              name="multipartFile"
+              :data="{mark:'logo'}"
+              list-type="picture-card"
+              :headers="uploadHeaders"
+              :limit="1"
+              :on-exceed="handleExceed"
+              :on-success="handleImported"
+              :on-preview="handlePictureCardPreview"
+              :on-remove="handleRemove"
+            >
+              <div slot="trigger" @click="handlePushClick($event)">
+                <i class="el-icon-plus" />
+              </div>
+            </el-upload>
+            <el-dialog append-to-body :visible.sync="dialogImageVisible">
+              <img width="100%" :src="dialogImageUrl">
+            </el-dialog>
+          </div>
+          <div style="display: none;clear: both">{{ formData.partnerLogo }}</div>
+        </el-form-item>
         <el-form-item label="是否设置为钻石供应商：" class="form-cell" prop="diamondSupplier">
           <div class="cell-box">
             <el-radio-group v-model="formData.diamondSupplier" size="mini">
@@ -271,6 +309,28 @@
           </div>
         </el-form-item>
       </div>
+      <div v-if="formData.type>=8">
+        <el-form-item label="操作名称：" class="form-cell" prop="operationName">
+          <div class="cell-box">
+            <el-input v-model="formData.operationName" placeholder="单行输入" class="cell-input" />
+          </div>
+        </el-form-item>
+        <el-form-item label="频道名称：" class="form-cell" prop="channelName">
+          <div class="cell-box">
+            <el-input v-model="formData.channelName" placeholder="单行输入" class="cell-input" />
+          </div>
+        </el-form-item>
+        <el-form-item label="富文本内容：" class="form-cell" prop="content">
+          <div class="cell-box">
+            <div ref="editor" class="editor" />
+          </div>
+        </el-form-item>
+        <el-form-item label="顺序：" class="form-cell" prop="operatingPeriod">
+          <div class="cell-box">
+            <el-input v-model.number="formData.sort" type="number" placeholder="请输入数字" class="cell-input" />
+          </div>
+        </el-form-item>
+      </div>
     </el-form>
     <div slot="footer" class="dialog-footer" style="text-align: center">
       <el-button @click="cancelView">关闭</el-button>
@@ -283,6 +343,9 @@
 <script>
 import { getToken } from '@/utils/auth'
 import { HttpReq } from '@/api/common'
+import { mapGetters } from 'vuex'
+import { upload } from '@/utils/upload'
+import E from 'wangeditor'
 
 export default {
   dicts: ['home_setting', 'home_setting_2', 'home_setting_5', 'product_type'],
@@ -324,12 +387,45 @@ export default {
       rules: {}
     }
   },
-  mounted() {
-    this.$nextTick(() => {
-
-    })
+  computed: {
+    ...mapGetters([
+      'imagesUploadApi',
+      'baseApi'
+    ])
   },
+  mounted() {},
   methods: {
+    typeChang() {
+      if (this.formData.type >= 8) {
+        this.$nextTick(() => {
+          if (!this.editor) {
+            const _this = this
+            const editor = new E(this.$refs.editor)
+            editor.config.zIndex = 5
+            editor.config.customUploadImg = function(files, insert) {
+              files.forEach(image => {
+                upload(_this.imagesUploadApi, image).then(res => {
+                  const data = res.data
+                  const url = _this.baseApi + '/file/' + data.type + '/' + data.realName
+                  insert(url)
+                })
+              })
+            }
+            editor.config.onchange = (html) => {
+              this.formData.content = html
+            }
+            editor.create()
+            this.editor = editor
+          }
+          this.editor.txt.html(this.formData.content)
+        })
+      } else {
+        if (this.editor) {
+          this.editor.txt.clear()
+          this.editor = null
+        }
+      }
+    },
     checkEnterpriseName(rule, value, callback) {
       this.$nextTick(_ => {
         HttpReq.backstageApi.checkEnterpriseName({
@@ -360,6 +456,10 @@ export default {
       if (this.$refs.uploadCom) {
         this.$refs.uploadCom.clearFiles()
       }
+      if (this.editor) {
+        this.editor.txt.clear()
+        this.editor = null
+      }
       this.$refs.formViewRef.resetFields()
       this.imgList = []
       this.formData = {
@@ -454,6 +554,9 @@ export default {
             if (this.formData.partnerLogo) {
               this.imgList = this.formData.partnerLogo.split(';')
             }
+            if (this.formData.type >= 8) {
+              this.typeChang()
+            }
           } else {
             this.$message({
               message: res.msg,
@@ -524,6 +627,10 @@ export default {
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
+.editor{
+  text-align:left;
+  width: 580px;
+}
 .cell-box {
   min-width: 120px;
   .cell-input {

src/views/backstage/contentMgt/homePage/view.vue

@@ -84,6 +84,23 @@
             />
           </div>
         </el-form-item>
+        <el-form-item label="封面与LOGO：" class="form-cell" prop="partnerLogo">
+          <div class="cell-box">
+            <ul class="el-upload-list el-upload-list--picture-card" style="float: left">
+              <li v-for="(item, index) in imgList" :key="index" tabindex="0" class="el-upload-list__item is-success">
+                <img :src="imgSrcStart+item" class="el-upload-list__item-thumbnail">
+                <label class="el-upload-list__item-status-label"><i class="el-icon-upload-success el-icon-check" /></label>
+                <span class="el-upload-list__item-actions">
+                  <span class="el-upload-list__item-preview" @click="dialogImgUrl=item;dialogImgVisible=true"><i class="el-icon-zoom-in" /></span>
+                </span>
+              </li>
+            </ul>
+            <el-dialog append-to-body :visible.sync="dialogImgVisible">
+              <img width="100%" :src="imgSrcStart+dialogImgUrl">
+            </el-dialog>
+          </div>
+          <div style="display: none;clear: both">{{ formData.partnerLogo }}</div>
+        </el-form-item>
         <el-form-item label="是否设置为钻石供应商：" class="form-cell" prop="diamondSupplier">
           <div class="cell-box">
             <el-radio-group v-model="formData.diamondSupplier" disabled size="mini">
@@ -251,6 +268,28 @@
           </div>
         </el-form-item>
       </div>
+      <div v-if="formData.type>=8">
+        <el-form-item label="操作名称：" class="form-cell" prop="operationName">
+          <div class="cell-box">
+            <el-input v-model="formData.operationName" disabled placeholder="单行输入" class="cell-input" />
+          </div>
+        </el-form-item>
+        <el-form-item label="频道名称：" class="form-cell" prop="channelName">
+          <div class="cell-box">
+            <el-input v-model="formData.channelName" disabled placeholder="单行输入" class="cell-input" />
+          </div>
+        </el-form-item>
+        <el-form-item label="富文本内容：" class="form-cell" prop="content">
+          <div class="cell-box">
+            <div style="width: 580px" v-html="formData.content" />
+          </div>
+        </el-form-item>
+        <el-form-item label="顺序：" class="form-cell" prop="operatingPeriod">
+          <div class="cell-box">
+            <el-input v-model.number="formData.sort" disabled type="number" placeholder="请输入数字" class="cell-input" />
+          </div>
+        </el-form-item>
+      </div>
     </el-form>
     <div slot="footer" class="dialog-footer" style="text-align: center">
       <el-button @click="cancelView">关闭</el-button>

src/views/homepage/components/homeFooter.vue

@@ -5,9 +5,10 @@
         <el-col v-for="(item,index) in dataList" :key="index" :span="4">
           <div class="title-s">{{ item.name }}</div>
           <div v-for="(t,i) in item.list" :key="'lb_'+i" class="label" :title="t.name">
-            <a :href="t.url||'http://www.minestar.cn'" target="_blank">
+            <a v-if="t.url" :href="t.url||'http://www.minestar.cn'" target="_blank">
               {{ t.name }}
             </a>
+            <div v-else class="touch" @click="linkClick(t)">{{ t.name }}</div>
           </div>
         </el-col>
       </el-row>
@@ -41,9 +42,9 @@ export default {
         {
           name: '联系我们',
           list: [
-            { name: '提供建议', url: '' },
-            { name: '我要合作', url: '' },
-            { name: '联系方式', url: '' }
+            { name: '提供建议', leaveWordUrl: '/footer/opinion' },
+            { name: '我要合作', leaveWordUrl: '/footer/cooperate' },
+            { name: '联系方式' }
           ]
         },
         {
@@ -58,22 +59,54 @@ export default {
   },
   mounted() {
     this.$nextTick(() => {
-      HttpReq.webClientApi.homePageGetFriendshipUrl({
+      HttpReq.webClientApi.homePageGetBottomNavigation({
         preview: false
       }).then((res) => {
-        this.dataList.push({
-          name: '友情链接',
-          list: res.data.friendshipUrl
-        })
+        this.dataList = [
+          {
+            name: '用户指南',
+            list: res.data.userGuide
+          },
+          {
+            name: '关于我们',
+            list: res.data.aboutUs
+          },
+          {
+            name: '联系我们',
+            list: [
+              { name: '提供建议', leaveWordUrl: '/footer/opinion' },
+              { name: '我要合作', leaveWordUrl: '/footer/cooperate' },
+              ...res.data.commonQuestions
+
+            ]
+          },
+          {
+            name: '常见问题',
+            list: res.data.contactUs
+          },
+          {
+            name: '友情链接',
+            list: res.data.friendshipUrl
+          }
+        ]
       })
     })
   },
   methods: {
-    click() {}
+    linkClick(item) {
+      if (item.leaveWordUrl) {
+        this.$router.push({ path: item.leaveWordUrl })
+      } else {
+        this.$router.push({ path: `/footer/about/${item.id}` })
+      }
+    }
   }
 }
 </script>
 <style rel="stylesheet/scss" lang="scss" scoped>
+.touch {
+  cursor:pointer;
+}
 .footer-content {
   width: 100%;
   height: 267px;

src/views/homepage/index.vue

@@ -40,9 +40,10 @@
             <img v-if="item.isGood" src="@/assets/home_images/recommend.png" class="stamp" title="推荐" style="top: 10px;right: 8px">
             <img v-if="item.isHot" src="@/assets/home_images/hot.png" class="stamp" title="热门" style="top: 0;left: 0">
             <el-image
+              class="touch"
               :src="item.imgSrc?imgSrcStart+'/img'+item.imgSrc:defaultImgProduct"
-              :preview-src-list="item.imgSrcList.length?item.imgSrcList:[defaultImgProduct]"
               style="width:284px;height: 284px;margin: 0 32px 4px"
+              @click="goToDetails(item, '/product/details')"
             >
               <div slot="placeholder" class="image-slot">加载中<span class="dot">...</span></div>
             </el-image>