diff --git a/src/api/shop.js b/src/api/shop.js
index 8e6c02f..d3845c8 100644
--- a/src/api/shop.js
+++ b/src/api/shop.js
@@ -458,7 +458,6 @@ export function queryAllShopInfo(params) {
   });
 }
 
-
 /**
  * 修改商品排序
  * @returns
@@ -495,7 +494,6 @@ export function upCategorySort(data) {
   });
 }
 
-
 /**
  * 查询店铺充值记录
  * @returns
@@ -519,10 +517,86 @@ export function downloadTableRecharge(data) {
   return request({
     url: `/api/tbShopUser/recharge/download`,
     method: "post",
-    data:{
+    data: {
       shopId: localStorage.getItem("shopId"),
       ...data
     },
     responseType: "blob"
   });
 }
+
+/**
+ * 员工列表
+ * @returns
+ */
+export function tbPlussShopStaffGet(params) {
+  return request({
+    url: `/api/tbPlussShopStaff`,
+    method: "get",
+    params: {
+      shopId: localStorage.getItem("shopId"),
+      ...params
+    }
+  });
+}
+
+/**
+ * 角色列表
+ * @returns
+ */
+export function rolesGet() {
+  return request({
+    url: `/api/roles`,
+    method: "get"
+  });
+}
+
+/**
+ * 增加员工
+ * @returns
+ */
+export function tbPlussShopStaff(data) {
+  return request({
+    url: `/api/tbPlussShopStaff`,
+    method: data.id ? "put" : "post",
+    data: {
+      shopId: localStorage.getItem("shopId"),
+      ...data
+    }
+  });
+}
+
+/**
+ * 通过id获取员工信息
+ * @returns
+ */
+export function tbPlussShopStaffDetail(id) {
+  return request({
+    url: `/api/tbPlussShopStaff/${id}`,
+    method: "get"
+  });
+}
+
+/**
+ * 更改员工状态
+ * @returns
+ */
+export function updateStatus(data) {
+  return request({
+    url: `/api/tbPlussShopStaff/updateStatus`,
+    method: "put",
+    data
+  });
+}
+
+/**
+ * 员工删除
+ * @returns
+ */
+export function shopStaffDelete(data) {
+  return request({
+    url: `/api/tbPlussShopStaff`,
+    method: "delete",
+    data
+  });
+}
diff --git a/src/views/shop/components/addStaff.vue b/src/views/shop/components/addStaff.vue
new file mode 100644
index 0000000..065c88a
--- /dev/null
+++ b/src/views/shop/components/addStaff.vue
@@ -0,0 +1,174 @@
+<template>
+    <el-dialog :title="title" :visible.sync="dialogVisible">
+        <el-form ref="form" :model="form" :rules="rules" label-width="140px" label-position="left">
+            <el-form-item label="员工姓名" prop="name">
+                <el-input v-model="form.name" placeholder="请输入员工姓名" />
+            </el-form-item>
+            <el-form-item label="员工编号" prop="code">
+                <el-input v-model="form.code" placeholder="请输入员工编号" />
+            </el-form-item>
+            <el-form-item label="员工账号" prop="account">
+                <el-input v-model="form.account" placeholder="请输入员工账号，建议使用手机号" />
+            </el-form-item>
+            <el-form-item label="手机号" prop="phone">
+                <el-input v-model="form.phone" placeholder="请输入手机号" />
+            </el-form-item>
+            <el-form-item label="最大优惠金额">
+                <el-input-number v-model="form.maxDiscountAmount" controls-position="right" :min="0"></el-input-number>
+            </el-form-item>
+            <el-form-item label="角色">
+                <el-select v-model="form.roleId" placeholder="请选择角色">
+                    <el-option :label="item.name" :value="item.id" v-for="item in roles" :key="item.id"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="允许登录PC桌面端">
+                <el-switch v-model="form.isPc" :active-value="1" :inactive-value="0"></el-switch>
+            </el-form-item>
+            <el-form-item label="允许登录管理端">
+                <el-switch v-model="form.isManage" :active-value="1" :inactive-value="0"></el-switch>
+            </el-form-item>
+            <el-form-item label="是否启用">
+                <el-switch v-model="form.status" :active-value="1" :inactive-value="0"></el-switch>
+            </el-form-item>
+        </el-form>
+        <span slot="footer" class="dialog-footer">
+            <el-button @click="dialogVisible = false">取 消</el-button>
+            <el-button type="primary" :loading="loading" @click="onSubmitHandle">确 定</el-button>
+        </span>
+    </el-dialog>
+</template>
+
+<script>
+import { tbPlussShopStaff, rolesGet, tbPlussShopStaffDetail } from '@/api/shop.js'
+export default {
+    data() {
+        return {
+            dialogVisible: false,
+            loading: false,
+            form: {
+                id: '',
+                name: '',
+                code: '',
+                account: '',
+                maxDiscountAmount: '',
+                status: 1,
+                isPc: 1,
+                isManage: 1,
+                roleId: '',
+                phone: ''
+            },
+            resetForm: '',
+            rules: {
+                name: [
+                    {
+                        required: true,
+                        message: ' ',
+                        trigger: 'blur'
+                    }
+                ],
+                code: [
+                    {
+                        required: true,
+                        message: ' ',
+                        trigger: 'blur'
+                    }
+                ],
+                account: [
+                    {
+                        required: true,
+                        message: ' ',
+                        trigger: 'blur'
+                    }
+                ],
+                maxDiscountAmount: [
+                    {
+                        required: true,
+                        message: ' ',
+                        trigger: 'blur'
+                    }
+                ],
+                roleId: [
+                    {
+                        required: true,
+                        message: ' ',
+                        trigger: 'blur'
+                    }
+                ],
+                phone: [
+                    {
+                        required: true,
+                        message: ' ',
+                        trigger: 'blur'
+                    }
+                ]
+            },
+            roles: []
+        }
+    },
+    computed: {
+        title() {
+            return this.form.id ? '编辑员工' : '添加员工'
+        }
+    },
+    mounted() {
+        this.resetForm = { ...this.form }
+        this.rolesGet()
+    },
+    methods: {
+        // 添加或编辑员工
+        onSubmitHandle() {
+            this.$refs.form.validate(async valid => {
+                if (valid) {
+                    try {
+                        this.loading = true
+                        await tbPlussShopStaff(this.form)
+                        this.loading = false
+                        this.$emit('success')
+                        this.close()
+                        this.$notify({
+                            title: '成功',
+                            message: `${this.title}成功`,
+                            type: 'success'
+                        });
+                    } catch (error) {
+                        console.log(error);
+                    }
+                }
+            })
+        },
+        // 获取角色列表
+        async rolesGet() {
+            try {
+                const { content } = await rolesGet()
+                this.roles = content
+            } catch (error) {
+                console.log(error);
+            }
+        },
+        reset() {
+            this.form = { ...this.resetForm }
+        },
+        close() {
+            this.dialogVisible = false
+        },
+        show(row) {
+            this.dialogVisible = true
+            if (row && row.id) {
+                // this.form = { ...row }
+                this.tbPlussShopStaffDetail(row.id)
+            } else {
+                this.reset()
+            }
+        },
+        // 通过id获取员工信息
+        async tbPlussShopStaffDetail(id) {
+            try {
+                const res = await tbPlussShopStaffDetail(id)
+                this.form = res
+            } catch (error) {
+                console.log(error);
+            }
+        }
+    }
+}
+</script>
\ No newline at end of file
diff --git a/src/views/shop/staff_list.vue b/src/views/shop/staff_list.vue
new file mode 100644
index 0000000..ee3c402
--- /dev/null
+++ b/src/views/shop/staff_list.vue
@@ -0,0 +1,123 @@
+<template>
+    <div class="app-container">
+        <div class="head-container">
+            <el-button type="primary" icon="el-icon-plus" @click="$refs.addStaff.show()">
+                添加员工
+            </el-button>
+        </div>
+        <div class="head-container">
+            <el-table :data="tableData.list" v-loading="tableData.loading">
+                <el-table-column label="员工名称" prop="name"></el-table-column>
+                <el-table-column label="员工编号" prop="code"></el-table-column>
+                <el-table-column label="员工账号" prop="account"></el-table-column>
+                <el-table-column label="是否启用" prop="status">
+                    <template v-slot="scope">
+                        <el-switch v-model="scope.row.status" :active-value="1" :inactive-value="0"
+                            @change="statusChange($event, scope.row)"></el-switch>
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作" fixed="right" width="120">
+                    <template v-slot="scope">
+                        <div class="btn_rows" style="display: flex;gap: 10px;">
+                            <el-button type="text" icon="el-icon-edit"
+                                @click="$refs.addStaff.show(scope.row)">编辑</el-button>
+                            <el-popconfirm title="确定删除吗？" @confirm="delTableHandle([scope.row.id])">
+                                <el-button type="text" icon="el-icon-delete" slot="reference">删除</el-button>
+                            </el-popconfirm>
+                        </div>
+                    </template>
+                </el-table-column>
+            </el-table>
+        </div>
+        <div class="head-container">
+            <el-pagination @size-change="paginationSizeChange" :total="tableData.total"
+                :current-page="tableData.page + 1" :page-size="tableData.size" @current-change="paginationChange"
+                layout="total, sizes, prev, pager, next, jumper"></el-pagination>
+        </div>
+        <addStaff ref="addStaff" @success="resetHandle" />
+    </div>
+</template>
+
+<script>
+import addStaff from './components/addStaff.vue'
+import { tbPlussShopStaffGet, updateStatus, shopStaffDelete } from '@/api/shop.js'
+export default {
+    components: {
+        addStaff
+    },
+    data() {
+        return {
+            query: {},
+            tableData: {
+                page: 0,
+                size: 30,
+                total: 0,
+                loading: false,
+                list: []
+            }
+        }
+    },
+    mounted() {
+        this.getTableData()
+    },
+    methods: {
+        // 删除
+        async delTableHandle(ids) {
+            try {
+                const res = await shopStaffDelete(ids)
+                this.$notify({
+                    title: '成功',
+                    message: `已删除`,
+                    type: 'success'
+                });
+                this.getTableData()
+            } catch (error) {
+                console.log(error);
+            }
+        },
+        // 修改员工状态
+        async statusChange(e, row) {
+            try {
+                const res = await updateStatus({
+                    id: row.id,
+                    status: e
+                })
+                this.getTableData()
+            } catch (error) {
+                console.log(error);
+            }
+        },
+        // 重置查询
+        resetHandle() {
+            this.tableData.page = 0
+            this.getTableData()
+        },
+        // 每页条数改变是回调
+        paginationSizeChange(e) {
+            this.tableData.size = e
+            this.tableData.page = 0
+            this.getTableData()
+        },
+        // 分页回调
+        paginationChange(e) {
+            this.tableData.page = e - 1
+            this.getTableData()
+        },
+        // 获取员工列表
+        async getTableData() {
+            try {
+                this.tableData.loading = true
+                const res = await tbPlussShopStaffGet({
+                    page: this.tableData.page,
+                    size: this.tableData.size
+                })
+                this.tableData.loading = false
+                this.tableData.list = res.content
+                this.tableData.total = res.totalElements
+            } catch (error) {
+                console.log(error)
+            }
+        }
+    }
+}
+</script>
\ No newline at end of file