'门店接口联调'

src/api/store/index.ts

@@ -0,0 +1,50 @@
+import request from '@/utils/request';
+import { AxiosPromise } from 'axios';
+//获取门店授权-用户列表
+export function getStoreUserList(data: any): AxiosPromise<any> {
+  return request({
+    url: '/admin/v1/bind/user',
+    method: 'post',
+    data
+  });
+}
+//获取门店账号列表
+export function getStoreAccountList(data: any): AxiosPromise<any> {
+  return request({
+    url: '/admin/v1/store/list',
+    method: 'post',
+    data
+  });
+}
+//添加门店账号
+export function addStoreAccount(data: any): AxiosPromise<any> {
+  return request({
+    url: '/admin/v1/store/create',
+    method: 'post',
+    data
+  });
+}
+//编辑门店账号
+export function editStoreAccount(data: any): AxiosPromise<any> {
+  return request({
+    url: '/admin/v1/store/update',
+    method: 'post',
+    data
+  });
+}
+//删除门店账号
+export function deleteStoreAccount(data: any): AxiosPromise<any> {
+  return request({
+    url: '/admin/v1/store/delete',
+    method: 'post',
+    data
+  });
+}
+//添加账号时选择的门店
+export function getADdStoreList(data: any): AxiosPromise<any> {
+  return request({
+    url: '/admin/v1/store/index',
+    method: 'post',
+    data
+  });
+}

src/views/store/index.vue

@@ -0,0 +1,195 @@
+<template>
+    <div class="app-container">
+        <el-card class="box-card">
+            <el-form ref="queryFormRef" :model="queryParams" :inline="true">
+                <el-form-item label="关键词" prop="keyword">
+                    <el-input v-model="queryParams.keyword" placeholder="用户名/昵称" clearable style="width: 200px"
+                        @keyup.enter="handleQuery" />
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" :icon="Search" @click="handleQuery">
+                        搜索
+                    </el-button>
+                    <el-button :icon="Refresh" @click="resetQuery">
+                        重置
+                    </el-button>
+                </el-form-item>
+            </el-form>
+
+            <el-table v-loading="loading" :data="userList" border stripe style="width: 100%">
+                <el-table-column prop="username" label="用户名" align="center" />
+                <el-table-column prop="nickname" label="昵称" align="center" />
+                <!--头像可点击查看大图-->
+                <el-table-column prop="avatar" label="头像" align="center" width="80">
+                    <template #default="{ row }">
+                        <el-image v-if="row.avatar" :src="row.avatar" :preview-src-list="[row.avatar]"
+                            preview-teleported fit="cover" class="avatar-thumb" hide-on-click-modal />
+                        <span v-else>--</span>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="district_text" label="地区" align="center" />
+                <el-table-column prop="gender_text" label="性别" align="center" />
+                <el-table-column prop="mobile" label="手机号" align="center" />
+                <el-table-column prop="birthday" label="生日" align="center" />
+                <el-table-column prop="age" label="年龄" align="center" />
+                <el-table-column prop="status" label="状态" align="center">
+                    <template #default="{ row }">
+                        <el-tag>
+                            {{ statusData[row.status] }}
+                        </el-tag>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="detection_number" label="总检测次数" align="center" />
+                <el-table-column prop="created_at" label="创建时间" align="center" />
+                <el-table-column label="操作" align="center" width="150">
+                    <template #default="{ row }">
+                        <el-button text @click="openArchiveDialog(row)">用户档案</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+
+            <pagination v-if="total > 0" :total="total" v-model:page="queryParams.page" v-model:limit="queryParams.size"
+                @pagination="handleQuery" />
+        </el-card>
+
+        <!-- 用户档案弹窗 -->
+        <el-dialog v-model="archiveDialogVisible" title="用户档案" width="640px">
+            <el-table v-loading="archiveLoading" :data="archiveList" border stripe style="width: 100%">
+                <el-table-column label="图片" align="center" width="120">
+                    <template #default="{ row }">
+                        <el-image v-if="row.cover" :src="row.cover" :preview-src-list="[row.cover]" preview-teleported
+                            fit="cover" class="archive-cover" hide-on-click-modal />
+                        <span v-else>--</span>
+                    </template>
+                </el-table-column>
+                <el-table-column prop="create_time" label="时间" align="center" min-width="160" />
+                <el-table-column label="操作" align="center" width="150">
+                    <template #default="{ row }">
+                        <el-button text @click="archiveDetail(row)">详情</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <pagination v-if="archiveTotal > 0" :total="archiveTotal" v-model:page="archiveParams.page"
+                v-model:limit="archiveParams.size" @pagination="loadArchive" />
+        </el-dialog>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { reactive, ref, onMounted } from 'vue';
+import { getUserList, getUserarchive, getUserarchiveDetail } from '@/api/user';
+import { getStoreUserList } from '@/api/store/index'
+import { ElMessage } from 'element-plus';
+import { Search, Refresh } from '@element-plus/icons-vue';
+const statusData = {
+    1: '未注册',
+    2: '未进行人脸识别',
+    3: '未完善信息',
+    4: '正常'
+}
+const loading = ref(false);
+const total = ref(0);
+const userList = ref<any[]>([]);
+const queryFormRef = ref();
+
+// 档案弹窗相关
+const archiveDialogVisible = ref(false);
+const archiveLoading = ref(false);
+const archiveTotal = ref(0);
+const archiveList = ref<any[]>([]);
+const currentUserId = ref<number | null>(null);
+const archiveParams = reactive({
+    page: 1,
+    size: 10
+});
+
+// 打开档案弹窗
+function openArchiveDialog(row: any) {
+    currentUserId.value = row.id;
+    archiveDialogVisible.value = true;
+    archiveParams.page = 1;
+    archiveParams.size = 10;
+    loadArchive();
+}
+
+// 加载档案列表
+function loadArchive() {
+    if (!currentUserId.value) return;
+    archiveLoading.value = true;
+    getUserarchive({ user_id: currentUserId.value, ...archiveParams })
+        .then(({ data }: any) => {
+            const list = Array.isArray(data) ? data : data?.data ?? data?.list ?? [];
+            archiveList.value = list;
+            archiveTotal.value =
+                typeof data?.total === 'number' ? data.total : Array.isArray(data) ? data.length : list.length;
+        })
+        .catch((err: any) => {
+            ElMessage.error(err.message || '获取用户档案失败');
+        })
+        .finally(() => {
+            archiveLoading.value = false;
+        });
+}
+
+const queryParams = reactive({
+    page: 1,
+    size: 10,
+    keyword: ''
+});
+
+function handleQuery() {
+    loading.value = true;
+    getStoreUserList(queryParams)
+        .then(({ data }: any) => {
+            userList.value = data;
+        })
+        .catch((err: any) => {
+            ElMessage.error(err.message || '获取授权列表');
+        })
+        .finally(() => {
+            loading.value = false;
+        });
+}
+//用户档案详情
+const archiveDetail = async (row) => {
+    const res = await getUserarchiveDetail({ id: row.id });
+    console.log(res, 'res用户档案详情')
+}
+function resetQuery() {
+    queryFormRef.value?.resetFields();
+    queryParams.page = 1;
+    handleQuery();
+}
+
+function handleSizeChange(size: number) {
+    queryParams.size = size;
+    queryParams.page = 1;
+    handleQuery();
+}
+
+function handleCurrentChange(page: number) {
+    queryParams.page = page;
+    handleQuery();
+}
+
+onMounted(() => {
+    handleQuery();
+});
+</script>
+
+<style lang="scss" scoped>
+.app-container {
+    padding: 20px;
+}
+
+.avatar-thumb {
+    cursor: pointer;
+}
+
+.archive-cover {
+    width: 80px;
+    height: 80px;
+    border-radius: 4px;
+    cursor: pointer;
+}
+</style>

