wangfei 6 anos atrás
pai
commit
dbbb8f01b5

+ 44
- 0
src/config/api.js Ver arquivo

@@ -150,6 +150,50 @@ const apis = {
150 150
       method: 'post',
151 151
       url: `${commPrefix}/comment/add`
152 152
     }
153
+  },
154
+  banner: {
155
+    list: {
156
+      method: 'get',
157
+      url: `${commPrefix}/pageImgList`
158
+    },
159
+    detail: {
160
+      method: 'get',
161
+      url: `${commPrefix}/pageImgDetail/:id`
162
+    },
163
+    add: {
164
+      method: 'post',
165
+      url: `${commPrefix}/pageIm/add`
166
+    },
167
+    update: {
168
+      method: 'put',
169
+      url: `${commPrefix}/pageIm/update`
170
+    },
171
+    delete: {
172
+      method: 'delete',
173
+      url: `${commPrefix}/pageImg/delete`
174
+    }
175
+  },
176
+  dynamic: {
177
+    list: {
178
+      method: 'get',
179
+      url: `${commPrefix}/iBuildingDynamicList`
180
+    },
181
+    detail: {
182
+      method: 'get',
183
+      url: `${commPrefix}/iBuildingDynamicSelectId/:id`
184
+    },
185
+    add: {
186
+      method: 'post',
187
+      url: `${commPrefix}/buildingDynamic/add`
188
+    },
189
+    edit: {
190
+      method: 'put',
191
+      url: `${commPrefix}/buildingDynamic/update`
192
+    },
193
+    delete: {
194
+      method: 'delete',
195
+      url: `${commPrefix}/buildingDynamic/delete/:id`
196
+    },
153 197
   }
154 198
 }
155 199
 

+ 3
- 1
src/store/index.js Ver arquivo

@@ -8,6 +8,7 @@ import img from './modules/img'
8 8
 import customer from './modules/customer'
9 9
 import apartment from './modules/apartment'
10 10
 import comment from './modules/comment'
11
+import banner from './modules/banner'
11 12
 
12 13
 Vue.use(Vuex)
13 14
 
@@ -20,7 +21,8 @@ const store = new Vuex.Store({
20 21
     img,
21 22
     customer,
22 23
     apartment,
23
-    comment
24
+    comment,
25
+    banner
24 26
   }
25 27
 })
26 28
 

+ 48
- 1
src/store/modules/banner.js Ver arquivo

@@ -22,7 +22,7 @@ export default {
22 22
     },
23 23
     getBanners ({ commit }, payload) {
24 24
       return new Promise((resolve, reject) => {
25
-        const api = lodash.get(apis, 'comment.list')
25
+        const api = lodash.get(apis, 'banner.list')
26 26
         interact(api, payload).then((data) => {
27 27
           commit('updateList', data)
28 28
           resolve(data)
@@ -33,5 +33,52 @@ export default {
33 33
         })
34 34
       })
35 35
     },
36
+    getDetail ({ commit }, payload) {
37
+      return new Promise((resolve, reject) => {
38
+        const api = replaceApiParams(lodash.get(apis, 'banner.detail'), payload)
39
+        interact(api).then((data) => {
40
+          commit('updateDetail', data)
41
+          resolve(data)
42
+        }).catch(({ message }) => {
43
+          if (typeof message === 'string') {
44
+            reject(message)
45
+          }
46
+        })
47
+      })
48
+    },
49
+    addBanner (_, payload) {
50
+      return new Promise((resolve, reject) => {
51
+        const api = lodash.get(apis, 'banner.add')
52
+        interact(api, payload).then((data) => {
53
+          resolve(data)
54
+        }).catch(({ message }) => {
55
+          if (typeof message === 'string') {
56
+            reject(message)
57
+          }
58
+        })
59
+      })
60
+    },
61
+    editBanner (_, payload) {
62
+      return new Promise((resolve, reject) => {
63
+        const api = lodash.get(apis, 'banner.update')
64
+        interact(api, payload).then((data) => {
65
+          resolve(data)
66
+        }).catch(({ message }) => {
67
+          if (typeof message === 'string') {
68
+            reject(message)
69
+          }
70
+        })
71
+      })
72
+    },
73
+    deleteBanner (_, payload) {
74
+      return new Promise((resolve, reject) => {
75
+        const api = lodash.get(apis, 'banner.delete')
76
+        interact(api, payload).then(() => {
77
+          resolve()
78
+        }).catch(() => {
79
+          reject()
80
+        })
81
+      })
82
+    }
36 83
   }
