update

src/config/api.js

       method: 'post',
       url: `${commPrefix}/comment/add`
     }
+  },
+  banner: {
+    list: {
+      method: 'get',
+      url: `${commPrefix}/pageImgList`
+    },
+    detail: {
+      method: 'get',
+      url: `${commPrefix}/pageImgDetail/:id`
+    },
+    add: {
+      method: 'post',
+      url: `${commPrefix}/pageIm/add`
+    },
+    update: {
+      method: 'put',
+      url: `${commPrefix}/pageIm/update`
+    },
+    delete: {
+      method: 'delete',
+      url: `${commPrefix}/pageImg/delete`
+    }
+  },
+  dynamic: {
+    list: {
+      method: 'get',
+      url: `${commPrefix}/iBuildingDynamicList`
+    },
+    detail: {
+      method: 'get',
+      url: `${commPrefix}/iBuildingDynamicSelectId/:id`
+    },
+    add: {
+      method: 'post',
+      url: `${commPrefix}/buildingDynamic/add`
+    },
+    edit: {
+      method: 'put',
+      url: `${commPrefix}/buildingDynamic/update`
+    },
+    delete: {
+      method: 'delete',
+      url: `${commPrefix}/buildingDynamic/delete/:id`
+    },
   }
 }
 

src/store/index.js

 import customer from './modules/customer'
 import apartment from './modules/apartment'
 import comment from './modules/comment'
+import banner from './modules/banner'
 
 Vue.use(Vuex)
 
     img,
     customer,
     apartment,
-    comment
+    comment,
+    banner
   }
 })
 

src/store/modules/banner.js

     },
     getBanners ({ commit }, payload) {
       return new Promise((resolve, reject) => {
-        const api = lodash.get(apis, 'comment.list')
+        const api = lodash.get(apis, 'banner.list')
         interact(api, payload).then((data) => {
           commit('updateList', data)
           resolve(data)
         })
       })
     },
+    getDetail ({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+        const api = replaceApiParams(lodash.get(apis, 'banner.detail'), payload)
+        interact(api).then((data) => {
+          commit('updateDetail', data)
+          resolve(data)
+        }).catch(({ message }) => {
+          if (typeof message === 'string') {
+            reject(message)
+          }
+        })
+      })
+    },
+    addBanner (_, payload) {
+      return new Promise((resolve, reject) => {
+        const api = lodash.get(apis, 'banner.add')
+        interact(api, payload).then((data) => {
+          resolve(data)
+        }).catch(({ message }) => {
+          if (typeof message === 'string') {
+            reject(message)
+          }
+        })
+      })
+    },
+    editBanner (_, payload) {
+      return new Promise((resolve, reject) => {
+        const api = lodash.get(apis, 'banner.update')
+        interact(api, payload).then((data) => {
+          resolve(data)
+        }).catch(({ message }) => {
+          if (typeof message === 'string') {
+            reject(message)
+          }
+        })
+      })
+    },
+    deleteBanner (_, payload) {
+      return new Promise((resolve, reject) => {
+        const api = lodash.get(apis, 'banner.delete')
+        interact(api, payload).then(() => {
+          resolve()
+        }).catch(() => {
+          reject()
+        })
+      })
+    }
   }
 }

src/store/modules/dynamic.js