src/views/store/storeAccountList.vue

@@ -0,0 +1,272 @@
+<template>
+    <div class="app-container">
+        <el-card class="box-card">
+            <el-form ref="queryFormRef" :model="queryParams" inline>
+                <el-form-item label="关键词" prop="keyword">
+                    <el-input v-model="queryParams.keyword" placeholder="门店名称" clearable style="width: 200px"
+                        @keyup.enter="handleQuery" />
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" :icon="Search" @click="handleQuery">搜索</el-button>
+                    <el-button type="primary" @click="addList">添加</el-button>
+                    <el-button :icon="Refresh" @click="resetQuery">重置</el-button>
+                </el-form-item>
+            </el-form>
+
+            <el-table v-loading="loading" :data="storeList" border stripe style="width: 100%">
+                <el-table-column prop="account" label="门店账号" align="center" />
+                <el-table-column prop="store_name" label="门店名称" align="center" />
+                <el-table-column prop="store_user_name" label="负责人名称" align="center" />
+                <el-table-column prop="store_user_mobile" label="负责人手机号" align="center" />
+                <el-table-column prop="district_text" label="地区" align="center" />
+                <el-table-column prop="address" label="地址" align="center" />
+                <el-table-column prop="qrcode" label="分享二维码" align="center" width="80">
+                    <template #default="{ row }">
+                        <el-image v-if="row.qrcode" :src="row.qrcode" :preview-src-list="[row.qrcode]" fit="cover"
+                            class="avatar-thumb" hide-on-click-modal />
+                        <span v-else>--</span>
+                    </template>
+                </el-table-column>
+                <el-table-column label="操作" align="center" width="150">
+                    <template #default="{ row }">
+                        <el-button text @click="handleEdit(row)" type="primary">修改</el-button>
+                        <el-button text @click="handleDelete(row)" type="danger">删除</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+
+            <pagination v-if="total > 0" :total="total" v-model:page="queryParams.page" v-model:limit="queryParams.size"
+                @pagination="handleQuery" />
+        </el-card>
+
+        <!-- 添加弹窗 -->
+        <el-dialog v-model="addListDialogVisible" title="添加用户账号" width="640px">
+            <el-form ref="addFormRef" :model="addForm" :rules="addFormRules" label-width="120px">
+                <el-form-item label="账号" prop="account">
+                    <el-input v-model="addForm.account" placeholder="请输入账号" />
+                </el-form-item>
+                <el-form-item label="密码" prop="password">
+                    <el-input v-model="addForm.password" placeholder="请输入密码" type="password" />
+                </el-form-item>
+                <el-form-item label="确认密码" prop="confirm_password">
+                    <el-input v-model="addForm.confirm_password" placeholder="请确认密码" type="password" />
+                </el-form-item>
+                <el-form-item label="门店" prop="store_id">
+                    <el-select v-model="addForm.store_id" placeholder="请选择门店" style="width: 100%"
+                        @change="handleStoreChangeAdd">
+                        <el-option v-for="item in addStoreList" :key="item.id" :label="`${item.store_name}`"
+                            :value="Number(item.id)" />
+                    </el-select>
+                </el-form-item>
+            </el-form>
+            <template #footer>
+                <el-button @click="addListDialogVisible.value = false">取消</el-button>
+                <el-button type="primary" @click="addListSubmit">确定</el-button>
+            </template>
+        </el-dialog>
+
+        <!-- 修改弹窗 -->
+        <el-dialog v-model="editListDialogVisible" title="修改用户账号" width="640px" :key="editForm.id">
+            <el-form ref="editFormRef" :model="editForm" :rules="editFormRules" label-width="120px">
+                <el-form-item label="账号" prop="account">
+                    <el-input v-model="editForm.account" placeholder="请输入账号" />
+                </el-form-item>
+                <el-form-item label="密码" prop="password">
+                    <el-input v-model="editForm.password" placeholder="留空不修改" type="password" />
+                </el-form-item> 
+                <el-form-item label="确认密码" prop="confirm_password">
+                    <el-input v-model="editForm.confirm_password" placeholder="留空不修改" type="password" />
+                </el-form-item>
+                <el-form-item label="门店" prop="store_id">
+                    <el-select v-model="editForm.store_id" placeholder="请选择门店" style="width: 100%"
+                        @change="handleStoreChangeEdit">
+                        <el-option v-for="item in addStoreList" :key="item.id" :label="`${item.store_name}`"
+                            :value="Number(item.id)" />
+                    </el-select>
+                </el-form-item>
+            </el-form>
+            <template #footer>
+                <el-button @click="editListDialogVisible.value = false">取消</el-button>
+                <el-button type="primary" @click="editListSubmit">确定</el-button>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { reactive, ref, onMounted, nextTick } from 'vue';
+import { getStoreAccountList, addStoreAccount, editStoreAccount, deleteStoreAccount, getADdStoreList } from '@/api/store/index';
+import { ElMessage, ElMessageBox } from 'element-plus';
+import { Search, Refresh } from '@element-plus/icons-vue';
+
+// 列表
+const loading = ref(false);
+const total = ref(0);
+const storeList = ref<any[]>([]);
+const queryFormRef = ref();
+const queryParams = reactive({
+    page: 1,
+    size: 10,
+    keyword: '',
+});
+
+// 添加时选择的门店
+const addStoreList = ref<any[]>([]);
+const getAddStoreLists = async () => {
+    const { data } = await getADdStoreList({});
+    console.log(data,'dataaa1111')
+    addStoreList.value = data || [];
+};
+getAddStoreLists();
+// 添加
+const addListDialogVisible = ref(false);
+const addFormRef = ref();
+const addForm = reactive({
+    account: '',
+    password: '',
+    confirm_password: '',
+    store_id: undefined as number | undefined,
+});
+
+// 编辑
+const editListDialogVisible = ref(false);
+const editFormRef = ref();
+const editForm = reactive({
+    id: undefined as number | undefined,
+    account: '',
+    password: '',
+    confirm_password: '',
+    store_id: undefined as number | undefined,
+});
+
+// 添加校验
+const addFormRules = reactive({
+    account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+    password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+    confirm_password: [
+        { required: true, message: '请确认密码', trigger: 'blur' },
+        {
+            validator: (rule: any, value: string, cb: any) => {
+                value !== addForm.password ? cb(new Error('两次密码不一致')) : cb();
+            },
+        },
+    ],
+    store_id: [{ required: true, message: '请选择门店', trigger: 'change' }],
+});
+
+// 编辑校验
+const editFormRules = reactive({
+    account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+    password: [{ required: false }],
+    confirm_password: [
+        {
+            validator: (rule: any, value: string, cb: any) => {
+                if (value && value !== editForm.password) cb(new Error('两次密码不一致'));
+                else cb();
+            },
+        },
+    ],
+    store_id: [{ required: true, message: '请选择门店', trigger: 'change' }],
+});
+
+// 🔥 强制更新视图（解决无法切换）
+const handleStoreChangeAdd = () => { };
+const handleStoreChangeEdit = () => { };
+
+// 打开添加
+const addList = () => {
+    addListDialogVisible.value = true;
+    nextTick(() => addFormRef.value?.resetFields());
+    addForm.store_id = undefined;
+};
+
+// 打开编辑
+const handleEdit = async (row: any) => {
+    editListDialogVisible.value = true;
+    await nextTick();
+    editFormRef.value?.resetFields();
+
+    editForm.id = row.id;
+    editForm.account = row.account;
+    editForm.store_id = Number(row.store_id);
+    editForm.password = '';
+    editForm.confirm_password = '';
+};
+
+// 添加提交
+const addListSubmit = async () => {
+    addFormRef.value?.validate(async (valid) => {
+        if (!valid) return;
+        try {
+            await addStoreAccount(addForm);
+            ElMessage.success('添加成功');
+            addListDialogVisible.value = false;
+            handleQuery();
+        } catch (err) {
+            ElMessage.error('添加失败');
+        }
+    });
+};
+
+// 编辑提交
+const editListSubmit = async () => {
+    editFormRef.value?.validate(async (valid) => {
+        if (!valid) return;
+        try {
+            await editStoreAccount(editForm);
+            ElMessage.success('修改成功');
+            editListDialogVisible.value = false;
+            handleQuery();
+        } catch (err) {
+            ElMessage.error('修改失败');
+        }
+    });
+};
+
+// 获取列表
+const handleQuery = () => {
+    loading.value = true;
+    getStoreAccountList(queryParams)
+        .then(({ data }) => {
+            storeList.value = data?.list || data || [];
+            total.value = data?.total || 0;
+        })
+        .catch(() => ElMessage.error('获取列表失败'))
+        .finally(() => (loading.value = false));
+};
+
+// 重置
+const resetQuery = () => {
+    queryFormRef.value?.resetFields();
+    queryParams.page = 1;
+    handleQuery();
+};
+
+// 删除
+const handleDelete = async (row: any) => {
+    await ElMessageBox.confirm('确认删除？', '提示');
+    try {
+        await deleteStoreAccount({ id: row.id });
+        ElMessage.success('删除成功');
+        handleQuery();
+    } catch (err) {
+        ElMessage.error('删除失败');
+    }
+};
+
+onMounted(() => {
+    handleQuery();
+});
+</script>
+
+<style lang="scss" scoped>
+.app-container {
+    padding: 20px;
+}
+
+.avatar-thumb {
+    width: 50px;
+    height: 50px;
+    cursor: pointer;
+}
+</style>

