账户管理页面

kiisoo-ic-ui/src/iview.js

@@ -27,7 +27,8 @@ import {
     Message,
     Radio,
     List,
-    Divider
+    Divider,
+    Page,
 } from "view-design";
 import 'view-design/dist/styles/iview.css';
 
@@ -62,3 +63,4 @@ Vue.prototype.$Modal = Modal;
 Vue.component('Radio', Radio);
 Vue.component('List', List);
 Vue.component('Divider', Divider);
+Vue.component('Page', Page);

kiisoo-ic-ui/src/pages/Home.vue

@@ -14,7 +14,7 @@
               <Icon type="ios-paper" />
               设置管理
             </template>
-            <MenuItem name="1-1" to="/account/manager">账号管理</MenuItem>
+            <MenuItem name="1-1" to="/account/manager">账户管理</MenuItem>
             <MenuItem name="1-2" to="/role/manager">角色管理</MenuItem>
           </Submenu>
           <Submenu name="2">

kiisoo-ic-ui/src/pages/user/AccountManager.vue

@@ -1,12 +1,142 @@
 <template>
-    <div>
+    <div style="margin-top: 20px;margin-left: 20px">
-        <p>AccountManager</p>
+        <template>
+            <Row style="background-color: #F7F8FA;line-height: 80px;">
+                <span style="margin-left: 20px">账户名</span>
+                <i-input placeholder="搜索用户名/账户" style="width: 10%;margin-left: 10px;" v-model="searchContent" />
+                <span style=";margin-left: 20px;">角色</span>
+                <Select filterable placeholder="请选择区域" v-model="roleId" class="left-15" style="width:190px;margin-left: 10px;">
+                    <Option v-for="item in roleList" :value="item.id" :key="item.id">{{ item.name }}</Option>
+                </Select>
+                <span style=";margin-left: 20px;">店铺</span>
+                <Select filterable placeholder="请选择店铺" v-model="shopId" class="left-15" style="width:190px;margin-left: 10px;">
+                    <Option v-for="item in shopList" :value="item.shopId" :key="item.shopId">{{ item.shopName }}</Option>
+                </Select>
+                <Button type="primary" style="margin-left: 30px">查询</Button>
+                <Button  type="primary" style="margin-bottom: 20px;margin-right: 20px;float:right;margin-top: 25px">+添加账户</Button>
+                <Button  type="primary" ghost style="margin-bottom: 20px;margin-right: 20px;float:right;margin-top: 25px">批量导入账户</Button>
+            </Row>
+        </template>
+        <Table  :columns="columns1" :data="data1" style="margin-top: 30px"></Table>
+        <Page :total="totalSize" :current="pageNum" :page-size="pageSize" show-elevator show-total
+              placement="top" style="float: right;margin-top: 20px"></Page>
     </div>
 </template>
 
 <script>
     export default {
-        name: "AccountManager"
+        data(){
+            return {
+                roleList:[
+                    {
+                        id: '1',
+                        name: '系统管理员',
+                    },
+                    {
+                        id: '2',
+                        name: '运营人员',
+                    },
+                    {
+                        id: '3',
+                        name: '店长',
+                    },
+                    {
+                        id: '4',
+                        name: '导购',
+                    },
+                ],
+                shopList:[
+                    {
+                        shopId: '1',
+                        shopName: '店铺1',
+                    },
+                    {
+                        shopId: '2',
+                        shopName: '店铺2',
+                    },
+                ],
+                columns1: [
+                    {
+                        type: 'index',
+                        width: 80,
+                        title: "序号",
+                        align: 'center'
+                    },
+                    {
+                        title: '姓名',
+                        key: 'userName',
+                        width:'150px'
+                    },
+                    {
+                        title: '员工ID',
+                        key: 'userCode',
+                        width:'150px'
+                    },
+                    {
+                        title: '系统角色',
+                        key: 'roleName',
+                        width:'150px'
+                    },
+                    {
+                        title: '可见店铺',
+                        key: 'shopName',
+                        width:'200px'
+                    },
+                    {
+                        title: '操作',
+                        key: 'operation',
+                        render: (h, params) => {
+                            return h('div', [
+                                h('span', {
+                                    style: {
+                                        background: 'white',
+                                        border: '0',
+                                        color: '#3496EB',
+                                        marginRight: '15px',
+                                        cursor: 'pointer'
+                                    },
+                                    on: {
+                                        click: () => {
+                                        }
+                                    }
+                                }, '修改'),
+                                h('span', {
+                                    style: {
+                                        background: 'white',
+                                        border: '0',
+                                        color: 'red',
+                                        marginRight: '15px',
+                                        cursor: 'pointer'
+                                    },
+                                    on: {
+                                        click: () => {
+                                            this.remove(params);
+                                        }
+                                    }
+                                }, '删除')
+                            ])
+
+                        }
+                    },
+                ],
+                data1: [
+                    {
+                        userName:"何永东",
+                        userCode:"7833",
+                        roleName:"系统管理员",
+                        shopName:"全部",
+                    }
+                ],
+                roleId:1,
+                shopId:1,
+                //分页内容
+                totalSize: 0,
+                pageNum : 1,
+                pageSize : 10,
+                //搜索内容
+                searchContent: null,
+            }
+        }
     }
 </script>
 

kiisoo-ic-ui/src/services/account/AccountManagement.js

@@ -0,0 +1,33 @@
+/**
+ * 账号管理
+ * @author jinchaofan
+ * @date 2020/2/18
+ */
+import http from '../CommonHttp'
+
+/**
+ * 查询账号
+ * @param params
+ * @param call
+ * @returns {Promise<any | never>}
+ */
+export function listAccountInfoApi(params, call) {
+  return http.post('account/info/list', params).then(call);
+}
+/**
+ * 删除账号
+ * @param params
+ * @param call
+ * @returns {Promise<any | never>}
+ */
+export function removeAccountApi(params, call) {
+  return http.post('account/remove', params).then(call);
+}
+
+
+export default {
+
+  listAccountInfoApi,
+  removeAccountApi,
+
+}