37 84
 }

+ 80
- 0
src/store/modules/dynamic.js Ver arquivo

@@ -0,0 +1,80 @@
1
+import lodash from 'lodash'
2
+import { interact, replaceApiParams } from '../../utils'
3
+import apis from '../../config/api'
4
+
5
+export default {
6
+  namespaced: true,
7
+  state: {
8
+    dynamics: {},
9
+    detail: {}
10
+  },
11
+  mutations: {
12
+    updateList (state, payload) {
13
+      state.dynamics = payload
14
+    },
15
+    updateDetail (state, payload) {
16
+      state.detail = payload
17
+    }
18
+  },
19
+  actions: {
20
+    setDetailNull ({ commit }) {
21
+      commit('updateDetail', {})
22
+    },
23
+    getDynamics ({ commit }, payload) {
24
+      return new Promise((resolve, reject) => {
25
+        const api = lodash.get(apis, 'dynamic.list')
26
+        interact(api, payload).then((data) => {
27
+          commit('updateList', data)
28
+          resolve(data)
29
+        }).catch(({ message }) => {
30
+          if (typeof message === 'string') {
31
+            reject(message)
32
+          }
33
+        })
34
+      })
35
+    },
36
+    getDetail ({ commit }, payload) {
37
+      return new Promise((resolve, reject) => {
38
+        const api = replaceApiParams(lodash.get(apis, 'dynamic.detail'), payload)
39
+        interact(api).then((data) => {
40
+          commit('updateDetail', data)
41
+          resolve(data)
42
+        }).catch(({ message }) => {
43
+          if (typeof message === 'string') {
44
+            reject(message)
45
+          }
46
+        })
47
+      })
48
+    },
49
+    addDynamics (_, payload) {
50
+      return new Promise((resolve, reject) => {
51
+        const api = lodash.get(apis, 'dynamic.add')
52
+        interact(api, payload.detail).then((data) => {
53
+          resolve(data)
54
+        }).catch(({ message }) => {
55
+          reject(message)
56
+        })
57
+      })
58
+    },
59
+    editDynamics (_, payload) {
60
+      return new Promise((resolve, reject) => {
61
+        const api = lodash.get(apis, 'dynamic.edit')
62
+        interact(api, payload.detail).then((data) => {
63
+          resolve(data)
64
+        }).catch(({ message }) => {
65
+          reject(message)
66
+        })
67
+      })
68
+    },
69
+    deleteDynamics (_, payload) {
70
+      return new Promise((resolve, reject) => {
71
+        const api = replaceApiParams(lodash.get(apis, 'dynamic.delete'), payload)
72
+        interact(api).then(() => {
73
+          resolve()
74
+        }).catch(() => {
75
+          reject()
76
+        })
77
+      })
78
+    },
79
+  }
80
+}

+ 146
- 0
src/views/cms/pageImgEdit.vue Ver arquivo

