瀏覽代碼

应用配置

Baozhangchao 3 年之前
父節點
當前提交
9ea009138a

+ 61
- 0
src/api/AppControllerApi.js 查看文件

@@ -0,0 +1,61 @@
1
+
2
+
3
+
4
+import request from '@/utils/request'
5
+
6
+/**
7
+* 应用管理列表
8
+* @param {*} data
9
+* @returns
10
+*/
11
+export const getAppControllerList = (params) => request({
12
+  url: '/admin/app', params
13
+
14
+})
15
+
16
+
17
+/**
18
+* 保存应用管理
19
+* @param {*} data
20
+* @returns
21
+*/
22
+export const saveAppController = (data) => request({
23
+  url: '/admin/app',
24
+  method: 'post',
25
+  data
26
+})
27
+
28
+/**
29
+* 应用管理详情
30
+* @param {*} 
31
+* @returns
32
+*/
33
+export const detailsAppController = (id) => request({
34
+  url: `admin/app/${id}`,
35
+
36
+  method: 'get',
37
+})
38
+
39
+/**
40
+* 修改应用管理
41
+* @param {*} 
42
+* @returns
43
+*/
44
+export const ChangeAppController = (data, id) => request({
45
+  url: `admin/app/${id}`,
46
+
47
+  method: 'put',
48
+  data
49
+})
50
+
51
+/**
52
+* 删除应用管理
53
+* @param {*} 
54
+* @returns
55
+*/
56
+export const DeleteAppController = (id) => request({
57
+  url: `admin/app/${id}`,
58
+  method: 'delete',
59
+})
60
+
61
+

+ 5
- 4
src/api/WeChatApi.js 查看文件

@@ -5,12 +5,13 @@ import request from '@/utils/request'
5 5
 * @param {*} data
6 6
 * @returns
7 7
 */