+import lodash from 'lodash'
+import { interact, replaceApiParams } from '../../utils'
+import apis from '../../config/api'
+
+export default {
+  namespaced: true,
+  state: {
+    dynamics: {},
+    detail: {}
+  },
+  mutations: {
+    updateList (state, payload) {
+      state.dynamics = payload
+    },
+    updateDetail (state, payload) {
+      state.detail = payload
+    }
+  },
+  actions: {
+    setDetailNull ({ commit }) {
+      commit('updateDetail', {})
+    },
+    getDynamics ({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+        const api = lodash.get(apis, 'dynamic.list')
+        interact(api, payload).then((data) => {
+          commit('updateList', data)
+          resolve(data)
+        }).catch(({ message }) => {
+          if (typeof message === 'string') {
+            reject(message)
+          }
+        })
+      })
+    },
+    getDetail ({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+        const api = replaceApiParams(lodash.get(apis, 'dynamic.detail'), payload)
+        interact(api).then((data) => {
+          commit('updateDetail', data)
+          resolve(data)
+        }).catch(({ message }) => {
+          if (typeof message === 'string') {
+            reject(message)
+          }
+        })
+      })
+    },
+    addDynamics (_, payload) {
+      return new Promise((resolve, reject) => {
+        const api = lodash.get(apis, 'dynamic.add')
+        interact(api, payload.detail).then((data) => {
+          resolve(data)
+        }).catch(({ message }) => {
+          reject(message)
+        })
+      })
+    },
+    editDynamics (_, payload) {
+      return new Promise((resolve, reject) => {
+        const api = lodash.get(apis, 'dynamic.edit')
+        interact(api, payload.detail).then((data) => {
+          resolve(data)
+        }).catch(({ message }) => {
+          reject(message)
+        })
+      })
+    },
+    deleteDynamics (_, payload) {
+      return new Promise((resolve, reject) => {
+        const api = replaceApiParams(lodash.get(apis, 'dynamic.delete'), payload)
+        interact(api).then(() => {
+          resolve()
+        }).catch(() => {
+          reject()
+        })
+      })
+    },
+  }
+}

src/views/cms/pageImgEdit.vue

