调用用户接口

src/api/memberList.js

@@ -0,0 +1,33 @@
+import request from '@/utils/request'
+// 获取用户列表
+export function getMember(params) {
+  return request({
+    url: '/cms/member',
+    method: 'get',
+    params
+  })
+}
+// 获取用户订单
+export function getMemberOrder(params) {
+  return request({
+    url: '/cms/member/getMemberOrder',
+    method: 'get',
+    params
+  })
+}
+// 获取用户权限
+export function getMemberAuth(params) {
+  return request({
+    url: '/cms/member/getMemberAuth',
+    method: 'get',
+    params
+  })
+}
+// 修改用户权限
+export function setMemberAuth(data) {
+  return request({
+    url: '/cms/member/insertMemberAuth',
+    method: 'post',
+    data
+  })
+}

src/router/index.js

@@ -127,6 +127,41 @@ export const constantRoutes = [
       meta: { title: '专区列表', icon: 'dashboard' }
     }]
   },
+  {
+    path: '/memberList',
+    component: Layout,
+    redirect: '/memberList',
+    children: [{
+      path: 'memberList',
+      name: 'MemberList',
+      component: () => import('@/views/memberList/index'),
+      meta: { title: '用户列表', icon: 'dashboard' }
+    }]
+  },
+  {
+    path: '/memberOrder',
+    component: Layout,
+    redirect: '/memberOrder',
+    children: [{
+      path: 'memberOrder',
+      name: 'MemberOrder',
+      component: () => import('@/views/memberOrder/index'),
+      meta: { title: '用户订单' }
+    }],
+    hidden: true
+  },
+  {
+    path: '/memberAuth',
+    component: Layout,
+    redirect: '/memberAuth',
+    children: [{
+      path: 'memberAuth',
+      name: 'MemberAuth',
+      component: () => import('@/views/memberAuth/index'),
+      meta: { title: '用户权限' }
+    }],
+    hidden: true
+  },
   // 404 page must be placed at the end !!!
   { path: '*', redirect: '/404', hidden: true }
 ]

src/store/getters.js

@@ -19,6 +19,10 @@ const getters = {
   getTempateData: state => state.dashboard.getTempateData,
   getTempateDataLength: state => state.dashboard.getTempateDataLength,
   getCategoryData: state => state.categoryList.getCategoryData,
-  getCategoryDataLength: state => state.categoryList.getCategoryDataLength
+  getCategoryDataLength: state => state.categoryList.getCategoryDataLength,
+  getMemberData: state => state.memberList.getMemberData,
+  getMemberOrderData: state => state.memberList.getMemberOrderData,
+  getMemberOrderDataLength: state => state.memberList.getMemberOrderDataLength,
+  getMemberAuthData: state => state.memberList.getMemberAuthData
 }
 export default getters

src/store/index.js

@@ -9,6 +9,7 @@ import permission from './modules/permission'
 import schoolTimetable from './modules/schoolTimetable'
 import dashboard from './modules/dashboard'
 import categoryList from './modules/categoryList'
