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

- 修改API接口路径配置，将硬编码路径替换为动态变量 - 重命名API方法save为refreshOpenId，remove为initUserList，更新对应URL - 将仪表板页面组件替换为关注用户组件，更新路由配置 - 更新请求拦截器中的状态码判断逻辑 - 修改搜索表单字段从姓名改为openid和unionid - 重写表格列定义，显示openid、unionid、订阅来源等字段 - 替换表格操作按钮，移除添加和删除功能，添加初始化功能 - 新增初始化关注列表和重新拉取用户数据的方法 - 更新默认搜索条件对象结构 - 修改系统标题为关注用户相关名称 - 更新开发和生产环境API基础地址配置 - 修改公共路径配置以适配新的部署需求
4 days ago · 89eaec3795
parent eafc266aeb
commit 89eaec3795
9 changed files with 114 additions and 43 deletions
--- a/.env.development
+++ b/.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'
--- a/.env.production
+++ b/.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'

--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/src/api/demo.js
+++ b/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',
-    data
+    url: `/${assew}/init/user-list`,
  })
 }
+
--- a/src/router/index.js
+++ b/src/router/index.js
@ -49,23 +49,23 @@ export const constantRoutes = [
    children: [{
      path: 'dashboard',
      name: 'Dashboard',
-      component: () => import('@/views/dashboard/index'),
-      meta: { title: '欢迎', icon: 'dashboard' }
+      component: () => import('@/views/demo/index'),
+      meta: { title: '关注用户', icon: 'dashboard' }
    }]
  },

-  {
-    path: '/demo',
-    component: Layout,
-    children: [
-      {
-        path: 'index',
-        name: 'Demo',
-        component: () => import('@/views/demo/index'),
-        meta: { title: '表格示例', icon: 'table' }
-      }
-    ]
-  },
+  // {
+  //   path: '/dfadfa',
+  //   component: Layout,
+  //   children: [
+  //     {
+  //       path: 'index',
+  //       name: 'Dfadfa',
+  //       component: () => import('@/views/demo/index'),
+  //       meta: { title: '关注用户', icon: 'table' }
+  //     }
+  //   ]
+  // },

  // 404 page must be placed at the end !!!
  { path: '*', redirect: '/404', hidden: true }
--- a/src/settings.js
+++ b/src/settings.js
@ -1,6 +1,6 @@
 module.exports = {

-  title: 'Vue Demo For Soul2',
+  title: '关注用户 - 千帆公众号',

  /**
   * @type {boolean} true | false
--- a/src/utils/request.js
+++ b/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',
--- a/src/views/demo/index.vue
+++ b/src/views/demo/index.vue
@ -6,8 +6,11 @@
               @keyup.enter.native="conditionQuery"
      >
        <!--查询条件-->
-        <el-form-item label="姓名" prop="name">
-          <el-input v-model="condition.name" placeholder="请输入" clearable/>
+        <el-form-item label="openid" prop="openid">
+          <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 :disabled="!hasSelection" type="danger" size="mini" @click="removeBatchRows">批量删除
+<!--      <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>-->
+      <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="attr1" label="属性1" min-width="25%" align="center"/>
-        <el-table-column property="attr2" label="属性2" min-width="25%" align="center"/>
-        <el-table-column property="updatedTime" label="更新时间" min-width="25%" align="center"/>
-        <el-table-column property="createdTime" label="创建时间" min-width="25%" align="center"/>
-        <el-table-column label="操作" width="180" align="center">
+        <el-table-column property="openid" label="openid" min-width="25%" align="center"/>
+        <el-table-column property="unionid" label="unionid" min-width="25%" align="center"/>
+        <el-table-column property="subscribe_scene" label="订阅来源" width="120" align="center"/>
+        <el-table-column property="updated_time" label="更新时间" width="200" align="center"/>
+        <el-table-column property="created_time" label="创建时间" width="200" 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 type="danger" plain size="mini" @click.stop="handleRemove(scope.row)">删除</el-button>
+<!--            <el-button size="mini" @click.stop="handleEdit(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 表格 -->

-    <!-- 编辑弹窗 -->
-    <edit-dialog v-if="showDialog" :row="editRowData" :show.sync="showDialog" :is-add="isAddDialog"
-                 @saved="conditionQuery"
-    />
+<!--    &lt;!&ndash; 编辑弹窗 &ndash;&gt;-->
+<!--    <edit-dialog v-if="showDialog" :row="editRowData" :show.sync="showDialog" :is-add="isAddDialog"-->
+<!--                 @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() {
      // 表格操作 - 添加
--- a/vue.config.js
+++ b/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',