+<template>
+  <el-form ref="form" :model="banner" label-width="160px">
+    <el-form-item label="图片位置">
+      <el-select v-model="banner.imgLocation" placeholder="请选择">
+        <el-option v-for="(type,i) in loactionTypes || []" :key="i" :label="type.name" :value="type.id"></el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item label="图片">
+      <el-upload
+        class="avatar-uploader"
+        :action="upFileUrl"
+        name='uploadFiles'
+        :show-file-list="false"
+        :before-upload="beforeImgUpload"
+        :on-success="handleAvatarSuccess">
+        <img v-if="banner.url" :src="banner.url" class="avatar">
+        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+      </el-upload>
+    </el-form-item>
+    <el-form-item label="排序">
+      <el-input v-model="banner.orderNo"></el-input>
+    </el-form-item>
+    <el-form-item label="页面跳转地址">
+      <el-input v-model="banner.link"></el-input>
+    </el-form-item>
+    <el-form-item>
+      <el-button type="primary" @click="onSubmit">保存</el-button>
+      <el-button @click="onCancel">取消</el-button>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script>
+import { createNamespacedHelpers, mapState } from 'vuex'
+import apis from '../../config/api'
+
+const { mapState: mapBannerState, mapActions: mapBannerActions, mapMutations: mapBannerMutations } = createNamespacedHelpers('banner')
+
+export default {
+  data () {
+    return {
+      upFileUrl: apis.file.upload.url,
+      imgType: ''
+    }
+  },
+  computed: {
+    ...mapBannerState({
+      detail: x => x.detail,
+    }),
+    banner: {
+      get () {
+        return this.detail
+      },
+      set (val) {
+        return this.updateDetail(val)
+      }
+    },
+    ...mapState({
+      dicts: x => x.dicts
+    }),
+    loactionTypes () {
+      return this.dicts.filter(x => x.type == 'imgLocation')
+    }
+  },
+  methods: {
+    ...mapBannerMutations([
+      'updateDetail'
+    ]),
+    ...mapBannerActions([
+      'getDetail',
+      'addBanner',
+      'editBanner'
+    ]),
+    beforeImgUpload (file) {
+      // if (file.type !== 'image/jpeg') {
+      //   this.$message.error('上传图片只能是 JPG 格式!')
+      //   return false
+      // }
+      // if (file.size / 1024 > 300) {
+      //   this.$message.error('图片大小不允许超过300k!')
+      //   return false
+      // }
+      this.imgType = file.type
+      this.loading = this.$loading({
+        lock: true,
+        text: '上传中...',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+
+      return true
+    },
+    handleAvatarSuccess (res) {
+      this.updateDetail({...this.banner, url: res.data[0], imgType: this.imgType})
+      this.loading.close()
+    },
+    onSubmit () {
+      if (!this.detail.pageId) {
+        // 新增
+        this.addBanner(JSON.stringify(this.detail)).then(() => {
+          this.onCancel()
+        })
+      } else {
+        // 修改
+        this.editBanner(JSON.stringify(this.detail)).then(() => {
+          this.onCancel()
+        })
+      }
+    },
+    onCancel () {
+      this.$router.push({name: 'pageBannerList'})
+    }
+  },
+  mounted () {
+    if ((this.$route.query.id || '') !== '') {
+      this.getDetail({id: this.$route.query.id})
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+  .avatar-uploader .el-upload {
+    border: 1px dashed #d9d9d9;
+    border-radius: 6px;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+  }
+  .avatar-uploader .el-upload:hover {
+    border-color: #409EFF;
+  }
+  .avatar-uploader-icon {
+    font-size: 28px;
+    color: #8c939d;
+    width: 178px;
+    height: 178px;
+    line-height: 178px;
+    text-align: center;
+  }
+  .avatar {
+    width: 178px;
+    height: 178px;
+    display: block;
+  }
+</style>

src/views/cms/firstpageList.vue → src/views/cms/pageImgList.vue

 <template>
   <el-tabs v-model="activeName" @tab-click="handleTabClick">
-    <el-tab-pane v-for="(t,i) in lableList" :key="i" :label="t.lable" :name="t.name">
+    <el-tab-pane v-for="(t,i) in loactionTypes" :key="i" :label="t.name" :name="t.id">
+      <div class="system-table-search">
+        <div class="flex-h">
+          <div class="flex-item flex-h">
+            <el-button size="mini" type="success" @click='addImg'>新增</el-button>
+          </div>
+        </div>
+      </div>
       <div class="list">
         <el-table
-          :data="(comments[t.name] || {}).records"
+          :data="(banners[t.id] || {}).records"
           style="width: 100%">
           <el-table-column
             type="index"
             width="50">
             <template slot-scope="scope">
-              <span>{{ GetIndex(scope.$index, t.name) }}</span>
+              <span>{{ GetIndex(scope.$index, t.id) }}</span>
             </template>
           </el-table-column>
           <el-table-column
-            label="会员头像"
+            label="图片"
             width="180">
             <template slot-scope="scope">
               <div class="header">
-                <img :src="scope.row.avatar" alt="" />
+                <img :src="scope.row.url" alt="" />
               </div>
             </template>
           </el-table-column>
           <el-table-column
-            prop="customer_name"
-            label="会员姓名"
-          >
-          </el-table-column>
-          <el-table-column
-            prop="comment_content"
-            label="评论内容"
-          >
-          </el-table-column>
-          <el-table-column
-            prop="title"
-            :label="t.name == 'dynamic'?'项目动态标题':'活动标题'"
+            prop="orderNo"
+            label="排序"
           >
           </el-table-column>
           <el-table-column
-            prop="desc"
-            label="描述"
+            prop="link"
+            label="跳转地址"
           >
           </el-table-column>
           <el-table-column
             label="操作"
             width="100">
             <template slot-scope="scope">
-              <el-button type="text" @click="handleView(scope.row)" size="small">详情</el-button>
+              <el-button type="text" @click="handleEdit(scope.row)" size="small">详情</el-button>
               <el-button @click="handleDel(scope.row)" type="text" size="small">删除</el-button>
             </template>
           </el-table-column>
 </template>
 
 <script>
-import {createNamespacedHelpers} from 'vuex';
+import {createNamespacedHelpers, mapState} from 'vuex';
 
-const {mapActions: mapCommentActions} = createNamespacedHelpers('comment')
+const {mapActions: mapBannerActions} = createNamespacedHelpers('banner')
 
 export default {
   data () {
     return {
-      activeName: 'activity',
+      activeName: 'firstPage',
       pageSize: 20,
-      comments: [],
-      lableList: [{
-        name: 'activity',
-        lable: '活动评论'
-      },{
-        name: 'dynamic',
-        lable: '项目动态评论'
-      }]
+      banners: [],
     }
   },
   computed: {
+    ...mapState({
+      dicts: x =>  x.dicts,
+    }),
     currentPage: {
       get () {
-        return (this.comments[this.activeName] || {}).current || 1
+        return (this.banners[this.activeName] || {}).current || 1
       },
       set (val) {
-        if (this.comments[this.activeName]) {
-          let m = this.comments[this.activeName]
+        if (this.banners[this.activeName]) {
+          let m = this.banners[this.activeName]
           m.current = val
-          this.comments = {...this.comments, m}
+          this.banners = {...this.banners, m}
         }
       }
     },
     total () {
-      return (this.comments[this.activeName] || {}).total
+      return (this.banners[this.activeName] || {}).total
     },
+    loactionTypes () {
+      return this.dicts.filter(x => x.type == 'imgLocation')
+    }
   },
   methods: {
-    ...mapCommentActions([
-      'getComments',
-      'delComment'
+    ...mapBannerActions([
+      'getBanners',
+      'deleteBanner'
     ]),
     GetIndex (inx, typeid) {
-      const comment = this.comments[typeid]
-      return (comment.current - 1) * comment.size + inx + 1
+      const banner = this.banners[typeid]
+      return (banner.current - 1) * banner.size + inx + 1
     },
-    getCommentList (typeid, page) {
+    getBannerList (location, page) {
       return new Promise(resolve => {
-        this.getComments({
+        this.getBanners({
           pageSize: this.pageSize,
           pageNum: page,
-          commentType: typeid
+          location
         }).then(data => {
           let m = {}
-          m[typeid] = {...data}
-          this.comments = {...this.comments, ...m}
+          m[location] = {...data}
+          this.banners = {...this.banners, ...m}
           resolve(data)
         })
       })
     },
     handleTabClick (tab) {
-      this.getCommentList(tab.paneName, 1)
+      this.getBannerList(tab.paneName, 1)
     },
     pageChange (page) {
-      this.getCommentList(this.activeName, page)
+      this.getBannerList(this.activeName, page)
+    },
+    addImg () {
+      this.$router.push({name: 'pageBannerEdit'})
     },
-    handleView (row) {
-      this.$router.push({name: 'commentdetail', query: {id: row.comment_id}})
+    handleEdit (row) {
+      this.$router.push({name: 'pageBannerEdit', query: {id: row.pageId}})
     },
     handleDel (row) {
       this.$confirm('确认删除此数据?', '提示', {
         cancelButtonText: '取消',
         type: 'warning'
       }).then(() => {
-        this.delComment({
-          id: row.comment_id
+        this.deleteBanner({
+          id: row.pageId
         }).then(() => {
-          this.getCommentList(this.activeName, this.currentPage)
+          this.getBannerList(this.activeName, this.currentPage)
         })
       })
     }
   },
   created() {
-    this.getCommentList(this.activeName, 1)
+    this.getBannerList(this.activeName, 1)
   }
 }
 </script>
 
 <style lang="scss" scoped>
-
+.header{
+  width: 50px;
+  height: 50px;
+  img{
+    width: 100%;
+    height: 100%;
+  }
+}
 </style>

src/views/index.js

       {
         path: 'pageBannerList',
         name: 'pageBannerList',
-        component: () => import('./cms/firstpageList.vue'),
+        component: () => import('./cms/pageImgList.vue'),
         meta: {
           menuShow: true,
           title: 'Banner管理',
         },
       },
+      {
+        path: 'pageBannerEdit',
+        name: 'pageBannerEdit',
+        component: () => import('./cms/pageImgEdit.vue'),
+        meta: {
+          menuShow: false,
+          title: 'Banner编辑',
+        },
+      }
     ]
   },
   {