+import memberList from './modules/memberList'
 Vue.use(Vuex)
 
 const store = new Vuex.Store({
@@ -20,7 +21,8 @@ const store = new Vuex.Store({
     permission,
     schoolTimetable,
     dashboard,
-    categoryList
+    categoryList,
+    memberList
   },
   getters
 })

src/store/modules/memberList.js

@@ -0,0 +1,99 @@
+import { getMember, getMemberOrder, getMemberAuth, setMemberAuth } from '@/api/memberList'
+
+const state = {
+  getMemberData: [],
+  getMemberOrderData: [],
+  getMemberOrderDataLength: 0,
+  getMemberAuthData: []
+}
+
+const mutations = {
+  GET_MEMBER: (state, data) => {
+    state.getMemberData = data
+  },
+  GET_MEMBER_ORDER: (state, data) => {
+    state.getMemberOrderData = data
+  },
+  MEMBER_ORDER_LENGTH: (state, length) => {
+    state.getMemberOrderDataLength = length
+  },
+  GET_MEMBER_AUTH: (state, data) => {
+    state.getMemberAuthData = data
+  }
+}
+
+const actions = {
+  // 获取课程表列表
+  getMemberList({ commit, state }, obj) {
+    console.log(obj.page)
+    const pageNum = obj.page ? obj.page : 1
+    const { eid, mobileNo, nickName } = obj
+    return new Promise((resolve, reject) => {
+      getMember({
+        eid,
+        mobileNo,
+        nickName,
+        pageNum,
+        pageSize: 10
+      }).then((res) => {
+        const data = res.data
+        commit('GET_MEMBER', data)
+        resolve()
+      }).catch(error => {
+        reject(error)
+      })
+    })
+  },
+  getMemberOrderList({ commit, state }, obj) {
+    const pageNum = obj.page ? (obj.page - 1) * 10 : 1
+    const { uid, productName, productVersion } = obj
+    return new Promise((resolve, reject) => {
+      getMemberOrder({
+        uid,
+        productName,
+        productVersion
+      }).then((res) => {
+        const data = res.data
+        commit('MEMBER_ORDER_LENGTH', data.length)
+        commit('GET_MEMBER_ORDER', data.splice(pageNum, 10))
+        resolve()
+      }).catch(error => {
+        reject(error)
+      })
+    })
+  },
+  getMemberAuthList({ commit, state }, obj) {
+    console.log(obj.page)
+    // const pageNum = obj.page ? obj.page : 1
+    const { uid, productName } = obj
+    return new Promise((resolve, reject) => {
+      getMemberAuth({
+        uid,
+        productName
+      }).then((res) => {
+        const data = res.data
+        commit('GET_MEMBER_AUTH', data)
+        resolve()
+      }).catch(error => {
+        reject(error)
+      })
+    })
+  },
+  setMemberAuthList({ commit, state }, obj) {
+    return new Promise((resolve, reject) => {
+      setMemberAuth(obj).then((res) => {
+        resolve()
+      }).catch(error => {
+        reject(error)
+      })
+    })
+  }
+}
+
+export default {
+  namespaced: true,
+  state,
+  mutations,
+  actions
+}
+

src/views/categoryList/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="dashboard-container">
     <div class="dashboard-text">
-      <el-button type="primary" @click="addList">增加行列表</el-button>
+      <el-button type="primary" @click="addList">增加专区列表</el-button>
       <el-table
         :data="getCategoryData"
         style="width: 100%"
@@ -74,9 +74,9 @@
           </template>
         </el-table-column>
       </el-table>
-      <el-dialog title="专区" :rules="rules" :visible.sync="dialogFormVisible">
-        <el-form :model="form">
-          <el-form-item label="专区类型" :label-width="formLabelWidth">
+      <el-dialog title="专区" :visible.sync="dialogFormVisible">
+        <el-form ref="ruleForm" :model="form" :rules="rules">
+          <el-form-item label="专区类型" :label-width="formLabelWidth" prop="code">
             <el-select v-model="form.code" placeholder="请选择">
               <el-option value="PAY" label="知识付费" />
               <el-option value="PRESCHOOL" label="学前" />
@@ -84,19 +84,19 @@
               <el-option value="MIDDLE" label="中学" />
             </el-select>
           </el-form-item>
-          <el-form-item label="标题" :label-width="formLabelWidth">
+          <el-form-item label="标题" :label-width="formLabelWidth" prop="title">
             <el-input v-model="form.title" autocomplete="off" clearable />
           </el-form-item>
-          <el-form-item label="专题类型" :label-width="formLabelWidth">
+          <el-form-item label="专题类型" :label-width="formLabelWidth" prop="courseType">
             <el-select v-model="form.courseType" placeholder="请选择">
               <el-option value="KNOWLEDGE" label="知识付费" />
               <el-option value="LIBRARY" label="图书馆" />
             </el-select>
           </el-form-item>
-          <el-form-item label="排序" :label-width="formLabelWidth">
+          <el-form-item label="排序" :label-width="formLabelWidth" prop="sort">
             <el-input v-model="form.sort" autocomplete="off" clearable />
           </el-form-item>
-          <el-form-item v-if="type === 'add'" label="状态" :label-width="formLabelWidth">
+          <el-form-item v-if="type === 'add'" label="状态" :label-width="formLabelWidth" prop="status">
             <el-select v-model="form.status" placeholder="请选择">
               <el-option value="ABNORMAL" label="不正常" />
               <el-option value="NORMAL" label="正常" />
@@ -105,7 +105,7 @@
         </el-form>
         <div slot="footer" class="dialog-footer">
           <el-button @click="dialogFormVisible = false">取 消</el-button>
-          <el-button type="primary" @click="handOk">确 定</el-button>
+          <el-button type="primary" @click="handOk('ruleForm')">确 定</el-button>
         </div>
       </el-dialog>
       <el-pagination
@@ -130,8 +130,14 @@ export default {
       formLabelWidth: '120px',
       type: '',
       rules: {
-        templateCode: [
-          { required: true, message: '请选择模板', trigger: 'change' }
+        code: [
+          { required: true, message: '请选择专区类型', trigger: 'change' }
+        ],
+        title: [
+          { required: true, message: '请输入排序', trigger: 'blur' }
+        ],
+        courseType: [
+          { required: true, message: '请选择专题', trigger: 'change' }
         ],
         status: [
           { required: true, message: '请选择状态', trigger: 'change' }
@@ -204,25 +210,32 @@ export default {
         })
       })
     },
-    handOk() {
-      if (this.type === 'set') {
-        console.log(this.form)
-        this.$store.dispatch('categoryList/setBlockList', this.form).then(() => {
-          this.dialogFormVisible = false
-          this.$store.dispatch('categoryList/getBlockList', {
-            blockType: '',
-            page: this.page
-          })
-        })
-      } else if (this.form.code !== '' && this.form.title !== '' && this.form.status !== '' && this.form.courseType !== '' && this.form.sort !== '') {
-        this.$store.dispatch('categoryList/addBlockList', this.form).then(() => {
-          this.dialogFormVisible = false
-          this.$store.dispatch('categoryList/getBlockList', {
-            blockType: '',
-            page: this.page
-          })
-        })
-      }
+    handOk(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          if (this.type === 'set') {
+            console.log(this.form)
+            this.$store.dispatch('categoryList/setBlockList', this.form).then(() => {
+              this.dialogFormVisible = false
+              this.$store.dispatch('categoryList/getBlockList', {
+                blockType: '',
+                page: this.page
+              })
+            })
+          } else {
+            this.$store.dispatch('categoryList/addBlockList', this.form).then(() => {
+              this.dialogFormVisible = false
+              this.$store.dispatch('categoryList/getBlockList', {
+                blockType: '',
+                page: this.page
+              })
+            })
+          }
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
     },
     addList() {
       this.dialogFormVisible = true

src/views/dashboardBlockRow/index.vue

@@ -73,9 +73,9 @@
           </template>
         </el-table-column>
       </el-table>
-      <el-dialog title="首页行列表" :rules="rules" :visible.sync="dialogFormVisible">
-        <el-form :model="form">
-          <el-form-item label="模板" :label-width="formLabelWidth">
+      <el-dialog title="首页行列表" :visible.sync="dialogFormVisible">
+        <el-form ref="ruleForm" :model="form" :rules="rules">
+          <el-form-item label="模板" :label-width="formLabelWidth" prop="templateCode">
             <el-select v-model="form.templateCode" placeholder="请选择">
               <el-option value="IMAGE_TEMPATE_5" label="689*174图片模板" />
               <el-option value="TEXT_TEMPLATE" label="文字模板" />
@@ -88,10 +88,10 @@
               <el-option value="SCHEDULE_TEMPATE_3" label="326*174课程表模板" />
             </el-select>
           </el-form-item>
-          <el-form-item label="排序" :label-width="formLabelWidth">
+          <el-form-item label="排序" :label-width="formLabelWidth" prop="sort">
             <el-input v-model="form.sort" autocomplete="off" clearable />
           </el-form-item>
-          <el-form-item v-if="type === 'add'" label="状态" :label-width="formLabelWidth">
+          <el-form-item v-if="type === 'add'" label="状态" :label-width="formLabelWidth" prop="status">
             <el-select v-model="form.status" placeholder="请选择">
               <el-option value="NOT_ON_STOCK" label="下架" />
               <el-option value="HAS_ON_STOCK" label="上架" />
@@ -100,7 +100,7 @@
         </el-form>
         <div slot="footer" class="dialog-footer">
           <el-button @click="dialogFormVisible = false">取 消</el-button>
-          <el-button type="primary" @click="handOk">确 定</el-button>
+          <el-button type="primary" @click="handOk('ruleForm')">确 定</el-button>
         </div>
       </el-dialog>
       <el-pagination
@@ -240,25 +240,32 @@ export default {
         }
       })
     },
