feat(demo): 重构微信公众号关注用户管理功能

- 修改API接口路径配置，将硬编码路径替换为动态变量
- 重命名API方法save为refreshOpenId，remove为initUserList，更新对应URL
- 将仪表板页面组件替换为关注用户组件，更新路由配置
- 更新请求拦截器中的状态码判断逻辑
- 修改搜索表单字段从姓名改为openid和unionid
- 重写表格列定义，显示openid、unionid、订阅来源等字段
- 替换表格操作按钮，移除添加和删除功能，添加初始化功能
- 新增初始化关注列表和重新拉取用户数据的方法
- 更新默认搜索条件对象结构
- 修改系统标题为关注用户相关名称
- 更新开发和生产环境API基础地址配置
- 修改公共路径配置以适配新的部署需求

.env.development

@@ -2,4 +2,5 @@
 ENV = 'development'
 
 # base api
-VUE_APP_BASE_API = 'http://localhost:7301'
+#VUE_APP_BASE_API = 'http://localhost:7710/wxmessage'
+VUE_APP_BASE_API = 'https://alumni.zdxh.cn/kj/wxmessage'

.env.production

@@ -2,5 +2,5 @@
 ENV = 'production'
 
 # base api
-VUE_APP_BASE_API = '/prod-api'
+VUE_APP_BASE_API = 'https://alumni.zdxh.cn/kj/wxmessage'
 

src/api/demo.js

@@ -1,22 +1,24 @@
 import request from '@/utils/request'
 
+
+let assew = 'assew'
 export function page(data) {
   return request({
-    url: '/demo/page',
+    url: `/${assew}/page`,
     data
   })
 }
 
