user-list

admin/src/App.vue

@@ -33,6 +33,7 @@
             <el-menu-item-group>
               <el-menu-item index="/swiper"><i class="el-icon-picture" />轮播图配置</el-menu-item>
               <el-menu-item index="/agent-allow"><i class="el-icon-picture" />允许客户端</el-menu-item>
+              <el-menu-item index="/user"><i class="el-icon-user" />用户</el-menu-item>
               <el-menu-item index="/hot"><i class="el-icon-star-on" />热销商品配置</el-menu-item>
               <el-menu-item index="/new"><i class="el-icon-sell" />新品上线配置</el-menu-item>
               <el-menu-item index="/recommend"><i class="el-icon-thumb" />为你推荐配置</el-menu-item>

admin/src/router/index.js

@@ -92,13 +92,25 @@ const router = createRouter({
       {
           path: '/agent-allow',
           name: 'agent-allow',
-          component: () => import(/* webpackChunkName: "account" */ '../views/AgentAllow/index.vue'),
+          component: () => import(/* webpackChunkName: "account" */ '../views/agent-allow/index.vue'),
       },
       {
           path: '/agent-allow-form',
           name: 'agent-allow-form',
-          component: () => import(/* webpackChunkName: "account" */ '../views/AgentAllow/form.vue'),
+          component: () => import(/* webpackChunkName: "account" */ '../views/agent-allow/form.vue'),
+      },
+      {
+          path: '/user',
+          name: 'user',
+          component: () => import(/* webpackChunkName: "account" */ '../views/user/index.vue'),
+      },
+      {
+          path: '/user-form',
+          name: 'user-form',
+          component: () => import(/* webpackChunkName: "account" */ '../views/user/form.vue'),
       }
+
+
   ]
 })
 

admin/src/utils/api.js

@@ -19,6 +19,13 @@ const api = {
     deleteAllowAgent: (id) => {
         return axios.delete(baseUrl + 'agent-allow/' + id);
     },
+
+    listUser: (params = {}) => {
+        return axios.get(baseUrl + 'user', {params: params});
+    },
+    storeUser: (params = {}) => {
+        return axios.post(baseUrl + 'user', params);
+    },
 }
 
 export default api

admin/src/utils/axios.js