8
-export const getConfigList = (data) => request({
9
-  url: '/admin/wx/config',
10
-  method: 'get',
11
-  data
8
+export const getConfigList = (params) => request({
9
+  url: '/admin/wx/config', params
10
+
12 11
 })
13 12
 
13
+
14
+
14 15
 /**
15 16
 * 保存配置
16 17
 * @param {*} data

+ 1
- 0
src/icons/svg/appconfig.svg 查看文件

@@ -0,0 +1 @@
1
+<svg t="1640835131030" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9379" width="128" height="128"><path d="M1023.401462 126.021423v227.811239a125.680133 125.680133 0 0 1-125.59481 125.59481h-227.811239a125.680133 125.680133 0 0 1-125.59481-125.637471V126.021423A125.680133 125.680133 0 0 1 669.995413 0.426613h227.811239a125.680133 125.680133 0 0 1 125.59481 125.59481z m-543.931328 539.665201v227.811239a125.680133 125.680133 0 0 1-125.594811 125.552149h-227.811239a125.680133 125.680133 0 0 1-125.552149-125.594811v-227.811239a125.680133 125.680133 0 0 1 125.594811-125.552149h227.768577a125.680133 125.680133 0 0 1 125.594811 125.594811z m0-539.665201v227.811239a125.680133 125.680133 0 0 1-125.594811 125.59481h-227.811239A125.680133 125.680133 0 0 1 0.554597 353.790001V126.021423A126.021423 126.021423 0 0 1 126.106746 0.426613h227.768577a125.680133 125.680133 0 0 1 125.594811 125.59481z m225.336884 822.210863a29.222977 29.222977 0 0 0-34.171686 5.204676l-22.439833 23.122414c0 0.68258-1.066532 0.68258-1.706452 0.682581-1.066532 0-1.407822-0.34129-1.749112-0.682581l-42.490636-42.447974c-0.68258 0-0.68258-1.066532-0.68258-1.749113 0-1.023871 0.34129-1.365161 0.68258-1.706451l22.781124-22.823785a31.057412 31.057412 0 0 0 5.204676-34.171686l-2.772983-5.887257a189.842699 189.842699 0 0 1-8.276288-20.00814l-2.090403-6.228547a29.436284 29.436284 0 0 0-27.9858-20.050802h-2.389032a31.825315 31.825315 0 0 1-32.123944-32.081283c0-17.917738 14.163545-32.123944 32.123944-32.123945h2.389032a29.862896 29.862896 0 0 0 27.9858-20.050802l2.090403-6.185885c3.071612-6.911127 5.545966-14.163545 8.276288-20.050802l2.772983-5.844596a29.222977 29.222977 0 0 0-5.204676-34.171685l-22.781124-22.781124c-0.68258 0-0.68258-1.066532-0.68258-1.706452 0-1.066532 0.34129-1.407822 0.68258-1.749112l41.808055-42.490636c0-0.68258 1.023871-0.68258 1.706452-0.68258 1.023871 0 1.365161 0.34129 1.706451 0.68258l22.823785 22.781124c8.958869 7.934998 22.781124 10.366691 34.129025 5.204676l5.887256-2.772983a189.842699 189.842699 0 0 1 20.050802-8.276288l6.228547-2.090403a29.436284 29.436284 0 0 0 20.050802-27.9858v-2.389032c0-17.960399 14.120884-32.123944 32.081283-32.123944 17.917738 0 32.123944 14.163545 32.123945 32.123944v2.047742a29.862896 29.862896 0 0 0 20.34943 27.9858l6.228547 2.090403c6.911127 3.071612 13.822255 5.503305 20.050802 8.276288l5.844596 2.772983c11.390562 6.185886 25.554107 3.412902 34.171686-5.204676l22.781124-22.781124c0-0.68258 1.066532-0.68258 1.706451-0.68258 1.066532 0 1.407822 0.34129 1.749112 0.68258l42.490636 42.447974c0.68258 0 0.68258 1.066532 0.68258 1.749113 0 1.023871-0.34129 1.365161-0.68258 1.706451l-22.781124 22.823785a32.379912 32.379912 0 0 0-5.204676 34.171686l2.772983 5.887257c3.114273 6.527176 6.228547 13.779594 8.276288 20.00814l2.090403 6.228547a29.436284 29.436284 0 0 0 27.9858 20.050802h2.389032c17.960399 0 32.123944 14.120884 32.123944 32.081283 0 17.917738-14.163545 32.123944-32.123944 32.123945h-2.389032a29.862896 29.862896 0 0 0-27.9858 20.050802l-2.090403 6.185885c-3.071612 6.911127-5.545966 13.822255-8.276288 20.050802l-2.772983 5.844596a29.222977 29.222977 0 0 0 5.204676 34.171686l22.781124 22.781124c0.68258 0 0.68258 0.725242 0.68258 1.706451 0 1.066532-0.34129 1.407822-0.68258 1.749112l-42.490636 42.490636c0 0.34129-1.023871 0.68258-1.706451 0.68258-1.023871 0-1.365161-0.34129-1.706451-0.68258l-22.823785-22.781124a32.379912 32.379912 0 0 0-34.171686-5.204676l-5.887257 2.772983a189.842699 189.842699 0 0 1-20.050802 8.276288l-6.185886 2.090403a29.436284 29.436284 0 0 0-20.050801 27.9858v2.389032c0 17.960399-14.120884 32.123944-32.081284 32.123944a31.825315 31.825315 0 0 1-32.123944-32.123944v-2.389032a29.862896 29.862896 0 0 0-20.050802-27.9858l-6.185886-2.090403c-6.911127-3.071612-13.822255-5.545966-20.050801-8.276288l-5.844596-2.772983zM789.233693 718.415967c-34.768944 0-63.991921 28.839026-63.991921 63.991921s28.839026 63.991921 63.991921 63.991921 63.991921-28.839026 63.991921-63.991921c-0.810564-35.152895-28.455074-63.991921-63.991921-63.991921z" p-id="9380"></path></svg>

+ 1
- 0
src/icons/svg/wx.svg 查看文件

@@ -0,0 +1 @@
1
+<svg t="1640834968791" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5597" width="64" height="64"><path d="M693.12 347.264c11.776 0 23.36 0.896 35.008 2.176-31.36-146.048-187.456-254.528-365.696-254.528C163.2 94.912 0 230.656 0 403.136c0 99.52 54.272 181.248 145.024 244.736L108.8 756.864l126.72-63.488c45.312 8.896 81.664 18.112 126.912 18.112 11.392 0 22.656-0.512 33.792-1.344-7.04-24.256-11.2-49.6-11.2-76.032C385.088 475.776 521.024 347.264 693.12 347.264zM498.304 249.024c27.392 0 45.376 17.984 45.376 45.248 0 27.136-17.984 45.312-45.376 45.312-27.072 0-54.336-18.176-54.336-45.312C443.968 266.944 471.168 249.024 498.304 249.024zM244.672 339.584c-27.2 0-54.592-18.176-54.592-45.312 0-27.264 27.392-45.248 54.592-45.248S289.92 266.944 289.92 294.272C289.92 321.408 271.872 339.584 244.672 339.584zM1024 629.76c0-144.896-145.024-262.976-307.904-262.976-172.48 0-308.224 118.144-308.224 262.976 0 145.28 135.808 262.976 308.224 262.976 36.096 0 72.512-9.024 108.736-18.112l99.392 54.528-27.264-90.624C969.728 783.872 1024 711.488 1024 629.76zM616.128 584.384c-17.984 0-36.224-17.92-36.224-36.224 0-18.048 18.24-36.224 36.224-36.224 27.52 0 45.376 18.176 45.376 36.224C661.504 566.464 643.648 584.384 616.128 584.384zM815.488 584.384c-17.856 0-36.032-17.92-36.032-36.224 0-18.048 18.112-36.224 36.032-36.224 27.264 0 45.376 18.176 45.376 36.224C860.864 566.464 842.752 584.384 815.488 584.384z" p-id="5598"></path></svg>

+ 18
- 2
src/router/index.js 查看文件

@@ -104,7 +104,7 @@ export const constantRoutes = [
104 104
         path: 'WeChatConfig',
105 105
         name: 'WeChatConfig',
106 106
         component: () => import('@/views/WeChatConfig/index'),
107
-        meta: { title: '微信配置', icon: 'app' }
107
+        meta: { title: '微信配置', icon: 'wx' }
108 108
       },
109 109
       {
110 110
         hidden: true,
@@ -116,6 +116,22 @@ export const constantRoutes = [
116 116
     ]
117 117
   },
118 118
 
119
+  // 应用管理
120
+
121
+  {
122
+    path: '/AppController',
123
+    component: Layout,
124
+    meta: { title: '应用管理', icon: 'form' },
125
+    children: [
126
+      {
127
+        path: 'AppController',
128
+        name: '',
129
+        component: () => import('@/views/AppController/index'),
130
+        meta: { title: '应用管理', icon: 'appconfig' }
131
+      }
132
+    ]
133
+  },
134
+
119 135
   {
120 136
     path: '/login',
121 137
     component: () => import('@/views/login/index'),
@@ -152,7 +168,7 @@ const createRouter = () => new Router({
152 168
 const router = createRouter()
153 169
 
154 170
 // Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465
155
-export function resetRouter() {
171
+export function resetRouter () {
156 172
   const newRouter = createRouter()
157 173
   router.matcher = newRouter.matcher // reset router
158 174
 }

+ 1
- 1
src/store/modules/settings.js 查看文件

@@ -18,7 +18,7 @@ const mutations = {
18 18
 }
19 19
 
20 20
 const actions = {
21
-  changeSetting({ commit }, data) {
21
+  changeSetting ({ commit }, data) {
22 22
     commit('CHANGE_SETTING', data)
23 23
   }
24 24
 }

+ 3
- 3
src/store/modules/user.js 查看文件

@@ -23,7 +23,7 @@ const mutations = {
23 23
 // this.$store.dispatch('user/login', this.loginForm)调用api里面的方法
24 24
 const actions = {
25 25
   // user login
26
-  login({ commit }, userInfo) {
26
+  login ({ commit }, userInfo) {
27 27
     const { userName, password } = userInfo
28 28
     return new Promise((resolve, reject) => {
29 29
       login({ userName: userName.trim(), password: password }).then(response => {
@@ -39,7 +39,7 @@ const actions = {
39 39
   },
40 40
 
41 41
   // user logout
42
-  logout({ commit, state }) {
42
+  logout ({ commit, state }) {
43 43
     return new Promise((resolve, reject) => {
44 44
       removeToken() // must remove  token  first
45 45
       resetRouter()
@@ -49,7 +49,7 @@ const actions = {
49 49
   },
50 50
 
51 51
   // remove token
52
-  resetToken({ commit }) {
52
+  resetToken ({ commit }) {
53 53
     return new Promise(resolve => {
54 54
       removeToken() // must remove  token  first
55 55
       commit('RESET_STATE')

+ 208
- 0
src/views/AppController/index.vue 查看文件

@@ -0,0 +1,208 @@
1
+<template>
2
+  <div class="body">
3
+    <el-card class="box-card">
4
+      <div slot="header" class="clearfix">
5
+        <el-button type="primary" style="float: right" @click="dialogFormVisible = true">新建应用</el-button>
6
+      </div>
7
+      <div class="text item">
8
+        <el-table stripe :data="tableData" border style="width: 100%">
9
+          <el-table-column prop="appName" label="应用名称" min-width="100" />
10
+
11
+          <el-table-column align="center" label="操作" min-width="100" width="500">
12
+            <template slot-scope="scope">
13
+              <el-button
14
+                style="margin-right:5em"
15
+                type="primary"
16
+                @click="handeldialog(scope.row.appId)"
17
+              >编辑</el-button>
18
+              <el-popconfirm
19
+                icon="el-icon-info"
20
+                icon-color="red"
21
+                title="确定要删除该配置吗?"
22
+                @onConfirm="handleDelete(scope.row.appId)"
23
+              >
24
+                <el-button slot="reference" type="danger">删除</el-button>
25
+              </el-popconfirm>
26
+            </template>
27
+          </el-table-column>
28
+        </el-table>
29
+        <el-pagination
30
+          v-show="WxTotal!==0"
31
+          style="float:right; margin:20px 0"
32
+          :total="WxTotal"
33
+          :current-page="currentPage"
34
+          :page-size="pageSize"
35
+          :page-sizes="[pageSize, 20, 35,40,50,80,100]"
36
+          layout="total, prev, pager, next, sizes"
37
+          @size-change="handleSizeChange"
38
+          @current-change="handleCurrentChange"
39
+        />
40
+      </div>
41
+    </el-card>
42
+    <el-dialog
43
+      :title="!APP_ID?'新建应用':'修改应用'"
44
+      :visible.sync="dialogFormVisible"
45
+      :show-close="false"
46
+      :close-on-click-modal="false"
47
+    >
48
+      <el-form
49
+        ref="ruleForm"
50
+        :model="ruleForm"
51
+        :rules="rules"
52
+        label-width="10vw"
53
+        class="demo-ruleForm"
54
+      >
55
+        <el-form-item label="应用名称" prop="appName" style="width:30vw">
56
+          <el-input v-model="ruleForm.appName" />
57
+        </el-form-item>
58
+      </el-form>
59
+      <div slot="footer" class="dialog-footer">
60
+        <el-button type="primary" @click="submitForm('ruleForm')">{{ !APP_ID?'新建应用':'修改应用' }}</el-button>
61
+
62
+        <el-button @click="closeDialog('ruleForm')">取 消</el-button>
63
+      </div>
64
+    </el-dialog>
65
+  </div>
66
+</template>
67
+<script>
68
+import {
69
+  getAppControllerList,
70
+  DeleteAppController,
71
+  saveAppController,
72
+  detailsAppController,
73
+  ChangeAppController
74
+} from '@/api/AppControllerApi'
75
+
76
+export default {
77
+  data() {
78
+    return {
79
+      APP_ID: '',
80
+      ruleForm: {
81
+        appName: '',
82
+        secret: ''
83
+      },
84
+      rules: {
85
+        appName: [
86
+          { required: true, message: '请输入应用名称', trigger: 'blur' }
87
+        ]
88
+      },
89
+      appName: undefined,
90
+      dialogFormVisible: false,
91
+      tableData: [],
92
+      //
93
+      pageSize: 10,
94
+      currentPage: 1,
95
+      WxTotal: 0 // 条目总数
96
+    }
97
+  },
98
+  // -----------模态框事件------------
99
+  watch: {
100
+    APP_ID: function (newAppID, oldVal) {
101
+      detailsAppController(newAppID).then((res) => {
102
+        this.ruleForm = res.data
103
+      })
104
+    }
105
+  },
106
+  mounted() {
107
+    this.onSearch()
108
+    if (this.APP_ID) {
109
+      detailsAppController(this.APP_ID).then((res) => {
110
+        this.ruleForm = res.data
111
+      })
112
+    }
113
+  },
114
+  methods: {
115
+    // 取消
116
+    closeDialog(formName) {
117
+      this.APP_ID = ''
118
+      this.$refs[formName].resetFields()
119
+
120
+      this.dialogFormVisible = false
121
+    },
122
+    // 确定
123
+    handeldialog(e) {
124
+      this.APP_ID = e
125
+      this.dialogFormVisible = true
126
+    },
127
+
128
+    submitForm(formName) {
129
+      this.$refs[formName].validate((valid) => {
130
+        if (valid) {
131
+          if (this.APP_ID == '') {
132
+            saveAppController(this.ruleForm)
133
+              .then((e) => {
134
+                this.$message.success('配置保存成功')
135
+                this.dialogFormVisible = false
136
+                this.$refs[formName].resetFields()
137
+                this.onSearch()
138
+
139
+                console.log('保存字段', e)
140
+              })
141
+              .catch((e) => {
142
+                this.$message.error('保存失败', e)
143
+              })
144
+          } else {
145
+            ChangeAppController(this.ruleForm, this.APP_ID).then((res) => {
146
+              this.$message.success('配置修改成功')
147
+              this.dialogFormVisible = false
148
+              this.onSearch()
149
+            })
150
+          }
151
+        } else {
152
+          return false
153
+        }
154
+      })
155
+    },
156
+
157
+    // -----------模态框事件结束------------
158
+
159
+    // 改变每页显示条数
160
+    handleSizeChange(val) {
161
+      this.pageSize = val
162
+      this.changePagination()
163
+    },
164
+    // 改变页码
165
+    handleCurrentChange(val) {
166
+      this.currentPage = val
167
+      this.changePagination()
168
+    },
169
+    // 改变分页组件重新查询数据
170
+    changePagination() {
171
+      getAppControllerList({
172
+        pageNum: this.currentPage,
173
+        pageSize: this.pageSize
174
+      }).then((res) => {
175
+        this.tableData = res.data.records
176
+      })
177
+    },
178
+
179
+    handleAdd() {
180
+      // this.$router.push({ path: 'AppController/Edit' });
181
+      this.dialogFormVisible = true
182
+    },
183
+
184
+    handleDelete(APP_DELETE) {
185
+      DeleteAppController(APP_DELETE).then(() => {
186
+        this.onSearch()
187
+      })
188
+    },
189
+    onSearch() {
190
+      getAppControllerList({
191
+        pageNum: this.currentPage,
192
+        pageSize: this.pageSize
193
+      }).then((res) => {
194
+        console.log('🚀 ~ file: index.vue ~ line 118 ~ onSearch ~ res', res)
195
+        this.tableData = res.data.records
196
+        this.WxTotal = res.data.total
197
+      })
198
+    },
199
+    onReset() {
200
+      this.appName = ''
201
+
202
+      this.onSearch()
203
+    }
204
+  }
205
+}
206
+</script>
207
+<style>
208
+</style>

+ 38
- 33
src/views/WeChatConfig/Edit.vue 查看文件

@@ -51,8 +51,8 @@
51 51
           </el-form-item>
52 52
           <el-form-item label="发布状态" prop="status">
53 53
             <el-select v-model="ruleForm.status" placeholder="请选择状态">
54
-              <el-option label="发布" value="1" />
55
-              <el-option label="未发布" value="0" />
54
+              <el-option label="发布" :value="1" />
55
+              <el-option label="未发布" :value="0" />
56 56
             </el-select>
57 57
           </el-form-item>
58 58
 
@@ -68,7 +68,7 @@
68 68
 </template>
69 69
 
70 70
 <script>
71
-import { saveConfig, detailsConfig, ChangeConfig } from '@/api/WeChatApi';
71
+import { saveConfig, detailsConfig, ChangeConfig } from '@/api/WeChatApi'
72 72
 
73 73
 export default {
74 74
   data() {
@@ -112,32 +112,37 @@ export default {
112 112
 
113 113
         status: [{ required: true, message: '请选择状态', trigger: 'blur' }]
114 114
       }
115
-    };
115
+    }
116 116
   },
117 117
   watch: {
118
-    '$route.query.id'(val) {
119
-      this.configId = val;
120
-      detailsConfig(val)
121
-        .then((res) => {
122
-          this.ruleForm = res.data;
123
-        })
124
-        .catch((e) => {
125
-          this.$message.error('ID有误。');
126
-          this.$router.go(-1);
127
-        });
118
+    '$route.query.configId': {
119
+      handleChange(val) {
120
+        if (val) {
121
+          this.configId = val
122
+          detailsConfig(val)
123
+            .then((res) => {
124
+              this.ruleForm = res.data
125
+            })
126
+            .catch((e) => {
127
+              this.$message.error('ID有误。')
128
+              this.$router.go(-1)
129
+            })
130
+        }
131
+      },
132
+      immediate: true
128 133
     }
129 134
   },
130 135
   mounted() {
131
-    if (this.$route?.query.id) {
132
-      this.configId = this.$route.query.id;
133
-      detailsConfig(this.$route.query.id)
136
+    if (this.$route?.query.configId) {
137
+      this.configId = this.$route.query.configId
138
+      detailsConfig(this.configId)
134 139
         .then((res) => {
135
-          this.ruleForm = res.data;
140
+          this.ruleForm = res.data
136 141
         })
137 142
         .catch((e) => {
138
-          this.$message.error('ID有误。');
139
-          this.$router.go(-1);
140
-        });
143
+          this.$message.error('ID有误。')
144
+          this.$router.go(-1)
145
+        })
141 146
     }
142 147
   },
143 148
   methods: {
@@ -147,29 +152,29 @@ export default {
147 152
           if (this.configId == '') {
148 153
             saveConfig(this.ruleForm)
149 154
               .then((e) => {
150
-                this.$message.success('配置保存成功');
151
-                this.$router.go(-1);
152
-                console.log('保存字段', e);
155
+                this.$message.success('配置保存成功')
156
+                this.$router.go(-1)
157
+                console.log('保存字段', e)
153 158
               })
154 159
               .catch((e) => {
155
-                this.$message.error('保存失败', e);
156
-              });
160
+                this.$message.error('保存失败', e)
161
+              })
157 162
           } else {
158 163
             ChangeConfig(this.ruleForm, this.configId).then((res) => {
159
-              this.$message.success('配置修改成功');
160
-              this.$router.go(-1);
161
-            });
164
+              this.$message.success('配置修改成功')
165
+              this.$router.go(-1)
166
+            })
162 167
           }
163 168
         } else {
164
-          return false;
169
+          return false
165 170
         }
166
-      });
171
+      })
167 172
     },
168 173
     resetForm(formName) {
169
-      this.$refs[formName].resetFields();
174
+      this.$refs[formName].resetFields()
170 175
     }
171 176
   }
172
-};
177
+}
173 178
 </script>
174 179
 
175 180
 <style scoped >

+ 76
- 39
src/views/WeChatConfig/index.vue 查看文件

@@ -1,12 +1,5 @@
1 1
 <template>
2 2
   <div class="body">
3
-    <el-card class="box-card">
4
-      配置名称:
5
-      <el-input v-model="appName" size="medium" style="width: 200px; margin-right: 20px" />
6
-
7
-      <el-button type="primary" @click="onSearch">查询</el-button>
8
-      <el-button @click="onReset">重置</el-button>
9
-    </el-card>
10 3
     <el-card class="box-card">
11 4
       <div slot="header" class="clearfix">
12 5
         <el-button type="primary" style="float: right" @click="handleAdd">新建配置</el-button>
@@ -17,37 +10,60 @@
17 10
 
18 11
           <el-table-column prop="picture" label="二维码" align="center">
19 12
             <template slot-scope="scope">
20
-              <img :src="scope.row.qrCode" min-width="70" height="70" />
13
+              <!-- :src="scope.row.qrCode" -->
14
+
15
+              <img
16
+                src="https://cdn4.buysellads.net/uu/1/41334/1550855401-cc_light.png"
17
+                min-width="70"
18
+                height="100"
19
+              />
21 20
             </template>
22 21
           </el-table-column>
23 22
 
24
-          <el-table-column prop="createDate" label="状态">
23
+          <el-table-column prop="createDate" label="状态" align="center" width="200">
25 24
             <template slot-scope="scope">
26
-              {{
27
-              scope.row.status==1?'发布':'未发布'
28
-              }}
25
+              <el-tag
26
+                :type="scope.row.status==1?'success':'danger'"
27
+                size="small "
28
+                effect="dark"
29
+              >{{ scope.row.status==1?'发布':'未发布' }}</el-tag>
29 30
             </template>
30 31
           </el-table-column>
31
-          <el-table-column fixed="right" label="操作">
32
+          <el-table-column align="center" label="操作" min-width="100" width="280">
32 33
             <template slot-scope="scope">
33
-              <el-button type="text" @click="handleEdit(scope.row)">编辑</el-button>
34
+              <el-button style="margin-right:1em" type="primary">
35
+                <router-link
36
+                  :to="{path:'WeChatConfig/Edit',query: { configId: scope.row.configId }}"
37
+                >编辑</router-link>
38
+              </el-button>
34 39
               <el-popconfirm
35 40
                 icon="el-icon-info"
36 41
                 icon-color="red"
37 42
                 title="确定要删除该配置吗?"
38 43
                 @onConfirm="handleDelete(scope.row)"
39 44
               >
40
-                <el-button slot="reference" type="text">删除</el-button>
45
+                <el-button slot="reference" type="danger">删除</el-button>
41 46
               </el-popconfirm>
42 47
             </template>
43 48
           </el-table-column>
44 49
         </el-table>
50
+        <el-pagination
51
+          v-show="WxTotal!==0"
52
+          style="float:right; margin:20px 0"
53
+          :total="WxTotal"
54
+          :current-page="currentPage"
55
+          :page-size="pageSize"
56
+          :page-sizes="[pageSize, 20, 35,40,50,80,100]"
57
+          layout="total, prev, pager, next, sizes"
58
+          @size-change="handleSizeChange"
59
+          @current-change="handleCurrentChange"
60
+        />
45 61
       </div>
46 62
     </el-card>
47 63
   </div>
48 64
 </template>
49 65
 <script>
50
-import { getConfigList, DeleteConfig } from '@/api/WeChatApi';
66
+import { getConfigList, DeleteConfig } from '@/api/WeChatApi'
51 67
 
52 68
 export default {
53 69
   data() {
@@ -56,44 +72,65 @@ export default {
56 72
       daterange: '',
57 73
       tableData: [],
58 74
       endDate: undefined,
59
-      startDate: undefined
60
-    };
75
+      startDate: undefined,
76
+      //
77
+      pageSize: 10,
78
+      currentPage: 1,
79
+      WxTotal: 0 // 条目总数
80
+    }
61 81
   },
62 82
   mounted() {
63
-    this.onSearch();
83
+    this.onSearch()
64 84
   },
65 85
   methods: {
66
-    handleAdd() {
67
-      this.$router.push({ path: 'WeChatConfig/Edit' });
86
+    // 改变每页显示条数
87
+    handleSizeChange(val) {
88
+      this.pageSize = val
89
+      this.changePagination()
68 90
     },
69
-    handleEdit(row) {
70
-      this.$router.push({
71
-        path: 'WeChatConfig/Edit',
72
-        query: { id: row.configId }
73
-      });
91
+    // 改变页码
92
+    handleCurrentChange(val) {
93
+      this.currentPage = val
94
+      this.changePagination()
74 95
     },
96
+    // 改变分页组件重新查询数据
97
+    changePagination() {
98
+      getConfigList({
99
+        // title: this.title,
100
+        // startDate: this.startDate,
101
+        // endDate: this.endDate,
102
+        pageNum: this.currentPage,
103
+        pageSize: this.pageSize
104
+      }).then((res) => {
105
+        this.tableData = res.data.records
106
+      })
107
+    },
108
+
109
+    handleAdd() {
110
+      this.$router.push({ path: 'WeChatConfig/Edit' })
111
+    },
112
+
75 113
     handleDelete(row) {
76 114
       DeleteConfig(row.configId).then(() => {
77
-        this.onSearch();
78
-      });
115
+        this.onSearch()
116
+      })
79 117
     },
80 118
     onSearch() {
81
-      getConfigList({ appName: this.appName }).then((res) => {
82
-        console.log('🚀 ~ file: index.vue ~ line 98 ~ onSearch ~ res', res);
83
-        this.tableData = res.data.records;
84
-      });
119
+      getConfigList({
120
+        pageNum: this.currentPage,
121
+        pageSize: this.pageSize
122
+      }).then((res) => {
123
+        this.tableData = res.data.records
124
+        this.WxTotal = res.data.total
125
+      })
85 126
     },
86 127
     onReset() {
87
-      this.appName = '';
128
+      this.appName = ''
88 129
 
89
-      this.onSearch();
90
-    },
91
-    dateChange(val) {
92
-      this.startDate = this.daterange[0];
93
-      this.endDate = this.daterange[1];
130
+      this.onSearch()
94 131
     }
95 132
   }
96
-};
133
+}
97 134
 </script>
98 135
 <style>
99 136
 </style>

+ 34
- 36
src/views/gameManage/index.vue 查看文件

@@ -1,12 +1,8 @@
1 1
 <template>
2 2
   <div class="body" style="font-size:14px">
3 3
     <el-card class="box-card">
4
-      游戏名称:<el-input
5
-        v-model="title"
6
-        size="mini"
7
-        style="width: 200px; margin-right: 20px"
8
-      />
9
-      创建时间:
4
+      游戏名称:
5
+      <el-input v-model="title" size="mini" style="width: 200px; margin-right: 20px" />创建时间:
10 6
       <el-date-picker
11 7
         v-model="daterange"
12 8
         size="mini"
@@ -30,9 +26,11 @@
30 26
         </template>
31 27
       </el-table-column>
32 28
       <el-table-column prop="createDate" label="创建时间">
33
-        <template slot-scope="scope">{{
29
+        <template slot-scope="scope">
30
+          {{
34 31
           scope.row.createDate.substr(0, 10)
35
-        }}</template>
32
+          }}
33
+        </template>
36 34
       </el-table-column>
37 35
       <el-table-column fixed="right" label="操作">
38 36
         <template slot-scope="scope">
@@ -61,7 +59,7 @@
61 59
   </div>
62 60
 </template>
63 61
 <script>
64
-import { getGameList, deleteGame } from '@/api/game'
62
+import { getGameList, deleteGame } from '@/api/game';
65 63
 
66 64
 export default {
67 65
   data() {
@@ -75,22 +73,22 @@ export default {
75 73
       //
76 74
       pageSize: 10,
77 75
       currentPage: 1,
78
-      gameTotal: 0// 条目总数
79
-    }
76
+      gameTotal: 0 // 条目总数
77
+    };
80 78
   },
81 79
   mounted() {
82
-    this.onSearch()
80
+    this.onSearch();
83 81
   },
84 82
   methods: {
85 83
     // 改变每页显示条数
86 84
     handleSizeChange(val) {
87
-      this.pageSize = val
88
-      this.changePagination()
85
+      this.pageSize = val;
86
+      this.changePagination();
89 87
     },
90 88
     // 改变页码
91 89
     handleCurrentChange(val) {
92
-      this.currentPage = val
93
-      this.changePagination()
90
+      this.currentPage = val;
91
+      this.changePagination();
94 92
     },
95 93
     // 改变分页组件重新查询数据
96 94
     changePagination() {
@@ -101,22 +99,22 @@ export default {
101 99
         pageNum: this.currentPage,
102 100
         pageSize: this.pageSize
103 101
       }).then((res) => {
104
-        this.tableData = res.data.records
105
-      })
102
+        this.tableData = res.data.records;
103
+      });
106 104
     },
107 105
     handleAdd() {
108
-      this.$router.push({ name: 'gameEdit' })
106
+      this.$router.push({ name: 'gameEdit' });
109 107
     },
110 108
     handleEdit(row) {
111 109
       this.$router.push({
112 110
         name: 'gameEdit',
113 111
         query: { id: row.gameId }
114
-      })
112
+      });
115 113
     },
116 114
     handleDelete(row) {
117 115
       deleteGame(row.gameId).then(() => {
118
-        this.onSearch()
119
-      })
116
+        this.onSearch();
117
+      });
120 118
     },
121 119
     onSearch() {
122 120
       getGameList({
@@ -125,26 +123,26 @@ export default {
125 123
         endDate: this.endDate,
126 124
         pageSize: this.pageSize
127 125
       }).then((res) => {
128
-        this.tableData = res.data.records
129
-        this.gameTotal = res.data.total
130
-        this.pageSize = res.data.size
131
-      })
126
+        this.tableData = res.data.records;
127
+        this.gameTotal = res.data.total;
128
+        this.pageSize = res.data.size;
129
+      });
132 130
     },
133 131
     onReset() {
134
-      this.title = undefined
135
-      this.daterange = undefined
136
-      this.startDate = undefined
137
-      this.endDate = undefined
138
-      this.currentPage = 1
139
-      this.pageSize = 10
140
-      this.onSearch()
132
+      this.title = undefined;
133
+      this.daterange = undefined;
134
+      this.startDate = undefined;
135
+      this.endDate = undefined;
136
+      this.currentPage = 1;
137
+      this.pageSize = 10;
138
+      this.onSearch();
141 139
     },
142 140
     dateChange(val) {
143
-      this.startDate = this.daterange[0]
144
-      this.endDate = this.daterange[1]
141
+      this.startDate = this.daterange[0];
142
+      this.endDate = this.daterange[1];
145 143
     }
146 144
   }
147
-}
145
+};
148 146
 </script>
149 147
 <style>
150 148
 </style>