@@ -0,0 +1,146 @@
1
+<template>
2
+  <el-form ref="form" :model="banner" label-width="160px">
3
+    <el-form-item label="图片位置">
4
+      <el-select v-model="banner.imgLocation" placeholder="请选择">
5
+        <el-option v-for="(type,i) in loactionTypes || []" :key="i" :label="type.name" :value="type.id"></el-option>
6
+      </el-select>
7
+    </el-form-item>
8
+    <el-form-item label="图片">
9
+      <el-upload
10
+        class="avatar-uploader"
11
+        :action="upFileUrl"
12
+        name='uploadFiles'
13
+        :show-file-list="false"
14
+        :before-upload="beforeImgUpload"
15
+        :on-success="handleAvatarSuccess">
16
+        <img v-if="banner.url" :src="banner.url" class="avatar">
17
+        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
18
+      </el-upload>
19
+    </el-form-item>
20
+    <el-form-item label="排序">
21
+      <el-input v-model="banner.orderNo"></el-input>
22
+    </el-form-item>
23
+    <el-form-item label="页面跳转地址">
24
+      <el-input v-model="banner.link"></el-input>
25
+    </el-form-item>
26
+    <el-form-item>
27
+      <el-button type="primary" @click="onSubmit">保存</el-button>
28
+      <el-button @click="onCancel">取消</el-button>
29
+    </el-form-item>
30
+  </el-form>
31
+</template>
32
+
33
+<script>
34
+import { createNamespacedHelpers, mapState } from 'vuex'
35
+import apis from '../../config/api'
36
+
37
+const { mapState: mapBannerState, mapActions: mapBannerActions, mapMutations: mapBannerMutations } = createNamespacedHelpers('banner')
38
+
39
+export default {
40
+  data () {
41
+    return {
42
+      upFileUrl: apis.file.upload.url,
43
+      imgType: ''
44
+    }
45
+  },
46
+  computed: {
47
+    ...mapBannerState({
48
+      detail: x => x.detail,
49
+    }),
50
+    banner: {
51
+      get () {
52
+        return this.detail
53
+      },
54
+      set (val) {
55
+        return this.updateDetail(val)
56
+      }
57
+    },
58
+    ...mapState({
59
+      dicts: x => x.dicts
60
+    }),
61
+    loactionTypes () {
62
+      return this.dicts.filter(x => x.type == 'imgLocation')
63
+    }
64
+  },
65
+  methods: {
66
+    ...mapBannerMutations([
67
+      'updateDetail'
68
+    ]),
69
+    ...mapBannerActions([
70
+      'getDetail',
71
+      'addBanner',
72
+      'editBanner'
73
+    ]),
74
+    beforeImgUpload (file) {
75
+      // if (file.type !== 'image/jpeg') {
76
+      //   this.$message.error('上传图片只能是 JPG 格式!')
77
+      //   return false
78
+      // }
79
+      // if (file.size / 1024 > 300) {
80
+      //   this.$message.error('图片大小不允许超过300k!')
81
+      //   return false
82
+      // }
83
+      this.imgType = file.type
84
+      this.loading = this.$loading({
85
+        lock: true,
86
+        text: '上传中...',
87
+        spinner: 'el-icon-loading',
88
+        background: 'rgba(0, 0, 0, 0.7)'
89
+      })
90
+
91
+      return true
92
+    },
93
+    handleAvatarSuccess (res) {
94
+      this.updateDetail({...this.banner, url: res.data[0], imgType: this.imgType})
95
+      this.loading.close()
96
+    },
97
+    onSubmit () {
98
+      if (!this.detail.pageId) {
99
+        // 新增
100
+        this.addBanner(JSON.stringify(this.detail)).then(() => {
101
+          this.onCancel()
102
+        })
103
+      } else {
104
+        // 修改
105
+        this.editBanner(JSON.stringify(this.detail)).then(() => {
106
+          this.onCancel()
107
+        })
108
+      }
109
+    },
110
+    onCancel () {
111
+      this.$router.push({name: 'pageBannerList'})
112
+    }
113
+  },
114
+  mounted () {
115
+    if ((this.$route.query.id || '') !== '') {
116
+      this.getDetail({id: this.$route.query.id})
117
+    }
118
+  }
119
+}
120
+</script>
121
+
122
+<style lang="scss">
123
+  .avatar-uploader .el-upload {
124
+    border: 1px dashed #d9d9d9;
125
+    border-radius: 6px;
126
+    cursor: pointer;
127
+    position: relative;
128
+    overflow: hidden;
129
+  }
130
+  .avatar-uploader .el-upload:hover {
131
+    border-color: #409EFF;
132
+  }
133
+  .avatar-uploader-icon {
134
+    font-size: 28px;
135
+    color: #8c939d;
136
+    width: 178px;
137
+    height: 178px;
138
+    line-height: 178px;
139
+    text-align: center;
140
+  }
141
+  .avatar {
142
+    width: 178px;
143
+    height: 178px;
144
+    display: block;
145
+  }
146
+</style>

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

@@ -1,44 +1,41 @@
1 1
 <template>
2 2
   <el-tabs v-model="activeName" @tab-click="handleTabClick">