src/views/user/index.vue

@@ -63,6 +63,11 @@
                     </template>
                 </el-table-column>
                 <el-table-column prop="create_time" label="时间" align="center" min-width="160" />
+                <el-table-column label="操作" align="center" width="150">
+                    <template #default="{ row }">
+                        <el-button text @click="archiveDetail(row)">详情</el-button>
+                    </template>
+                </el-table-column>
             </el-table>
             <pagination v-if="archiveTotal > 0" :total="archiveTotal" v-model:page="archiveParams.page"
                 v-model:limit="archiveParams.size" @pagination="loadArchive" />
@@ -72,7 +77,7 @@
 
 <script setup lang="ts">
 import { reactive, ref, onMounted } from 'vue';
-import { getUserList, getUserarchive } from '@/api/user';
+import { getUserList, getUserarchive, getUserarchiveDetail } from '@/api/user';
 import { ElMessage } from 'element-plus';
 import { Search, Refresh } from '@element-plus/icons-vue';
 const statusData = {
@@ -144,7 +149,11 @@ function handleQuery() {
             loading.value = false;
         });
 }
-
+//用户档案详情
+const archiveDetail = async (row) => {
+    const res = await getUserarchiveDetail({ id: row.id });
+    console.log(res,'res用户档案详情')
+}
 function resetQuery() {
     queryFormRef.value?.resetFields();
     queryParams.page = 1;