-    handOk() {
-      if (this.type === 'set') {
-        console.log(this.form)
-        this.$store.dispatch('dashboard/setBlockRowList', this.form).then(() => {
-          this.dialogFormVisible = false
-          this.$store.dispatch('dashboard/getBlockRowList', {
-            id: this.$route.query.id,
-            page: this.page
-          })
-        })
-      } else if (this.form.templateCode !== '' && this.form.status !== '' && this.form.sort !== '') {
-        this.$store.dispatch('dashboard/addBlockRowList', this.form).then(() => {
-          this.dialogFormVisible = false
-          this.$store.dispatch('dashboard/getBlockRowList', {
-            id: this.$route.query.id,
-            page: this.page
-          })
-        })
-      }
+    handOk(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          if (this.type === 'set') {
+            console.log(this.form)
+            this.$store.dispatch('dashboard/setBlockRowList', this.form).then(() => {
+              this.dialogFormVisible = false
+              this.$store.dispatch('dashboard/getBlockRowList', {
+                id: this.$route.query.id,
+                page: this.page
+              })
+            })
+          } else {
+            this.$store.dispatch('dashboard/addBlockRowList', this.form).then(() => {
+              this.dialogFormVisible = false
+              this.$store.dispatch('dashboard/getBlockRowList', {
+                id: this.$route.query.id,
+                page: this.page
+              })
+            })
+          }
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
     },
     addList() {
       this.dialogFormVisible = true

src/views/dashboardRowItem/index.vue

@@ -75,14 +75,14 @@
         </el-table-column>
       </el-table>
       <el-dialog title="首页项列表" :visible.sync="dialogFormVisible">
-        <el-form :model="form">
-          <el-form-item label="项目名称" :label-width="formLabelWidth">
+        <el-form ref="ruleForm" :model="form" :rules="rules">
+          <el-form-item label="项目名称" :label-width="formLabelWidth" prop="content">
             <el-input v-model="form.content" autocomplete="off" clearable />
           </el-form-item>
-          <el-form-item v-if="type === 'add'" label="icon" :label-width="formLabelWidth">
+          <el-form-item v-if="type === 'add'" label="icon" :label-width="formLabelWidth" prop="icon">
             <el-input v-model="form.icon" autocomplete="off" clearable />
           </el-form-item>
-          <el-form-item v-if="type === 'add'" label="模板" :label-width="formLabelWidth">
+          <el-form-item v-if="type === 'add'" label="模板" :label-width="formLabelWidth" prop="targetType">
             <el-select v-model="form.targetType" placeholder="请选择">
               <el-option value="LIBRARY" label="图书馆课程" />
               <el-option value="PAY" label="知识付费" />
@@ -91,13 +91,13 @@
               <el-option value="URL" label="URL" />
             </el-select>
           </el-form-item>
-          <el-form-item label="排序" :label-width="formLabelWidth">
+          <el-form-item label="排序" :label-width="formLabelWidth" prop="sort">
             <el-input v-model="form.sort" autocomplete="off" clearable />
           </el-form-item>
-          <el-form-item v-if="type === 'add'" label="Code" :label-width="formLabelWidth">
+          <el-form-item v-if="type === 'add'" label="Code" :label-width="formLabelWidth" prop="targetContent">
             <el-input v-model="form.targetContent" autocomplete="off" clearable />
           </el-form-item>
-          <el-form-item v-if="type === 'add'" label="状态" :label-width="formLabelWidth">
+          <el-form-item v-if="type === 'add'" label="状态" :label-width="formLabelWidth" prop="status">
             <el-select v-model="form.status" placeholder="请选择">
               <el-option value="NOT_ON_STOCK" label="下架" />
               <el-option value="HAS_ON_STOCK" label="上架" />
@@ -106,7 +106,7 @@
         </el-form>
         <div slot="footer" class="dialog-footer">
           <el-button @click="dialogFormVisible = false">取 消</el-button>
-          <el-button type="primary" @click="handOk">确 定</el-button>
+          <el-button type="primary" @click="handOk('ruleForm')">确 定</el-button>
         </div>
       </el-dialog>
       <el-pagination
@@ -130,7 +130,21 @@ export default {
       dialogFormVisible: false,
       type: '',
       formLabelWidth: '120px',
-      page: 1
+      page: 1,
+      rules: {
+        content: [
+          { required: true, message: '请输入项目名称', trigger: 'blur' }
+        ],
+        icon: [
+          { required: true, message: '请输入icon', trigger: 'blur' }
+        ],
+        targetType: [{ required: true, message: '请选择模板', trigger: 'change' }],
+        sort: [
+          { required: true, message: '请输入排序', trigger: 'blur' }
+        ],
+        targetContent: [{ required: true, message: '请输入项目Code', trigger: 'blur' }],
+        status: [{ required: true, message: '请选择状态', trigger: 'change' }]
+      }
     }
   },
   created() {
@@ -261,23 +275,30 @@ export default {
         })
       })
     },