3
-    <el-tab-pane v-for="(t,i) in lableList" :key="i" :label="t.lable" :name="t.name">
3
+    <el-tab-pane v-for="(t,i) in loactionTypes" :key="i" :label="t.name" :name="t.id">
4
+      <div class="system-table-search">
5
+        <div class="flex-h">
6
+          <div class="flex-item flex-h">
7
+            <el-button size="mini" type="success" @click='addImg'>新增</el-button>
8
+          </div>
9
+        </div>
10
+      </div>
4 11
       <div class="list">
5 12
         <el-table
6
-          :data="(comments[t.name] || {}).records"
13
+          :data="(banners[t.id] || {}).records"
7 14
           style="width: 100%">
8 15
           <el-table-column
9 16
             type="index"
10 17
             width="50">
11 18
             <template slot-scope="scope">
12
-              <span>{{ GetIndex(scope.$index, t.name) }}</span>
19
+              <span>{{ GetIndex(scope.$index, t.id) }}</span>
13 20
             </template>
14 21
           </el-table-column>
15 22
           <el-table-column
16
-            label="会员头像"
23
+            label="图片"
17 24
             width="180">
18 25
             <template slot-scope="scope">
19 26
               <div class="header">
20
-                <img :src="scope.row.avatar" alt="" />
27
+                <img :src="scope.row.url" alt="" />
21 28
               </div>
22 29
             </template>
23 30
           </el-table-column>
24 31
           <el-table-column
25
-            prop="customer_name"
26
-            label="会员姓名"
27
-          >
28
-          </el-table-column>
29
-          <el-table-column
30
-            prop="comment_content"
31
-            label="评论内容"
32
-          >
33
-          </el-table-column>
34
-          <el-table-column
35
-            prop="title"
36
-            :label="t.name == 'dynamic'?'项目动态标题':'活动标题'"
32
+            prop="orderNo"
33
+            label="排序"
37 34
           >
38 35
           </el-table-column>
39 36
           <el-table-column
40
-            prop="desc"
41
-            label="描述"
37
+            prop="link"
38
+            label="跳转地址"
42 39
           >
43 40
           </el-table-column>
44 41
           <el-table-column
@@ -46,7 +43,7 @@
46 43
             label="操作"
47 44
             width="100">
48 45
             <template slot-scope="scope">
49
-              <el-button type="text" @click="handleView(scope.row)" size="small">详情</el-button>
46
+              <el-button type="text" @click="handleEdit(scope.row)" size="small">详情</el-button>
50 47
               <el-button @click="handleDel(scope.row)" type="text" size="small">删除</el-button>
51 48
             </template>
52 49
           </el-table-column>
@@ -67,73 +64,75 @@
67 64
 </template>
68 65
 
69 66
 <script>
70
-import {createNamespacedHelpers} from 'vuex';
67
+import {createNamespacedHelpers, mapState} from 'vuex';
71 68
 
72
-const {mapActions: mapCommentActions} = createNamespacedHelpers('comment')
69
+const {mapActions: mapBannerActions} = createNamespacedHelpers('banner')
73 70
 