-export function save(data) {
+export function refreshOpenId(data) {
   return request({
-    url: '/demo/save',
+    url: `/${assew}/refresh/openid`,
     data
   })
 }
 
-export function remove(data) {
+export function initUserList() {
   return request({
-    url: '/demo/remove',
+    url: `/${assew}/init/user-list`,
-    data
   })
 }
+

src/router/index.js

@@ -49,23 +49,23 @@ export const constantRoutes = [
     children: [{
       path: 'dashboard',
       name: 'Dashboard',
-      component: () => import('@/views/dashboard/index'),
+      component: () => import('@/views/demo/index'),
-      meta: { title: '欢迎', icon: 'dashboard' }
+      meta: { title: '关注用户', icon: 'dashboard' }
     }]
   },
 
-  {
+  // {
-    path: '/demo',
+  //   path: '/dfadfa',
-    component: Layout,
+  //   component: Layout,
-    children: [
+  //   children: [
-      {
+  //     {
-        path: 'index',
+  //       path: 'index',
-        name: 'Demo',
+  //       name: 'Dfadfa',
-        component: () => import('@/views/demo/index'),
+  //       component: () => import('@/views/demo/index'),
-        meta: { title: '表格示例', icon: 'table' }
+  //       meta: { title: '关注用户', icon: 'table' }
-      }
+  //     }
-    ]
+  //   ]
-  },
+  // },
 
   // 404 page must be placed at the end !!!
   { path: '*', redirect: '/404', hidden: true }

src/settings.js

@@ -1,6 +1,6 @@
 module.exports = {
 
-  title: 'Vue Demo For Soul2',
+  title: '关注用户 - 千帆公众号',
 
   /**
    * @type {boolean} true | false

src/utils/request.js

@@ -49,7 +49,7 @@ service.interceptors.response.use(
     const res = response.data
 
     // if the custom code is not 0, it is judged as an error.
-    if (res.code !== 0) {
+    if (res.code !== 200) {
       Message({
         message: res.message || 'Error',
         type: 'error',

src/views/demo/index.vue

@@ -6,8 +6,11 @@
                @keyup.enter.native="conditionQuery"
       >
         <!--查询条件-->
-        <el-form-item label="姓名" prop="name">
+        <el-form-item label="openid" prop="openid">
-          <el-input v-model="condition.name" placeholder="请输入" clearable/>
+          <el-input v-model="condition.openid" placeholder="openid" clearable/>
+        </el-form-item>
+        <el-form-item label="unionid" prop="unionid">
+          <el-input v-model="condition.unionid" placeholder="unionid" clearable/>
         </el-form-item>
         <!-- End 查询条件 -->
         <el-form-item>
@@ -21,8 +24,11 @@
 
     <!-- 表格操作 -->
     <el-card class="table-operate-container" shadow="never">
-      <el-button size="mini" icon="el-icon-plus" type="primary" plain @click="addRow">添加</el-button>
+<!--      <el-button size="mini" icon="el-icon-plus" type="primary" plain @click="addRow">添加</el-button>-->
-      <el-button :disabled="!hasSelection" type="danger" size="mini" @click="removeBatchRows">批量删除
+<!--      <el-button :disabled="!hasSelection" type="danger" size="mini" @click="removeBatchRows">批量删除-->
+<!--      </el-button>-->
+      <el-button type="danger" size="mini" @click="initUserList">
+        初始化
       </el-button>
     </el-card>
 
@@ -34,15 +40,16 @@
       >
         <el-table-column type="selection" width="40" align="center"/>
         <el-table-column type="index" label="序号" width="60" align="center"/>
-        <el-table-column property="name" label="姓名" min-width="25%" align="center"/>
+        <el-table-column property="openid" label="openid" min-width="25%" align="center"/>
-        <el-table-column property="attr1" label="属性1" min-width="25%" align="center"/>
+        <el-table-column property="unionid" label="unionid" min-width="25%" align="center"/>
-        <el-table-column property="attr2" label="属性2" min-width="25%" align="center"/>
+        <el-table-column property="subscribe_scene" label="订阅来源" width="120" align="center"/>
-        <el-table-column property="updatedTime" label="更新时间" min-width="25%" align="center"/>
+        <el-table-column property="updated_time" label="更新时间" width="200" align="center"/>
-        <el-table-column property="createdTime" label="创建时间" min-width="25%" align="center"/>
+        <el-table-column property="created_time" label="创建时间" width="200" align="center"/>
-        <el-table-column label="操作" width="180" align="center">
+        <el-table-column label="操作" width="210" align="center">
           <template slot-scope="scope">
-            <el-button size="mini" @click.stop="handleEdit(scope.row)">编辑</el-button>
+<!--            <el-button size="mini" @click.stop="handleEdit(scope.row)">编辑</el-button>-->
-            <el-button type="danger" plain size="mini" @click.stop="handleRemove(scope.row)">删除</el-button>
+            <el-button size="mini" @click.stop="refreshPull(scope.row)">重新拉取</el-button>
+<!--            <el-button type="danger" plain size="mini" @click.stop="handleRemove(scope.row)">删除</el-button>-->
           </template>
         </el-table-column>
       </el-table>
@@ -60,15 +67,15 @@
     </div>
     <!-- End 表格 -->
 
-    <!-- 编辑弹窗 -->
+<!--    &lt;!&ndash; 编辑弹窗 &ndash;&gt;-->
-    <edit-dialog v-if="showDialog" :row="editRowData" :show.sync="showDialog" :is-add="isAddDialog"
+<!--    <edit-dialog v-if="showDialog" :row="editRowData" :show.sync="showDialog" :is-add="isAddDialog"-->
-                 @saved="conditionQuery"
+<!--                 @saved="conditionQuery"-->
-    />
+<!--    />-->
   </div>
 </template>
 
 <script>
-import { page, remove } from '@/api/demo'
+import {initUserList, page, refreshOpenId} from '@/api/demo'
 import editDialog from './edit'
 /**
  * @version 2.0
@@ -76,7 +83,8 @@ import editDialog from './edit'
 
 /* Base */
 const default_condition = {
-  name: '',
+  openid: '',
+  unionid: '',
   pageNumber: 1,
   pageSize: 10
 }
@@ -122,6 +130,66 @@ export default {
     this.conditionQuery()
   },
   methods: {
+    initUserList() {
+      let title = '初始化关注列表?该操作会从公众号读取关注用户覆盖当前数据库'
+      this.$confirm(title, '提示', {
+        type: 'warning'
+      }).then(() => {
+        const loading = this.$loading({
+          background: this.$elementGlobal.loadingBackground
+        })
+        initUserList().then(r => {
+          loading.close()
+          if (r.data) {
+            this.$message({
+              type: 'success',
+              message: '操作成功!'
+            })
+          } else {
+            this.$message({
+              type: 'error',
+              message: '操作失败!'
+            })
+          }
+          this.conditionQuery()
+        }).catch(e => {
+          loading.close()
+          console.log(e)
+        })
+      }).catch(() => {
+
+      })
+    },
+    refreshPull(row) {
+      let title = '重新拉取该用户的数据?该操作会从公众号读取关注用户覆盖当前数据'
+      this.$confirm(title, '提示', {
+        type: 'warning'
+      }).then(() => {
+        const loading = this.$loading({
+          background: this.$elementGlobal.loadingBackground
+        })
+        refreshOpenId(row.openid).then(r => {
+          loading.close()
+          if (r.data) {
+            this.$message({
+              type: 'success',
+              message: '操作成功!'
+            })
+          } else {
+            this.$message({
+              type: 'error',
+              message: '操作失败!'
+            })
+          }
+          this.conditionQuery()
+        }).catch(e => {
+          loading.close()
+          console.log(e)
+        })
+      }).catch(() => {
+
+      })
+    },
     /* Base */
     addRow() {
       // 表格操作 - 添加

vue.config.js

@@ -24,7 +24,7 @@ module.exports = {
    * In most cases please use '/' !!!
    * Detail: https://cli.vuejs.org/config/#publicpath
    */
-  publicPath: '/',
+  publicPath: '/GaEbgkre9BcJfxTig6bYJBdHw2MJk9W3aGvHQCxGXpXUPBuXD8YC2m8uPTjj4bLa1BsjihAn3AA5UYF4cBE3sj4GKuXdM9muB7Ds/wxmsge/',
   outputDir: 'dist',
   assetsDir: 'static',
   lintOnSave: process.env.NODE_ENV === 'development',