@@ -22,8 +22,8 @@ axios.interceptors.response.use(res => {
     ElMessage.error('服务端异常！')
     return Promise.reject(res)
   }
-  if (res.data.data.ret && res.data.data.ret != 0) {
-      ElMessage.error(res.data.data.msg)
+  if (res.data.ret && res.data.ret != 0) {
+      ElMessage.error(res.data.msg)
       return Promise.reject(res)
   }
   if (res.data.resultCode && res.data.resultCode != 200) {
@@ -34,6 +34,10 @@ axios.interceptors.response.use(res => {
     return Promise.reject(res.data)
   }
   return res.data.data
+}, (error) => {
+    console.log(error.response)
+    ElMessage.error(error.response.data.msg || '500 Server Error')
+    return Promise.reject(error)
 })
 
 export default axios

admin/src/utils/index.js

@@ -43,5 +43,8 @@ export const pathMap = {
   order: '订单管理',
   order_detail: '订单详情',
   account: '修改账户',
-    "agent-allow": "允许客户端"
+    "agent-allow": "允许客户端",
+    "agent-allow-form": "允许客户端表单",
+    "user": "用户",
+    "user-form": "用户表单"
 }

admin/src/views/agent-allow/index.vue

@@ -3,14 +3,14 @@
         <template #header>
             <div class="header">
                 <el-button type="primary" size="small" icon="el-icon-plus" @click="handleAdd">增加</el-button>
-                <el-popconfirm
-                    title="确定删除吗？"
-                    @confirm="handleDelete"
-                >
-                    <template #reference>
-                        <el-button type="danger" size="small" icon="el-icon-delete">批量删除</el-button>
-                    </template>
-                </el-popconfirm>
+<!--                <el-popconfirm-->
+<!--                    title="确定删除吗？"-->
+<!--                    @confirm="handleDelete"-->
+<!--                >-->
+<!--                    <template #reference>-->
+<!--                        <el-button type="danger" size="small" icon="el-icon-delete">批量删除</el-button>-->
+<!--                    </template>-->
+<!--                </el-popconfirm>-->
             </div>
         </template>
         <el-table

admin/src/views/user/form.vue

@@ -0,0 +1,146 @@
+<template>
+    <div class="add">
+        <el-card class="add-container">
+            <el-form :model="goodForm" :rules="rules" ref="goodRef" class="goodForm" label-width="150px" style="width: 50%">
+                <el-form-item label="用户名" prop="username">
+                    <el-input type="text" v-model="goodForm.username" placeholder=""></el-input>
+                </el-form-item>
+                <el-form-item label="邮箱" prop="email">
+                    <el-input type="text" v-model="goodForm.email" placeholder=""></el-input>
+                </el-form-item>
+
+                <el-form-item label="密码" prop="password">
+                    <el-input type="text" v-model="goodForm.password" placeholder=""></el-input>
+                </el-form-item>
+                <el-form-item label="确认密码" prop="password_confirmation">
+                    <el-input type="text" v-model="goodForm.password_confirmation" placeholder=""></el-input>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" @click="submitAdd()">{{ id ? '立即修改' : '立即创建' }}</el-button>
+                </el-form-item>
+            </el-form>
+        </el-card>
+    </div>
+</template>
+
+<script>
+import { reactive, ref, toRefs, onMounted, onBeforeUnmount, getCurrentInstance } from 'vue'
+import WangEditor from 'wangeditor'
+import axios from '@/utils/axios'
+import api from '@/utils/api'
+import { ElMessage } from 'element-plus'
+import { useRoute, useRouter } from 'vue-router'
+import { localGet, uploadImgServer, uploadImgsServer, hasEmoji } from '@/utils'
+
+export default {
+    setup() {
+        const { proxy } = getCurrentInstance()
+        console.log('proxy', proxy)
+        const editor = ref(null)
+        const goodRef = ref(null)
+        const route = useRoute()
+        const router = useRouter()
+        const { id } = route.query
+        const state = reactive({
+            uploadImgServer,
+            token: localGet('token') || '',
+            id: id,
+            defaultCate: '',
+            goodForm: {
+                username: '',
+                email: '',
+                password: '',
+                password_confirmation: '',
+            },
+            rules: {
+                username: [
+                    { required: 'true' }
+                ],
+                email: [
+                    { required: 'true'}
+                ],
+                password: [
+                    { required: 'true' }
+                ],
+                password_confirmation: [
+                    { required: 'true' }
+                ],
+            },
+        })
+        onMounted(() => {
+            if (id) {
+                getAgentAllow(id)
+            }
+        })
+        onBeforeUnmount(() => {
+
+        })
+        const getAgentAllow = (id) => {
+            api.getAllowAgent(id).then(res => {
+                state.goodForm = res
+                console.log(res, state.goodForm)
+            })
+        }
+        const submitAdd = () => {
+            goodRef.value.validate((vaild) => {
+                console.log("valid", vaild)
+                if (vaild) {
+                    // 默认新增用 post 方法
+                    let params = state.goodForm
+                    let res
+                    console.log('params', params)
+                    api.storeUser(params).then(res => {
+                        ElMessage.success(id ? '修改成功' : '添加成功')
+                        router.push({ path: '/user' })
+                    })
+                }
+            })
+        }
+        const handleBeforeUpload = (file) => {
+            const sufix = file.name.split('.')[1] || ''
+            if (!['jpg', 'jpeg', 'png'].includes(sufix)) {
+                ElMessage.error('请上传 jpg、jpeg、png 格式的图片')
+                return false
+            }
+        }
+        const handleUrlSuccess = (val) => {
+            state.goodForm.goodsCoverImg = val.data || ''
+        }
+        const handleChangeCate = (val) => {
+            state.categoryId = val[2] || 0
+        }
+        return {
+            ...toRefs(state),
+            goodRef,
+            submitAdd,
+            handleBeforeUpload,
+            handleUrlSuccess,
+            editor,
+            handleChangeCate
+        }
+    }
+}
+</script>
+
+<style scoped>
+.add {
+    display: flex;
+}
+.add-container {
+    flex: 1;
+    height: 100%;
+}
+.avatar-uploader {
+    width: 100px;
+    height: 100px;
+    color: #ddd;
+    font-size: 30px;
+}
+.avatar-uploader-icon {
+    display: block;
+    width: 100%;
+    height: 100%;
+    border: 1px solid #e9e9e9;
+    padding: 32px 17px;
+}
+</style>

admin/src/views/user/index.vue

@@ -0,0 +1,250 @@
+<template>
+    <el-card class="swiper-container">
+        <template #header>
+            <div class="header">
+                <el-button type="primary" size="small" icon="el-icon-plus" @click="handleAdd">增加</el-button>
+                <!--                <el-popconfirm-->
+                <!--                    title="确定删除吗？"-->
+                <!--                    @confirm="handleDelete"-->
+                <!--                >-->
+                <!--                    <template #reference>-->
+                <!--                        <el-button type="danger" size="small" icon="el-icon-delete">批量删除</el-button>-->
+                <!--                    </template>-->
+                <!--                </el-popconfirm>-->
+            </div>
+        </template>
+        <el-table
+            v-loading="loading"
+            ref="multipleTable"
+            :data="tableData"
+            tooltip-effect="dark"
+            style="width: 100%"
+            @selection-change="handleSelectionChange"
+            @sort-change="handleSortChange"
+        >
+            <el-table-column
+                type="selection"
+            >
+            </el-table-column>
+            <el-table-column
+                label="ID"
+                prop="id"
+                width="60"
+                sortable="custom"
+            >
+            </el-table-column>
+            <el-table-column
+                label="用户名"
+                prop="username"
+            >
+            </el-table-column>
+            <el-table-column
+                label="邮箱"
+                prop="email"
+            >
+            </el-table-column>
+            <el-table-column
+                label="等级"
+                prop="class"
+                sortable="custom"
+            ></el-table-column>
+            <el-table-column
+                label="上传量"
+                prop="uploaded"
+                sortable="custom"
+            ></el-table-column>
+
+            <el-table-column
+                prop="downloaded"
+                label="下载量"
+                sortable="custom"
+            >
+            </el-table-column>
+            <el-table-column
+                prop="seedtime"
+                label="做种时间"
+                sortable="custom"
+            >
+            </el-table-column>
+            <el-table-column
+                label="下载时间"
+                prop="leechtime"
+                sortable="custom"
+            ></el-table-column>
+            <el-table-column
+                label="状态"
+                prop="status"
+            ></el-table-column>
+            <el-table-column
+                label="添加时间"
+                prop="added"
+            ></el-table-column>
+            <el-table-column
+                label="操作"
+                width="100"
+            >
+                <template #default="scope">
+<!--                    <a style="cursor: pointer; margin-right: 10px" @click="handleEdit(scope.row.id)">修改</a>-->
+<!--                    <el-popconfirm-->
+<!--                        title="确定删除吗？"-->
+<!--                        @confirm="handleDeleteOne(scope.row.id)"-->
+<!--                    >-->
+<!--                        <template #reference>-->
+<!--                            <a style="cursor: pointer">删除</a>-->
+<!--                        </template>-->
+<!--                    </el-popconfirm>-->
+                </template>
+            </el-table-column>
+        </el-table>
+        <!--总数超过一页，再展示分页器-->
+        <el-pagination
+            background
+            layout="prev, pager, next"
+            :total="total"
+            :page-size="pageSize"
+            :current-page="currentPage"
+            @current-change="changePage"
+        />
+    </el-card>
+</template>
+
+<script>
+import { onMounted, reactive, ref, toRefs } from 'vue'
+import { ElMessage } from 'element-plus'
+import { useRouter } from 'vue-router'
+import AgentAllowForm from './form.vue'
+import axios from '@/utils/axios'
+import api from '@/utils/api'
+
+export default {
+    name: 'Swiper',
+    components: {
+
+    },
+    setup() {
+        const router = useRouter()
+        const multipleTable = ref(null)
+        const addGood = ref(null)
+        const state = reactive({
+            loading: false,
+            tableData: [], // 数据列表
+            multipleSelection: [], // 选中项
+            total: 0, // 总条数
+            currentPage: 1, // 当前页
+            pageSize: 10, // 分页大小
+            type: 'add', // 操作类型
+            sortField: 'id',
+            sortType: 'desc'
+        })
+        onMounted(() => {
+            // getCarousels()
+            listUser()
+        })
+        // 获取轮播图列表
+        const getCarousels = () => {
+            // state.loading = true
+            // axios.get('/carousels', {
+            //     params: {
+            //         pageNumber: state.currentPage,
+            //         pageSize: state.pageSize
+            //     }
+            // }).then(res => {
+            //     state.tableData = res.list
+            //     state.total = res.totalCount
+            //     state.currentPage = res.currPage
+            //     state.loading = false
+            // })
+        }
+
+        const listUser = () => {
+            state.loading = true
+            let params = {
+                page: state.currentPage,
+                sort_field: state.sortField,
+                sort_type: state.sortType
+            }
+            api.listUser(params).then(res => {
+                state.tableData = res.data
+                state.total = res.meta.total
+                state.currentPage = res.meta.current_page
+                state.pageSize = res.meta.per_page
+                state.loading = false
+            })
+        }
+        const handleSortChange = (sort) => {
+            console.log(sort)
+            state.sortField = sort.prop
+            state.sortType = sort.order
+            listUser()
+        }
+        // 添加轮播项
+        const handleAdd = () => {
+            state.type = 'add'
+            // addGood.value.open()
+            router.push({
+                name: "user-form"
+            })
+        }
+        // 修改轮播图
+        const handleEdit = (id) => {
+            console.log("id", id)
+            router.push({
+                name: "agent-allow-form",
+                query: {id: id}
+            })
+        }
+        // 选择项
+        const handleSelectionChange = (val) => {
+            state.multipleSelection = val
+        }
+        // 批量删除
+        const handleDelete = () => {
+            if (!state.multipleSelection.length) {
+                ElMessage.error('请选择项')
+                return
+            }
+            axios.delete('/carousels', {
+                data: {
+                    ids: state.multipleSelection.map(i => i.carouselId)
+                }
+            }).then(() => {
+                ElMessage.success('删除成功')
+                getCarousels()
+            })
+        }
+        // 单个删除
+        const handleDeleteOne = (id) => {
+            api.deleteAllowAgent(id).then(() => {
+                ElMessage.success('删除成功')
+                listUser()
+            })
+        }
+        const changePage = (val) => {
+            state.currentPage = val
+            listUser()
+        }
+        return {
+            ...toRefs(state),
+            multipleTable,
+            handleSelectionChange,
+            handleSortChange,
+            addGood,
+            handleAdd,
+            handleEdit,
+            handleDelete,
+            handleDeleteOne,
+            getCarousels,
+            changePage
+        }
+    }
+}
+</script>
+
+<style scoped>
+.swiper-container {
+    min-height: 100%;
+}
+.el-card.is-always-shadow {
+    min-height: 100%!important;
+}
+</style>