74 71
 export default {
75 72
   data () {
76 73
     return {
77
-      activeName: 'activity',
74
+      activeName: 'firstPage',
78 75
       pageSize: 20,
79
-      comments: [],
80
-      lableList: [{
81
-        name: 'activity',
82
-        lable: '活动评论'
83
-      },{
84
-        name: 'dynamic',
85
-        lable: '项目动态评论'
86
-      }]
76
+      banners: [],
87 77
     }
88 78
   },
89 79
   computed: {
80
+    ...mapState({
81
+      dicts: x =>  x.dicts,
82
+    }),
90 83
     currentPage: {
91 84
       get () {
92
-        return (this.comments[this.activeName] || {}).current || 1
85
+        return (this.banners[this.activeName] || {}).current || 1
93 86
       },
94 87
       set (val) {
95
-        if (this.comments[this.activeName]) {
96
-          let m = this.comments[this.activeName]
88
+        if (this.banners[this.activeName]) {
89
+          let m = this.banners[this.activeName]
97 90
           m.current = val
98
-          this.comments = {...this.comments, m}
91
+          this.banners = {...this.banners, m}
99 92
         }
100 93
       }
101 94
     },
102 95
     total () {
103
-      return (this.comments[this.activeName] || {}).total
96
+      return (this.banners[this.activeName] || {}).total
104 97
     },
98
+    loactionTypes () {
99
+      return this.dicts.filter(x => x.type == 'imgLocation')
100
+    }
105 101
   },
106 102
   methods: {
107
-    ...mapCommentActions([
108
-      'getComments',
109
-      'delComment'
103
+    ...mapBannerActions([
104
+      'getBanners',
105
+      'deleteBanner'
110 106
     ]),
111 107
     GetIndex (inx, typeid) {
112
-      const comment = this.comments[typeid]
113
-      return (comment.current - 1) * comment.size + inx + 1
108
+      const banner = this.banners[typeid]
109
+      return (banner.current - 1) * banner.size + inx + 1
114 110
     },
115
-    getCommentList (typeid, page) {
111
+    getBannerList (location, page) {
116 112
       return new Promise(resolve => {
117
-        this.getComments({
113
+        this.getBanners({
118 114
           pageSize: this.pageSize,
119 115
           pageNum: page,
120
-          commentType: typeid
116
+          location
121 117
         }).then(data => {
122 118
           let m = {}
123
-          m[typeid] = {...data}
124
-          this.comments = {...this.comments, ...m}
119
+          m[location] = {...data}
120
+          this.banners = {...this.banners, ...m}
125 121
           resolve(data)
126 122
         })
127 123
       })
128 124
     },
129 125
     handleTabClick (tab) {
130
-      this.getCommentList(tab.paneName, 1)
126
+      this.getBannerList(tab.paneName, 1)
131 127
     },
132 128
     pageChange (page) {
133
-      this.getCommentList(this.activeName, page)
129
+      this.getBannerList(this.activeName, page)
130
+    },
131
+    addImg () {
132
+      this.$router.push({name: 'pageBannerEdit'})
134 133
     },
135
-    handleView (row) {
136
-      this.$router.push({name: 'commentdetail', query: {id: row.comment_id}})
134
+    handleEdit (row) {
135
+      this.$router.push({name: 'pageBannerEdit', query: {id: row.pageId}})
137 136
     },
138 137
     handleDel (row) {
139 138
       this.$confirm('确认删除此数据?', '提示', {
@@ -141,20 +140,27 @@ export default {
141 140
         cancelButtonText: '取消',
142 141
         type: 'warning'
143 142
       }).then(() => {
144
-        this.delComment({
145
-          id: row.comment_id
143
+        this.deleteBanner({
144
+          id: row.pageId
146 145
         }).then(() => {
147
-          this.getCommentList(this.activeName, this.currentPage)
146
+          this.getBannerList(this.activeName, this.currentPage)
148 147
         })
149 148
       })
150 149
     }
151 150
   },
152 151
   created() {
153
-    this.getCommentList(this.activeName, 1)
152
+    this.getBannerList(this.activeName, 1)
154 153
   }
155 154
 }
156 155
 </script>
157 156
 
158 157
 <style lang="scss" scoped>
159
-
158
+.header{
159
+  width: 50px;
160
+  height: 50px;
161
+  img{
162
+    width: 100%;
163
+    height: 100%;
164
+  }
165
+}
160 166
 </style>

+ 10
- 1
src/views/index.js Ver arquivo

@@ -21,12 +21,21 @@ const pages = [
21 21
       {
22 22
         path: 'pageBannerList',
23 23
         name: 'pageBannerList',
24
-        component: () => import('./cms/firstpageList.vue'),
24
+        component: () => import('./cms/pageImgList.vue'),
25 25
         meta: {
26 26
           menuShow: true,
27 27
           title: 'Banner管理',
28 28
         },
29 29
       },
30
+      {
31
+        path: 'pageBannerEdit',
32
+        name: 'pageBannerEdit',
33
+        component: () => import('./cms/pageImgEdit.vue'),
34
+        meta: {
35
+          menuShow: false,
36
+          title: 'Banner编辑',
37
+        },
38
+      }
30 39
     ]
31 40
   },
32 41
   {