查看用户绑定，解绑接口对接联调

src/api/userApp/index.ts

@@ -4,7 +4,7 @@ import { AxiosPromise } from 'axios';
  * 查询设备列表
  * @param query
  */
-export const userList = (params): AxiosPromise => {
+export const userList = (params: any): AxiosPromise => {
   return request({
     url: '/app/user/list',
     method: 'get',
@@ -12,7 +12,7 @@ export const userList = (params): AxiosPromise => {
   });
 };
 // 绑定设备列表
-export const deviceList = (params): AxiosPromise => {
+export const deviceList = (params: any): AxiosPromise => {
   return request({
     url: '/api/app/device',
     method: 'get',
@@ -20,12 +20,24 @@ export const deviceList = (params): AxiosPromise => {
   });
 };
 // 账号状态
-export const userStatus = (data): AxiosPromise => {
+export const userStatus = (data: any): AxiosPromise => {
   return request({
     url: '/api/app/device',
     method: 'put',
     data
   });
 };
+// 解绑设备
+export const deviceUnBind = (data: any): AxiosPromise => {
+  return request({
+    url: '/api/app/device/unBind',
+    method: 'delete',
+    data,
+    headers: {
+      'Content-Type': 'multipart/form-data',  //设置正确的 Content-Type
+    },
+  });
+};
 
-export default { userList,deviceList,userStatus }
+
+export default { userList, deviceList, userStatus, deviceUnBind }

src/router/index.ts

@@ -1,29 +1,6 @@
 import { createWebHistory, createRouter, RouteRecordRaw } from 'vue-router';
 /* Layout */
 import Layout from '@/layout/index.vue';
-
-/**
- * Note: 路由配置项
- *
- * hidden: true                     // 当设置 true 的时候该路由不会再侧边栏出现 如401，login等页面，或者如一些编辑页面/edit/1
- * alwaysShow: true                 // 当你一个路由下面的 children 声明的路由大于1个时，自动会变成嵌套的模式--如组件页面
- *                                  // 只有一个时，会将那个子路由当做根路由显示在侧边栏--如引导页面
- *                                  // 若你想不管路由下面的 children 声明的个数都显示你的根路由
- *                                  // 你可以设置 alwaysShow: true，这样它就会忽略之前定义的规则，一直显示根路由
- * redirect: noRedirect             // 当设置 noRedirect 的时候该路由在面包屑导航中不可被点击
- * name:'router-name'               // 设定路由的名字，一定要填写不然使用<keep-alive>时会出现各种问题
- * query: '{"id": 1, "name": "ry"}' // 访问路由的默认传递参数
- * roles: ['admin', 'common']       // 访问路由的角色权限
- * permissions: ['a:a:a', 'b:b:b']  // 访问路由的菜单权限
- * meta : {
-    noCache: true                   // 如果设置为true，则不会被 <keep-alive> 缓存(默认 false)
-    title: 'title'                  // 设置该路由在侧边栏和面包屑中展示的名字
-    icon: 'svg-name'                // 设置该路由的图标，对应路径src/assets/icons/svg
-    breadcrumb: false               // 如果设置为false，则不会在breadcrumb面包屑中显示
-    activeMenu: '/system/user'      // 当路由设置了该属性，则会高亮相对应的侧边栏。
-  }
- */
-
 // 公共路由
 export const constantRoutes: RouteRecordRaw[] = [
   {

src/views/appUser/index.vue

@@ -34,9 +34,9 @@
             </div>
           </template>
         </el-table-column>
-        <el-table-column label="创建时间" align="center" prop="loginDate" width="180">
+        <el-table-column label="创建时间" align="center" prop="createTime" width="180">
           <template #default="scope">
-            <span>{{ proxy.parseTime(scope.row.loginDate) }}</span>
+            <span>{{ proxy.parseTime(scope.row.createTime) }}</span>
           </template>
         </el-table-column>
         <el-table-column label="操作" fixed="right" align="center">

src/views/appUser/user-info-dialog.vue

@@ -16,18 +16,18 @@
       <el-table-column prop="deviceName" label="设备名称" />
       <el-table-column prop="devicePic" label="设备图片">
         <template #default="scope">
-          <el-image style="width: 40px; height: 40px" :src="scope.row.devicePic"
+          <el-popover placement="right" trigger="click">
-            :preview-src-list="[scope.row.devicePic]" />
+            <template #reference>
+              <img :src="scope.row.devicePic" style="width: 40px; height: 40px; cursor: pointer;"
+                class="hover:opacity-80 transition-opacity" />
+            </template>
+            <img :src="scope.row.devicePic" style="max-width: 600px; max-height: 600px;" />
+          </el-popover>
         </template>
       </el-table-column>
       <el-table-column prop="deviceMac" label="设备MAC" />
       <el-table-column prop="deviceImei" label="设备IMEI" />
-      <el-table-column prop="deviceTypeName" label="设备类型" />
+      <el-table-column prop="typeName" label="设备类型" />
-      <el-table-column prop="deviceStatus" label="状态">
-        <template #default="scope">
-          <span>{{ scope.row.deviceStatus === 1 ? '正常' : '失效' }}</span>
-        </template>
-      </el-table-column>
       <el-table-column prop="createTime" label="绑定日期" />
       <el-table-column label="操作" width="100" align="center">
         <template #default="scope">
@@ -58,8 +58,6 @@ const queryParams = reactive({
   deviceImei: ''
 })
 function openDialog(row: OperLogForm) {
-  console.log(row,'roe11');
-  
   info.value = row;
   open.value = true;
   getList();
@@ -80,23 +78,32 @@ const resetQuery = () => {
 // 列表
 const getList = async () => {
   bindingLoading.value = true;
-  const res = await api.deviceList(queryParams);
+  let data = {
+    bindingUserId: info.value.userId,
+    pageNum: queryParams.pageNum,
+    pageSize: queryParams.pageSize,
+    deviceName: queryParams.deviceName,
+    deviceMac: queryParams.deviceMac,
+    deviceImei: queryParams.deviceImei
+
+  }
+  const res = await api.deviceList(data);
   boundDevices.value = res.rows;
   total.value = res.total;
   bindingLoading.value = false;
 };
 // 解绑
 const handleUnbind = (row) => {
-  proxy?.$modal.confirm.confirm('此操作将解绑设备 "' + row.deviceName + '", 是否继续?', '提示', {
+  proxy?.$modal.confirm('此操作将解绑设备 "' + row.deviceName + '", 是否继续?', '提示', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
     type: 'warning'
   }).then(() => {
     const data = {
-      deviceMac: row.deviceMac,
+      // deviceMac: row.deviceMac,
-      customerId: info.value.id
+      id: row.id
     }
-    api.deviceList(data).then(() => {
+    api.deviceUnBind(data).then(() => {
       proxy?.$modal.msgSuccess({ type: 'success', message: '解绑成功!' })
       getList()
     })