-    handOk() {
-      if (this.type === 'set') {
-        console.log(this.form)
-        this.$store.dispatch('dashboard/setRowItemList', this.form).then(() => {
-          this.dialogFormVisible = false
-          this.$store.dispatch('dashboard/getRowItemList', {
-            id: this.$route.query.id
-          })
-        })
-      } else if (this.form.content !== '' && this.form.icon !== '' && this.form.targetType !== '' && this.form.sort !== '' && this.form.status !== '' && this.form.targetContent !== '') {
-        this.$store.dispatch('dashboard/addRowItemList', this.form).then(() => {
-          this.dialogFormVisible = false
-          this.$store.dispatch('dashboard/getRowItemList', {
-            id: this.$route.query.id
-          })
-        })
-      }
+    handOk(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          if (this.type === 'set') {
+            console.log(this.form)
+            this.$store.dispatch('dashboard/setRowItemList', this.form).then(() => {
+              this.dialogFormVisible = false
+              this.$store.dispatch('dashboard/getRowItemList', {
+                id: this.$route.query.id
+              })
+            })
+          } else {
+            this.$store.dispatch('dashboard/addRowItemList', this.form).then(() => {
+              this.dialogFormVisible = false
+              this.$store.dispatch('dashboard/getRowItemList', {
+                id: this.$route.query.id
+              })
+            })
+          }
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
     },
     handleCurrentChange(val) {
       console.log(val)

src/views/memberAuth/index.vue

@@ -0,0 +1,189 @@
+/* eslint-disable no-duplicate-case */
+<template>
+  <div class="school-container">
+    <div class="school">
+      <el-form :inline="true" :model="formInline" class="demo-form-inline">
+        <el-form-item label="产品名称">
+          <el-input v-model="formInline.productName" placeholder="产品名称" clearable />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit('ruleForm')">查询</el-button>
+        </el-form-item>
+      </el-form>
+      <el-table
+        :data="getMemberAuthData"
+        style="width: 100%"
+      >
+        <el-table-column
+          label="用户id"
+          width="280"
+          prop="uid"
+        />
+        <el-table-column
+          label="产品名称"
+          width="280"
+          prop="productName"
+        />
+        <el-table-column
+          label="开始时间"
+          width="200"
+        >
+          <template slot-scope="scope">
+            <i class="el-icon-time" />
+            <span style="margin-left: 10px">{{ newDate(scope.row.startTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="结束时间"
+          width="200"
+        >
+          <template slot-scope="scope">
+            <i class="el-icon-time" />
+            <span style="margin-left: 10px">{{ newDate(scope.row.endTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="创建时间"
+          width="200"
+        >
+          <template slot-scope="scope">
+            <i class="el-icon-time" />
+            <span style="margin-left: 10px">{{ newDate(scope.row.createTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="修改时间"
+          width="200"
+        >
+          <template slot-scope="scope">
+            <i class="el-icon-time" />
+            <span style="margin-left: 10px">{{ newDate(scope.row.updateTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              @click="handleEdit(scope.$index, scope.row)"
+            >修改</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-dialog title="增加天数" :visible.sync="dialogFormVisible">
+        <el-form ref="ruleForm" :model="form" :rules="rules">
+          <el-form-item label="产品名称" :label-width="formLabelWidth" prop="title">
+            <el-input v-model="form.title" autocomplete="off" clearable />
+          </el-form-item>
+          <el-form-item label="增加天数" :label-width="formLabelWidth" prop="addDays">
+            <el-input v-model="form.addDays" autocomplete="off" clearable />
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button @click="dialogFormVisible = false">取 消</el-button>
+          <el-button type="primary" @click="handOk('ruleForm')">确 定</el-button>
+        </div>
+      </el-dialog>
+      <!--
+      <el-pagination
+        v-if="getMemberOrderData.length > 0"
+        background
+        layout="prev, pager, next"
+        :total="getMemberData.totalSize"
+        @current-change="handleCurrentChange"
+      />
+      -->
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+
+export default {
+  data() {
+    return {
+      formInline: {
+        uid: '',
+        productName: ''
+      },
+      page: 1,
+      formLabelWidth: '120px',
+      form: {
+        uid: '',
+        title: '',
+        addDays: ''
+      },
+      rules: {
+        title: [{ required: true, message: '请输入产品', trigger: 'blur' }],
+        addDays: [{ required: true, message: '请输入增加天数', trigger: 'blur' }]
+      },
+      dialogFormVisible: false
+    }
+  },
+  created() {
+    this.$store.dispatch('memberList/getMemberAuthList', {
+      uid: this.$route.query.uid,
+      productName: ''
+    })
+  },
+  // eslint-disable-next-line vue/order-in-components
+  computed: {
+    ...mapGetters([
+      'getMemberAuthData'
+    ])
+  },
+  methods: {
+    newDate(date) {
+      return new Date(date * 1).toLocaleString()
+    },
+    onSubmit(formName) {
+      this.formInline.uid = this.$route.query.uid
+      this.$store.dispatch('memberList/getMemberAuthList', this.formInline)
+    },
+    handleEdit(index, row) {
+      console.log(index, row)
+      this.dialogFormVisible = true
+      this.form.uid = row.uid
+    },
+    handOk(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          this.$store.dispatch('memberList/setMemberAuthList', this.form).then(() => {
+            this.dialogFormVisible = false
+            this.$store.dispatch('memberList/getMemberAuthList', {
+              uid: this.$route.query.uid,
+              productName: ''
+            })
+          })
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    handleCurrentChange(val) {
+      console.log(val)
+      this.page = val
+      this.$store.dispatch('schoolTimetable/getScheduleList', {
+        page: this.page
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.school {
+  margin-top: 20px;
+}
+.el-input {
+  width: 300px;
+}
+.el-select>.el-input {
+  width: 300px;
+}
+.el-pagination {
+  text-align: center;
+  margin-top: 20px;
+}
+</style>

src/views/memberList/index.vue

@@ -0,0 +1,174 @@
+/* eslint-disable no-duplicate-case */
+<template>
+  <div class="school-container">
+    <div class="school">
+      <el-form :inline="true" :model="formInline" class="demo-form-inline">
+        <el-form-item label="学号">
+          <el-input v-model="formInline.eid" placeholder="学号" clearable />
+        </el-form-item>
+        <el-form-item label="手机号">
+          <el-input v-model="formInline.mobileNo" placeholder="手机号" clearable />
+        </el-form-item>
+        <el-form-item label="昵称">
+          <el-input v-model="formInline.nickName" placeholder="昵称" clearable />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit">查询</el-button>
+        </el-form-item>
+      </el-form>
+      <el-table
+        :data="getMemberData.list"
+        style="width: 100%"
+      >
+        <el-table-column
+          label="用户id"
+          width="180"
+          prop="uid"
+        />
+        <el-table-column
+          label="学号"
+          width="180"
+          prop="eid"
+        />
+        <el-table-column
+          label="手机号"
+          width="180"
+          prop="mobileNo"
+        />
+        <el-table-column
+          label="昵称"
+          width="180"
+          prop="nickName"
+        />
+        <el-table-column
+          label="性别"
+          width="60"
+        >
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.gender === 1 ? '男' : '女' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="头像"
+          width="120"
+        >
+          <template slot-scope="scope">
+            <img :src="scope.row.avatar">
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="创建时间"
+          width="200"
+        >
+          <template slot-scope="scope">
+            <i class="el-icon-time" />
+            <span style="margin-left: 10px">{{ newDate(scope.row.gmtCreated) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="修改时间"
+          width="200"
+        >
+          <template slot-scope="scope">
+            <i class="el-icon-time" />
+            <span style="margin-left: 10px">{{ newDate(scope.row.gmtModified) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              @click="handleOrder(scope.$index, scope.row)"
+            >订购</el-button>
+            <el-button
+              size="mini"
+              @click="handleAuth(scope.$index, scope.row)"
+            >权限</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        background
+        layout="prev, pager, next"
+        :total="getMemberData.totalSize"
+        @current-change="handleCurrentChange"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+
+export default {
+  data() {
+    return {
+      formInline: {
+        eid: '',
+        mobileNo: '',
+        nickName: ''
+      },
+      page: 1
+    }
+  },
+  created() {
+    this.$store.dispatch('memberList/getMemberList', {
+      page: this.page
+    })
+  },
+  // eslint-disable-next-line vue/order-in-components
+  computed: {
+    ...mapGetters([
+      'getMemberData'
+    ])
+  },
+  methods: {
+    newDate(date) {
+      return new Date(date).toLocaleString()
+    },
+    onSubmit() {
+      this.$store.dispatch('memberList/getMemberList', this.formInline)
+    },
+    handleOrder(index, row) {
+      this.$router.push({
+        path: '/memberOrder/memberOrder',
+        query: {
+          uid: row.uid
+        }
+      })
+    },
+    handleAuth(index, row) {
+      console.log(index, row)
+      this.$router.push({
+        path: '/memberAuth/memberAuth',
+        query: {
+          uid: row.uid
+        }
+      })
+    },
+    handleCurrentChange(val) {
+      console.log(val)
+      this.page = val
+      this.$store.dispatch('memberList/getMemberList', {
+        page: this.page
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.school {
+  margin-top: 20px;
+}
+.el-input {
+  width: 300px;
+}
+.el-select>.el-input {
+  width: 300px;
+}
+.el-pagination {
+  text-align: center;
+  margin-top: 20px;
+}
+</style>

src/views/memberOrder/index.vue

@@ -0,0 +1,170 @@
+/* eslint-disable no-duplicate-case */
+<template>
+  <div class="school-container">
+    <div class="school">
+      <el-form ref="ruleForm" :inline="true" :model="formInline" :rules="rules" class="demo-form-inline">
+        <el-form-item label="产品名称">
+          <el-input v-model="formInline.productName" placeholder="产品名称" clearable />
+        </el-form-item>
+        <el-form-item label="产品版本" prop="productVersion">
+          <el-select v-model="formInline.productVersion" placeholder="产品版本">
+            <el-option label="快乐学堂7.0" value="OLD" />
+            <el-option label="快乐学堂8.0" value="NEW" />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit('ruleForm')">查询</el-button>
+        </el-form-item>
+      </el-form>
+      <el-table
+        :data="getMemberOrderData"
+        style="width: 100%"
+      >
+        <el-table-column
+          label="用户id"
+          width="280"
+          prop="uid"
+        />
+        <el-table-column
+          label="产品名称"
+          width="280"
+          prop="productName"
+        />
+        <el-table-column
+          label="产品价格"
+          width="100"
+        >
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.price / 100 }}元</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="增加天数"
+          width="80"
+          prop="addDays"
+        />
+        <el-table-column
+          label="支付状态"
+          width="100"
+        >
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.orderStatus === 'CANCEL' ? '撤销' : (scope.row.orderStatus === 'UNPAID' ? '未支付' : '已支付') }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="版本号"
+          width="80"
+          prop="version"
+        />
+        <el-table-column
+          label="创建时间"
+        >
+          <template slot-scope="scope">
+            <i class="el-icon-time" />
+            <span style="margin-left: 10px">{{ newDate(scope.row.createTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="修改时间"
+        >
+          <template slot-scope="scope">
+            <i class="el-icon-time" />
+            <span style="margin-left: 10px">{{ newDate(scope.row.updateTime) }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        background
+        layout="prev, pager, next"
+        :total="getMemberOrderDataLength"
+        @current-change="handleCurrentChange"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+
+export default {
+  data() {
+    return {
+      formInline: {
+        uid: '',
+        productName: '',
+        productVersion: '',
+        page: 1
+      },
+      rules: {
+        productVersion: [
+          { required: true, message: '请选择产品', trigger: 'change' }
+        ]
+      }
+    }
+  },
+  created() {
+  },
+  destroyed() {
+    this.$store.commit('memberList/GET_MEMBER_ORDER', [])
+    this.$store.commit('memberList/MEMBER_ORDER_LENGTH', 0)
+  },
+  // eslint-disable-next-line vue/order-in-components
+  computed: {
+    ...mapGetters([
+      'getMemberOrderData',
+      'getMemberOrderDataLength'
+    ])
+  },
+  methods: {
+    newDate(date) {
+      return new Date(date * 1).toLocaleString()
+    },
+    onSubmit(formName) {
+      this.formInline.uid = this.$route.query.uid
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          console.log(this.formInline)
+          this.$store.dispatch('memberList/getMemberOrderList', this.formInline)
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    handleEdit(index, row) {
+      console.log(index, row)
+    },
+    handleDetail(index, row) {
+      console.log(index, row)
+      this.$router.push({
+        path: '/schoolDetail/schoolDetail',
+        query: {
+          id: row.id
+        }
+      })
+    },
+    handleCurrentChange(val) {
+      console.log(val)
+      this.formInline.page = val
+      console.log(this.formInline)
+      this.$store.dispatch('memberList/getMemberOrderList', this.formInline)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.school {
+  margin-top: 20px;
+}
+.el-input {
+  width: 300px;
+}
+.el-select>.el-input {
+  width: 300px;
+}
+.el-pagination {
+  text-align: center;
+  margin-top: 20px;
+}
+</style>