Compare commits
3 Commits
0d76834e3c
...
6d5c289044
| Author | SHA1 | Date | |
|---|---|---|---|
| 6d5c289044 | |||
| f400b8dc52 | |||
| 8875fd8bca |
|
|
@ -217,6 +217,34 @@ export const dynamicRoutes = [
|
|||
meta: { title: '店铺详情', activeMenu: '/system/store' }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/system/equipment',
|
||||
component: Layout,
|
||||
hidden: true,
|
||||
permissions: ['system:equipment:query'],
|
||||
children: [
|
||||
{
|
||||
path: 'detail/:equipmentId(\\d+)',
|
||||
component: () => import('@/views/system/equipment/equipment_detail'),
|
||||
name: 'EquipmentDetail',
|
||||
meta: { title: '设施详情', activeMenu: '/system/equipment' }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/user',
|
||||
component: Layout,
|
||||
hidden: true,
|
||||
permissions: ['system:user:query'],
|
||||
children: [
|
||||
{
|
||||
path: 'detail/:userId(\\d+)',
|
||||
component: () => import('@/views/user/user/detail'),
|
||||
name: 'UserDetail',
|
||||
meta: { title: '用户详情', activeMenu: '/user/user' }
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
|
|
|
|||
|
|
@ -3,73 +3,101 @@
|
|||
<!-- 上半部分 -->
|
||||
<el-row :gutter="20" class="top-section">
|
||||
<!-- 左侧信息 -->
|
||||
<el-col :span="16" class="left-section">
|
||||
<el-col class="left-section">
|
||||
<el-card class="info-card" shadow="always">
|
||||
<div slot="header" class="card-header">
|
||||
<span>设备信息</span>
|
||||
<div class="action-buttons">
|
||||
<el-button type="primary" plain icon="el-icon-plus">增加时长</el-button>
|
||||
<el-button type="info" plain icon="el-icon-refresh">刷新白名单</el-button>
|
||||
<el-button type="warning" plain icon="el-icon-unlock">强制开启</el-button>
|
||||
<el-button type="info" plain icon="el-icon-message">别的设备信息</el-button>
|
||||
<el-button type="primary" plain icon="el-icon-upload2">设置二维码</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
@click="toggleEdit"
|
||||
v-if="!isEditing">
|
||||
修改
|
||||
</el-button>
|
||||
<template v-else>
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-check"
|
||||
@click="handleSave">
|
||||
保存
|
||||
</el-button>
|
||||
<el-button
|
||||
type="info"
|
||||
plain
|
||||
icon="el-icon-close"
|
||||
@click="handleCancel">
|
||||
取消
|
||||
</el-button>
|
||||
</template>
|
||||
<el-popover placement="top" width="180" trigger="hover">
|
||||
<div class="qr-code-box">
|
||||
<qr-code :text="qrCodeText" :width="150" :height="150" />
|
||||
<p>扫描二维码进行设备绑定</p>
|
||||
</div>
|
||||
<el-button slot="reference" type="primary" plain icon="el-icon-download" @click="downloadQRCode">下载二维码</el-button>
|
||||
</el-popover>
|
||||
</div>
|
||||
</div>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<div class="info-item">
|
||||
<span class="label">MAC-1:</span>
|
||||
<span class="value">{{ deviceData.mac || '--' }}</span>
|
||||
<!-- <el-tag size="small" :type="deviceData.onlineStatus === '1' ? 'success' : 'danger'">
|
||||
{{ deviceData.onlineStatus === '1' ? '在线' : '离线' }}
|
||||
</el-tag> -->
|
||||
<template v-if="isEditing">
|
||||
<el-input v-model="editForm.mac" size="small" class="edit-input" disabled></el-input>
|
||||
</template>
|
||||
<span v-else class="value">{{ deviceData.mac || '--' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">型号:</span>
|
||||
<span class="value">{{ deviceData.model || '--' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">限制充值时间:</span>
|
||||
<span class="value">{{ deviceData.limitRechargeTime || '--' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">用户手动操作类型:</span>
|
||||
<span class="value">{{ deviceData.outageWay || '--' }}</span>
|
||||
<template v-if="isEditing">
|
||||
<el-input v-model="editForm.model" size="small" class="edit-input" disabled></el-input>
|
||||
</template>
|
||||
<el-tag v-else size="small" type="primary">{{ deviceData.model || '--' }}</el-tag>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="info-item">
|
||||
<span class="label">MAC-2:</span>
|
||||
<span class="value">{{ deviceData.mac2 || '--' }}</span>
|
||||
<template v-if="isEditing">
|
||||
<el-input v-model="editForm.mac2" size="small" class="edit-input" disabled></el-input>
|
||||
</template>
|
||||
<span v-else class="value">{{ deviceData.mac2 || '--' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">产品ID:</span>
|
||||
<span class="value">{{ deviceData.productId || '--' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">限制充值原因:</span>
|
||||
<span class="value">{{ deviceData.limitRechargeReason || '--' }}</span>
|
||||
<template v-if="isEditing">
|
||||
<el-input v-model="editForm.productId" size="small" class="edit-input" disabled></el-input>
|
||||
</template>
|
||||
<span v-else class="value">{{ deviceData.productId || '--' }}</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="info-item">
|
||||
<span class="label">SN:</span>
|
||||
<span class="value">{{ deviceData.sn || '--' }}</span>
|
||||
<template v-if="isEditing">
|
||||
<el-input v-model="editForm.sn" size="small" class="edit-input"></el-input>
|
||||
</template>
|
||||
<span v-else class="value">{{ deviceData.sn || '--' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">型号功能:</span>
|
||||
<span class="value">
|
||||
<template v-if="isEditing">
|
||||
<el-select v-model="editForm.modelTags" multiple size="small" class="edit-input" disabled>
|
||||
<el-option
|
||||
v-for="tag in modelTagOptions"
|
||||
:key="tag.dictValue"
|
||||
:label="tag.dictLabel"
|
||||
:value="tag.dictValue">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
<span v-else class="value">
|
||||
<el-tag v-for="tag in modelTags" :key="tag" size="small" type="primary">{{ tag }}</el-tag>
|
||||
</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">用户手动操作时间:</span>
|
||||
<span class="value">{{ deviceData.lastRecoverTime || '--' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">用户手动操作传量:</span>
|
||||
<span class="value">{{ deviceData.surplusEle || '--' }} 度</span>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
|
|
@ -86,38 +114,64 @@
|
|||
<el-col :span="8">
|
||||
<div class="info-item">
|
||||
<span class="label">设备名称:</span>
|
||||
<span class="value">{{ deviceData.deviceName || '--' }}</span>
|
||||
<template v-if="isEditing">
|
||||
<el-input v-model="editForm.deviceName" size="small" class="edit-input"></el-input>
|
||||
</template>
|
||||
<span v-else class="value">{{ deviceData.deviceName || '--' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">月费:</span>
|
||||
<span class="value">{{ deviceData.monthFee || '--' }} 元/月</span>
|
||||
<span class="label">房间名称:</span>
|
||||
<template v-if="isEditing">
|
||||
<el-input v-model="editForm.roomName" size="small" class="edit-input" disabled></el-input>
|
||||
</template>
|
||||
<span v-else class="value">{{ deviceData.monthFee || '--' }}</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="info-item">
|
||||
<span class="label">服务模式:</span>
|
||||
<span class="value">
|
||||
<el-tag size="small" type="primary">{{ serviceModeText }}</el-tag>
|
||||
</span>
|
||||
<span class="label">所属店铺:</span>
|
||||
<template v-if="isEditing">
|
||||
<el-input v-model="editForm.storeName" size="small" class="edit-input" disabled></el-input>
|
||||
</template>
|
||||
<span v-else class="value">{{ deviceData.storeName || '--' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">平台服务费:</span>
|
||||
<span class="value">{{ deviceData.serviceRate || '--' }} %</span>
|
||||
<span class="label">绑定设施:</span>
|
||||
<template v-if="isEditing">
|
||||
<el-select v-model="editForm.serviceRate" size="small" class="edit-input" disabled>
|
||||
<el-option
|
||||
v-for="option in facilityOptions"
|
||||
:key="option.dictValue"
|
||||
:label="option.dictLabel"
|
||||
:value="option.dictValue">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
<span v-else class="value">
|
||||
<el-tag size="small" type="primary">{{ facilityTag }}</el-tag>
|
||||
</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="info-item">
|
||||
<span class="label">所属商户:</span>
|
||||
<span class="value">{{ deviceData.storeName || '--' }}</span>
|
||||
<template v-if="isEditing">
|
||||
<el-input v-model="editForm.userName" size="small" class="edit-input" disabled></el-input>
|
||||
</template>
|
||||
<span v-else class="value">{{ deviceData.userName || '--' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">备注:</span>
|
||||
<span class="value">{{ deviceData.remark || '--' }}</span>
|
||||
<template v-if="isEditing">
|
||||
<el-input v-model="editForm.remark" size="small" class="edit-input" > </el-input>
|
||||
</template>
|
||||
<span v-else class="value">{{ deviceData.remark || '--' }}</span>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
|
||||
|
||||
<el-card class="info-card" shadow="always">
|
||||
<div slot="header" class="card-header">
|
||||
<span>物联网信息</span>
|
||||
|
|
@ -163,7 +217,7 @@
|
|||
</el-col>
|
||||
|
||||
<!-- 右侧信息 -->
|
||||
<el-col :span="8" class="right-section">
|
||||
<el-col class="right-section">
|
||||
<el-card class="info-card" shadow="always">
|
||||
<div slot="header" class="card-header">
|
||||
<span>分成信息</span>
|
||||
|
|
@ -214,14 +268,17 @@
|
|||
<span>操作台</span>
|
||||
</div>
|
||||
<div class="operation-buttons">
|
||||
<el-button type="text" icon="el-icon-view">详情</el-button>
|
||||
<el-button type="text" icon="el-icon-edit">修改</el-button>
|
||||
<el-button type="text" icon="el-icon-unlock">打开</el-button>
|
||||
<el-button type="text" icon="el-icon-lock">关闭</el-button>
|
||||
<el-button type="text" icon="el-icon-check">禁用</el-button>
|
||||
<el-button type="text" icon="el-icon-refresh">重启</el-button>
|
||||
<el-button type="text" icon="el-icon-refresh">更新</el-button>
|
||||
<el-button type="text" icon="el-icon-delete">删除</el-button>
|
||||
<!-- <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(deviceData)">修改</el-button> -->
|
||||
<el-button v-if="deviceData.status != '3'" size="mini" type="text" icon="el-icon-unlock"
|
||||
@click="handleUnlocking(deviceData)">打开</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-lock" @click="handleLock(deviceData)">关闭</el-button>
|
||||
<el-button v-if="deviceData.status != '0'" size="mini" type="text" icon="el-icon-check"
|
||||
@click="handleOnline(deviceData)">
|
||||
{{ deviceData.status === '8' ? '解禁' : '禁用' }}
|
||||
</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-refresh" @click="reboot(deviceData)">重启</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-refresh" @click="refresh(deviceData)">更新</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(deviceData)">删除</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
|
@ -261,94 +318,46 @@
|
|||
</el-tab-pane>
|
||||
<el-tab-pane label="订单列表" name="orders">订单列表内容</el-tab-pane>
|
||||
<el-tab-pane label="命令日志" name="logs">命令日志内容</el-tab-pane>
|
||||
<el-tab-pane label="抄表记录" name="readings">抄表记录内容</el-tab-pane>
|
||||
<el-tab-pane label="绑定/解绑记录" name="bindings">绑定/解绑记录内容</el-tab-pane>
|
||||
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getDevice,
|
||||
updateDevice,
|
||||
handleLock,
|
||||
handleUnlocking,
|
||||
reboot,
|
||||
refreshDevice,
|
||||
delDevice
|
||||
} from '@/api/system/device'
|
||||
import { listData } from '@/api/system/dict/data'
|
||||
import QrCode from '@/components/QrCode/index.vue'
|
||||
import QRCode from 'qrcode'
|
||||
|
||||
export default {
|
||||
name: 'DeviceDetail',
|
||||
components: { QrCode },
|
||||
data() {
|
||||
return {
|
||||
deviceData: {
|
||||
createBy: "",
|
||||
createTime: "2024-12-18 18:00:48",
|
||||
updateBy: "",
|
||||
updateTime: "2024-12-27 10:38:08",
|
||||
remark: null,
|
||||
deviceId: 3052,
|
||||
sn: "102",
|
||||
storeId: null,
|
||||
deviceName: "未命名",
|
||||
modelId: 37,
|
||||
mac: "1D57887A4EE0",
|
||||
mac2: null,
|
||||
activationTime: "2025-01-02 16:09:15",
|
||||
totalElectriQuantity: 0.00,
|
||||
onlineStatus: "0",
|
||||
onlineStatus1: "0",
|
||||
onlineStatus2: "0",
|
||||
status: "1",
|
||||
realTimePower: null,
|
||||
electricity: 0.00,
|
||||
voltage: 0.00,
|
||||
nickName: null,
|
||||
outageWay: "1",
|
||||
wifi: null,
|
||||
lastPullTime: null,
|
||||
initReading: 0.00,
|
||||
powerStatus: "0",
|
||||
expireTime: null,
|
||||
customPicture: null,
|
||||
serviceRate: null,
|
||||
serviceType: "1",
|
||||
remainTime: 0.00,
|
||||
userId: 29,
|
||||
startTime: null,
|
||||
startUnit: null,
|
||||
startPrice: null,
|
||||
overTime: null,
|
||||
overUnit: null,
|
||||
overPrice: null,
|
||||
rentTime: null,
|
||||
lockUserId: null,
|
||||
surplusEle: 0.00,
|
||||
limitRechargeTime: null,
|
||||
limitRechargeReason: null,
|
||||
lastOnlineTime: "2025-01-03 10:00:00",
|
||||
lastRecoverTime: null,
|
||||
agentServiceRate: null,
|
||||
agentId: null,
|
||||
serviceMode: "1",
|
||||
monthFee: null,
|
||||
version: "V1.0.0",
|
||||
isDefault: null,
|
||||
storeName: null,
|
||||
model: "4G语音30A",
|
||||
userName: "18650502300",
|
||||
userMobile: "18650502300",
|
||||
picture: "https://api.ccttiot.com/Fk7zMpDW8MHmNZVm4mG3Hhun7ppH",
|
||||
modelTags: ["1", "3", "5", "6"],
|
||||
qrText: "102",
|
||||
storeBusinessTimeStart: null,
|
||||
storeBusinessTimeEnd: null,
|
||||
orderCount: null,
|
||||
orderAmount: null,
|
||||
storeContactName: null,
|
||||
storeContactMobile: null,
|
||||
modelProductId: "lXZ62zkHzZ",
|
||||
serviceFeeProportion: 0.005400,
|
||||
realServiceRate: null,
|
||||
agentUserServiceRate: null,
|
||||
agentName: null,
|
||||
agentMobile: null,
|
||||
usingBillCount: null,
|
||||
agentAllowMchSwitch: null,
|
||||
allowSwitch: null,
|
||||
placementStatus: "2",
|
||||
productId: "lXZ62zkHzZ"
|
||||
deviceData: {},
|
||||
isEditing: false, // 是否处于编辑状态
|
||||
editForm: {
|
||||
deviceId: '',
|
||||
deviceName: '',
|
||||
mac: '',
|
||||
mac2: '',
|
||||
sn: '',
|
||||
model: '',
|
||||
productId: '',
|
||||
modelTags: [],
|
||||
storeName: '',
|
||||
serviceRate: '',
|
||||
userName: '',
|
||||
remark: '',
|
||||
roomName: ''
|
||||
},
|
||||
activeTab: 'packages',
|
||||
searchForm: {
|
||||
|
|
@ -357,20 +366,25 @@
|
|||
packageName: '',
|
||||
chargeMode: '',
|
||||
chargeType: ''
|
||||
}
|
||||
},
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
dictType: 'sm_model_tag',
|
||||
dictLabel: undefined,
|
||||
status: undefined
|
||||
},
|
||||
facilityOptions: [],
|
||||
modelTagOptions: [],
|
||||
loading: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
modelTags() {
|
||||
return this.deviceData.modelTags.map(tag => {
|
||||
switch (tag) {
|
||||
case "1": return "蓝牙";
|
||||
case "3": return "WIFI";
|
||||
case "5": return "4G";
|
||||
case "6": return "语音";
|
||||
default: return tag;
|
||||
}
|
||||
});
|
||||
return this.deviceData.modelTags ? this.deviceData.modelTags.map(tag => {
|
||||
const modelTag = this.modelTagOptions.find(option => option.dictValue === tag);
|
||||
return modelTag ? modelTag.dictLabel : tag;
|
||||
}) : [];
|
||||
},
|
||||
serviceModeText() {
|
||||
switch (this.deviceData.serviceMode) {
|
||||
|
|
@ -378,11 +392,135 @@
|
|||
case "2": return "代理模式";
|
||||
default: return "--";
|
||||
}
|
||||
},
|
||||
facilityTag() {
|
||||
const facility = this.facilityOptions.find(option => option.dictValue === this.deviceData.serviceRate);
|
||||
return facility ? facility.dictLabel : '--';
|
||||
},
|
||||
qrCodeText() {
|
||||
return this.deviceData.qrText || '无二维码信息';
|
||||
}
|
||||
},
|
||||
created() {
|
||||
const deviceId = this.$route.params.deviceId;
|
||||
if (deviceId) {
|
||||
this.fetchDeviceData(deviceId);
|
||||
}
|
||||
this.fetchFacilityOptions();
|
||||
this.fetchModelTagOptions();
|
||||
},
|
||||
methods: {
|
||||
// 切换编辑状态
|
||||
toggleEdit() {
|
||||
this.isEditing = true;
|
||||
// 复制当前数据到编辑表单
|
||||
this.editForm = {
|
||||
deviceId: this.deviceData.deviceId,
|
||||
deviceName: this.deviceData.deviceName,
|
||||
mac: this.deviceData.mac,
|
||||
mac2: this.deviceData.mac2,
|
||||
sn: this.deviceData.sn,
|
||||
model: this.deviceData.model,
|
||||
productId: this.deviceData.productId,
|
||||
modelTags: this.deviceData.modelTags || [],
|
||||
storeName: this.deviceData.storeName,
|
||||
serviceRate: this.deviceData.serviceRate,
|
||||
userName: this.deviceData.userName,
|
||||
remark: this.deviceData.remark,
|
||||
roomName: this.deviceData.monthFee
|
||||
};
|
||||
},
|
||||
|
||||
// 保存编辑
|
||||
handleSave() {
|
||||
updateDevice(this.editForm).then(() => {
|
||||
this.$message.success("设备信息已更新");
|
||||
this.isEditing = false;
|
||||
// 重新获取设备数据
|
||||
this.fetchDeviceData(this.editForm.deviceId);
|
||||
}).catch(() => {
|
||||
this.$message.error("更新设备信息失败");
|
||||
});
|
||||
},
|
||||
|
||||
// 取消编辑
|
||||
handleCancel() {
|
||||
this.isEditing = false;
|
||||
this.editForm = {};
|
||||
},
|
||||
|
||||
fetchDeviceData(deviceId) {
|
||||
getDevice(deviceId).then(response => {
|
||||
this.deviceData = response.data;
|
||||
this.loading = false;
|
||||
}).catch(error => {
|
||||
this.$message.error("获取设备详情失败");
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
|
||||
fetchFacilityOptions() {
|
||||
listData({ pageNum: 1, pageSize: 10, dictType: 'ss_equipment_type' }).then(response => {
|
||||
this.facilityOptions = response.rows;
|
||||
}).catch(error => {
|
||||
this.$message.error("获取绑定设施数据失败");
|
||||
});
|
||||
},
|
||||
|
||||
fetchModelTagOptions() {
|
||||
listData(this.queryParams).then(response => {
|
||||
this.modelTagOptions = response.rows;
|
||||
}).catch(error => {
|
||||
this.$message.error("获取modelTags数据失败");
|
||||
});
|
||||
},
|
||||
|
||||
downloadQRCode() {
|
||||
const qrText = this.qrCodeText;
|
||||
QRCode.toDataURL(qrText, { width: 150, height: 150 }, (err, url) => {
|
||||
if (err) {
|
||||
this.$message.error("生成二维码失败");
|
||||
return;
|
||||
}
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = `${this.deviceData.sn || 'unknown'}.png`;
|
||||
link.click();
|
||||
});
|
||||
},
|
||||
|
||||
handleUnlocking(row) {
|
||||
handleUnlocking(row.deviceId).then(() => {
|
||||
this.$message.success("设备已解锁");
|
||||
});
|
||||
},
|
||||
|
||||
handleLock(row) {
|
||||
handleLock(row.deviceId).then(() => {
|
||||
this.$message.success("设备已锁定");
|
||||
});
|
||||
},
|
||||
|
||||
reboot(row) {
|
||||
reboot(row.deviceId).then(() => {
|
||||
this.$message.success("设备已重启");
|
||||
});
|
||||
},
|
||||
|
||||
refresh(row) {
|
||||
refreshDevice(row.deviceId).then(() => {
|
||||
this.$message.success("设备已更新");
|
||||
});
|
||||
},
|
||||
|
||||
handleDelete(row) {
|
||||
delDevice(row.deviceId).then(() => {
|
||||
this.$message.success("设备已删除");
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.device-detail {
|
||||
padding: 20px;
|
||||
|
|
@ -392,16 +530,43 @@
|
|||
align-items: stretch;
|
||||
}
|
||||
|
||||
.left-section {
|
||||
width: 70%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.right-section {
|
||||
width: 30%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.info-card {
|
||||
margin-bottom: 20px;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
flex: 1;
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.action-buttons, .header-buttons {
|
||||
.action-buttons {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
|
||||
.el-button {
|
||||
margin-left: 0;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.header-buttons {
|
||||
.el-button {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
|
@ -417,10 +582,21 @@
|
|||
color: #606266;
|
||||
margin-right: 10px;
|
||||
min-width: 100px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.value {
|
||||
color: #333;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.edit-input {
|
||||
width: 200px;
|
||||
margin-right: 10px;
|
||||
|
||||
&.el-select {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-tag {
|
||||
|
|
@ -448,6 +624,8 @@
|
|||
}
|
||||
|
||||
.detail-tabs {
|
||||
margin-top: 20px;
|
||||
|
||||
.search-form {
|
||||
margin-bottom: 20px;
|
||||
|
||||
|
|
@ -457,4 +635,134 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
// QR码样式
|
||||
.qr-code-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
p {
|
||||
margin-top: 10px;
|
||||
color: #606266;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
// 编辑状态下的输入框样式
|
||||
.editing {
|
||||
.info-item {
|
||||
.el-input,
|
||||
.el-select {
|
||||
.el-input__inner {
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 多选标签的样式
|
||||
.el-select-dropdown__item {
|
||||
padding: 0 10px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
// 表格样式优化
|
||||
.el-table {
|
||||
th, td {
|
||||
padding: 8px 0;
|
||||
}
|
||||
|
||||
.cell {
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
// 标签页样式
|
||||
.el-tabs__item {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
// 卡片内容区域padding调整
|
||||
.el-card__body {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
// 输入框hover和focus状态
|
||||
.el-input__inner:hover,
|
||||
.el-select:hover .el-input__inner {
|
||||
border-color: #409EFF;
|
||||
}
|
||||
|
||||
.el-input__inner:focus,
|
||||
.el-select .el-input__inner:focus {
|
||||
border-color: #409EFF;
|
||||
}
|
||||
|
||||
// 按钮组样式优化
|
||||
.action-buttons {
|
||||
.el-button + .el-button {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.el-button {
|
||||
padding: 7px 15px;
|
||||
font-size: 12px;
|
||||
|
||||
&--mini {
|
||||
padding: 5px 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 表单项间距
|
||||
.el-form-item {
|
||||
margin-bottom: 18px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// 下拉选择器宽度
|
||||
.el-select {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// 标签样式
|
||||
.el-tag {
|
||||
margin-right: 8px;
|
||||
margin-bottom: 5px;
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// 弹出框样式
|
||||
.el-popover {
|
||||
min-width: 150px;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
// 加载状态
|
||||
.loading {
|
||||
position: relative;
|
||||
min-height: 200px;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(255, 255, 255, 0.7);
|
||||
z-index: 1000;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -71,14 +71,14 @@
|
|||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed label="MAC-2" prop="mac2" width="150" align="center">
|
||||
<el-table-column label="MAC-2" prop="mac2" width="150" align="center">
|
||||
<template slot-scope="d">
|
||||
<router-link :to="'/system/deviceDetail/index/' + d.row.deviceId" class="link-type">
|
||||
<span>{{ d.row.mac2 }}</span>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed label="SN" prop="sn" width="150" align="center">
|
||||
<el-table-column label="SN" prop="sn" width="150" align="center">
|
||||
<template slot-scope="d">
|
||||
<router-link :to="'/system/deviceDetail/index/' + d.row.deviceId" class="link-type">
|
||||
<span>{{ d.row.sn }}</span>
|
||||
|
|
@ -92,8 +92,17 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
<template v-for="column of showColumns">
|
||||
<el-table-column :key="column.key" :label="column.label" :prop="column.key" :align="column.align"
|
||||
:width="column.width" :sort-orders="orderSorts" :sortable="column.sortable" class="no-wrap-column">
|
||||
<el-table-column
|
||||
:key="column.key"
|
||||
:label="column.label"
|
||||
:prop="column.key"
|
||||
:align="column.align"
|
||||
:min-width="column.minWidth"
|
||||
:sort-orders="orderSorts"
|
||||
:sortable="column.sortable"
|
||||
:show-overflow-tooltip="column.overflow"
|
||||
:width="column.width"
|
||||
>
|
||||
<template slot-scope="d">
|
||||
<template v-if="column.key === 'status'">
|
||||
<dict-tag :options="dict.type.as_device_status" :value="d.row[column.key]" />
|
||||
|
|
@ -119,7 +128,26 @@
|
|||
<el-tag size="small">{{ d.row[column.key] }}</el-tag>
|
||||
</template>
|
||||
<template v-else-if="column.key === 'userName'">
|
||||
<el-link
|
||||
type="primary"
|
||||
@click="handleUserDetail(d.row.userId)"
|
||||
>
|
||||
<span class="no-wrap">商户：{{ d.row.userName }}</span>
|
||||
</el-link>
|
||||
</template>
|
||||
<template v-else-if="column.key === 'placementStatus'">
|
||||
<template v-if="d.row.placementStatus === '2'">
|
||||
<span>未投放</span>
|
||||
</template>
|
||||
<template v-else-if="d.row.placementStatus === '1' && d.row.equ">
|
||||
<el-link
|
||||
type="primary"
|
||||
@click="handleEquipmentDetail(d.row.equ.equipmentId)"
|
||||
>
|
||||
{{ formatEquipmentInfo(d.row.equ) }}
|
||||
</el-link>
|
||||
</template>
|
||||
<template v-else>-</template>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span class="no-wrap">{{ d.row[column.key] }}</span>
|
||||
|
|
@ -128,32 +156,33 @@
|
|||
</el-table-column>
|
||||
</template>
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="300"
|
||||
align="center"
|
||||
class-name="operation-column">
|
||||
fixed="right"
|
||||
width="180"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<div class="operation-buttons">
|
||||
<el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)"
|
||||
v-hasPermi="['system:fault:query']">详情</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:device:edit']">修改</el-button>
|
||||
<el-button v-if="scope.row.status != '3'" size="mini" type="text" icon="el-icon-unlock"
|
||||
@click="handleUnlocking(scope.row)" v-hasPermi="['system:device:unlocking']">打开</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-lock" @click="handleLock(scope.row)"
|
||||
v-hasPermi="['system:device:unlocking']">关闭</el-button>
|
||||
<el-button v-if="scope.row.status != '0'" size="mini" type="text" icon="el-icon-check"
|
||||
@click="handleOnline(scope.row)" v-hasPermi="['system:device:online']">
|
||||
{{ scope.row.status === '8' ? '解禁' : '禁用' }}
|
||||
</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-refresh" @click="reboot(scope.row)"
|
||||
v-hasPermi="['system:device:reboot']">重启</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-refresh" @click="refresh(scope.row)"
|
||||
v-hasPermi="['system:device:refresh']">更新</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:device:remove']">删除</el-button>
|
||||
</div>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleView(scope.row)"
|
||||
v-hasPermi="['system:device:query']"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:device:edit']"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['system:device:remove']"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
|
@ -369,6 +398,7 @@ export default {
|
|||
columns: [
|
||||
{ key: 'deviceName', visible: true, label: '设备名称', width: '180', sortable: true, align: 'center' },
|
||||
{ key: 'model', visible: true, label: '设备型号', width: '150', sortable: true, align: 'center' },
|
||||
{ key: 'placementStatus', visible: true, label: '投放状态', width: '150', sortable: true, align: 'center' },
|
||||
{ key: 'version', visible: true, label: '版本', width: '150', sortable: true, align: 'center' },
|
||||
{ key: 'status', visible: true, label: '状态', width: '120', sortable: true, align: 'center' },
|
||||
{ key: 'powerStatus', visible: true, label: '开关状态', width: '120', sortable: true, align: 'center' },
|
||||
|
|
@ -647,10 +677,11 @@ export default {
|
|||
this.title = "添加设备";
|
||||
},
|
||||
handleView(row) {
|
||||
this.open2 = true;
|
||||
this.form = row;
|
||||
this.showPlaceSearchMap = true;
|
||||
this.key++;
|
||||
if (row.deviceId) {
|
||||
this.$router.push({
|
||||
path: `/system/deviceDetail/index/${row.deviceId}`
|
||||
});
|
||||
}
|
||||
},
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
|
|
@ -729,7 +760,21 @@ export default {
|
|||
this.download('system/device/export', {
|
||||
...this.queryParams
|
||||
}, `device_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
handleEquipmentDetail(equipmentId) {
|
||||
this.$router.push(`/system/equipment/detail/${equipmentId}`);
|
||||
},
|
||||
/** 格式化设施信息 */
|
||||
formatEquipmentInfo(equipment) {
|
||||
if (!equipment) return '-';
|
||||
return `${equipment.storeName || ''}-${equipment.name || ''}`;
|
||||
},
|
||||
/** 查看用户详情按钮操作 */
|
||||
handleUserDetail(userId) {
|
||||
if (userId) {
|
||||
this.$router.push(`/user/detail/${userId}`);
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
120
src/views/system/equipment/equipment_detail.vue
Normal file
120
src/views/system/equipment/equipment_detail.vue
Normal file
|
|
@ -0,0 +1,120 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<!-- 基本信息卡片 -->
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>基本信息</span>
|
||||
</div>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<div class="info-item">
|
||||
<span class="label">设施ID：</span>
|
||||
<span>{{ equipmentData.equipmentId }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">设施名称：</span>
|
||||
<span>{{ equipmentData.name }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">设施类型：</span>
|
||||
<dict-tag :options="dict.type.ss_equipment_type" :value="equipmentData.type"/>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="info-item">
|
||||
<span class="label">所属店铺：</span>
|
||||
<span>{{ equipmentData.storeName }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">所属房间：</span>
|
||||
<span>{{ equipmentData.roomName }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">状态：</span>
|
||||
<dict-tag :options="dict.type.ss_equipment_status" :value="equipmentData.status"/>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="info-item">
|
||||
<span class="label">创建时间：</span>
|
||||
<span>{{ parseTime(equipmentData.createTime) }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">更新时间：</span>
|
||||
<span>{{ parseTime(equipmentData.updateTime) }}</span>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
|
||||
<!-- 设备信息卡片 -->
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>设备信息</span>
|
||||
</div>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<div class="info-item">
|
||||
<span class="label">设备ID：</span>
|
||||
<span>{{ equipmentData.deviceId }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">MAC地址：</span>
|
||||
<span>{{ equipmentData.device ? equipmentData.device.mac : '-' }}</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="info-item">
|
||||
<span class="label">SN：</span>
|
||||
<span>{{ equipmentData.device ? equipmentData.device.sn : '-' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">设备状态：</span>
|
||||
<dict-tag :options="dict.type.ss_device_status" :value="equipmentData.device ? equipmentData.device.status : ''"/>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getEquipment } from "@/api/system/equipment";
|
||||
|
||||
export default {
|
||||
name: "EquipmentDetail",
|
||||
dicts: ['ss_equipment_type', 'ss_equipment_status', 'ss_device_status'],
|
||||
data() {
|
||||
return {
|
||||
equipmentData: {}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
const equipmentId = this.$route.params.equipmentId;
|
||||
this.getEquipmentData(equipmentId);
|
||||
},
|
||||
methods: {
|
||||
getEquipmentData(equipmentId) {
|
||||
getEquipment(equipmentId).then(response => {
|
||||
this.equipmentData = response.data;
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.app-container {
|
||||
.box-card {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.info-item {
|
||||
margin-bottom: 15px;
|
||||
.label {
|
||||
color: #606266;
|
||||
margin-right: 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -201,6 +201,13 @@
|
|||
</template>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleView(scope.row)"
|
||||
v-hasPermi="['system:equipment:query']"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
|
|
@ -534,8 +541,16 @@ export default {
|
|||
handleAddressClick(lng, lat) {
|
||||
if (!lng || !lat) return;
|
||||
window.open(`https://uri.amap.com/marker?position=${lng},${lat}&callnative=1`);
|
||||
},
|
||||
/** 查看详情按钮操作 */
|
||||
handleView(row) {
|
||||
if (row.equipmentId) {
|
||||
this.$router.push({
|
||||
path: `/system/equipment/detail/${row.equipmentId}`
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
// 过滤设施类型选项
|
||||
filteredEquipmentTypes() {
|
||||
|
|
|
|||
180
src/views/user/user/detail.vue
Normal file
180
src/views/user/user/detail.vue
Normal file
|
|
@ -0,0 +1,180 @@
|
|||
<template>
|
||||
<div class="app-container" v-loading="loading">
|
||||
<template>
|
||||
<el-row :gutter="12">
|
||||
<el-col :lg="10" :md="12" :xs="24">
|
||||
<el-card class="box-card">
|
||||
<template #header>
|
||||
<el-row type="flex" style="justify-content: space-between">
|
||||
<div>用户详情</div>
|
||||
<div>
|
||||
<el-button type="text" icon="el-icon-setting" size="small" style="padding: 5px 0 0;" @click="showConfigDialog = true">用户配置</el-button>
|
||||
</div>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<div class="user-detail">
|
||||
<div class="user-header">
|
||||
<el-avatar :size="64" :src="detail.avatar"></el-avatar>
|
||||
<el-row type="flex" class="name-box">
|
||||
<span class="user-name">11</span>
|
||||
<dict-tag :value="detail.type" :options="dict.type.sm_user_type"/>
|
||||
</el-row>
|
||||
<div class="phone-number">{{detail.phonenumber}}</div>
|
||||
</div>
|
||||
|
||||
<!-- <el-row type="flex" style="margin-top: 16px;">-->
|
||||
<!-- <el-statistic title="店铺数" :value="detail.storeCount" :precision="0" suffix="家"/>-->
|
||||
<!-- <el-statistic title="设备数" :value="detail.deviceCount" :precision="0" suffix="台"/>-->
|
||||
<!-- <el-statistic title="账户余额" :value="detail.balance" :precision="2" suffix="元"/>-->
|
||||
<!-- <el-statistic title="总收入" :value="detail.totalIncome" :precision="2" suffix="元"/>-->
|
||||
<!-- <el-statistic title="未入账" :value="detail.waitBonusAmount" :precision="2" suffix="元"/>-->
|
||||
<!-- <el-statistic title="总提现" :value="detail.withDrawlAmount" :precision="2" suffix="元"/>-->
|
||||
<!-- <el-statistic title="总消费" :value="detail.rechargeAmount" :precision="2" suffix="元"/>-->
|
||||
<!-- </el-row>-->
|
||||
|
||||
<div class="user-description">
|
||||
<el-descriptions :column="3">
|
||||
<el-descriptions-item label="充值服务费">
|
||||
{{detail.realServiceRate | money | defaultValue}} %
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="代理服务费">
|
||||
{{detail.agentServiceRate | money | defaultValue}} %
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="提现服务费">
|
||||
<template v-if="detail.withdrawServiceRate == null || detail.withdrawServiceType == null">跟随渠道</template>
|
||||
<template v-else>
|
||||
<dict-tag :options="dict.type.withdraw_service_type" :value="detail.withdrawServiceType" size="mini"/>
|
||||
{{detail.withdrawServiceRate}} {{serviceUnit(detail.withdrawServiceType)}}
|
||||
</template>
|
||||
</el-descriptions-item>
|
||||
<!-- <el-descriptions-item label="实名认证">-->
|
||||
<!-- <boolean-tag :value="detail.isReal" size="small"/>-->
|
||||
<!-- <el-link-->
|
||||
<!-- v-if="detail.isReal"-->
|
||||
<!-- style="margin-left: 4px;"-->
|
||||
<!-- type="primary"-->
|
||||
<!-- size="small"-->
|
||||
<!-- icon="el-icon-link"-->
|
||||
<!-- @click="handleResetRealName"-->
|
||||
<!-- >解除实名</el-link>-->
|
||||
<!-- </el-descriptions-item>-->
|
||||
<el-descriptions-item label="姓名">
|
||||
{{detail.realName | dv}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="身份证">
|
||||
{{detail.realIdCard | dv}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="实名手机">
|
||||
{{detail.realPhone | dv}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="备注" :span="2">{{detail.remark | dv}}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :lg="14" :md="12" :xs="24">
|
||||
<el-card class="box-card">
|
||||
<el-row type="flex">
|
||||
<el-tabs style="width: 100%">
|
||||
<el-tab-pane label="日报表" lazy>
|
||||
<user-daily-recharge-report v-if="detail.userId != null" :query="{arrivalId: detail.userId}"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="月报表" lazy>
|
||||
<user-recharge-report :mch-id="detail.userId"/>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<!-- <el-empty v-else description="用户不存在"/>-->
|
||||
|
||||
<!-- <!–用户设置–>-->
|
||||
<!-- <user-config-dialog :show.sync="showConfigDialog" :user-id="detail.userId" @success="getDetail"/>-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getUser } from '@/api/system/user'
|
||||
import Device from '@/views/system/device/index.vue'
|
||||
// import Withdraw from '@/views/system/withdraw/index.vue'
|
||||
// import UserDailyRechargeReport from '@/views/system/smUser/components/UserDailyRechargeReport.vue'
|
||||
// import UserRechargeReport from '@/views/system/smUser/components/userRechargeReport.vue'
|
||||
// import UserConfigDialog from '@/views/system/smUser/components/UserConfigDialog.vue'
|
||||
// import { BonusArrivalType, SmUserType } from '@/utils/constants'
|
||||
import { $serviceType, $view } from '@/utils/mixins'
|
||||
|
||||
export default {
|
||||
name: 'UserDetail',
|
||||
mixins: [$view, $serviceType],
|
||||
dicts: ['sm_user_type', 'service_type', 'withdraw_service_type'],
|
||||
components: {
|
||||
Device
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
detail: {},
|
||||
loading: false,
|
||||
showConfigDialog: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
serviceUnit() {
|
||||
return (type) => {
|
||||
return type === '2' ? '元' : '%';
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getDetail();
|
||||
},
|
||||
methods: {
|
||||
getDetail() {
|
||||
this.loading = true;
|
||||
getUser(this.$route.params.userId).then(response => {
|
||||
this.detail = response.data;
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.app-container .box-card:nth-child(n + 1) {
|
||||
margin-top: 1em;
|
||||
}
|
||||
.user-name {
|
||||
font-size: 18px;
|
||||
line-height: 30px;
|
||||
vertical-align: center;
|
||||
}
|
||||
.phone-number {
|
||||
font-size: 18px;
|
||||
line-height: 30px;
|
||||
color: #9B9B9B;
|
||||
}
|
||||
.user-header {
|
||||
text-align: center;
|
||||
margin: 0 2em;
|
||||
}
|
||||
.user-header .name-box {
|
||||
margin: 0 auto;
|
||||
width: fit-content;
|
||||
}
|
||||
.user-detail {
|
||||
position: relative;
|
||||
display: flex;
|
||||
height: fit-content;
|
||||
flex-direction: column;
|
||||
}
|
||||
.user-detail .user-description {
|
||||
flex: 1;
|
||||
margin-top: 16px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -37,17 +37,6 @@
|
|||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
style="width: 240px"
|
||||
value-format="yyyy-MM-dd"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
|
|
@ -89,16 +78,6 @@
|
|||
<dict-tag :options="dict.type.ss_user_type" :value="scope.row.userType"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="最后登录时间" align="center" prop="createTime" width="160">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.loginDate) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="注册时间" align="center" prop="createTime" width="160">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" align="center" key="status">
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
|
|
@ -109,6 +88,38 @@
|
|||
></el-switch>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="余额" align="center" prop="balance">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.balance ? '¥' + scope.row.balance : '¥0.00' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="提现金额" align="center" prop="withdrawAmount">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.withdrawAmount ? '¥' + scope.row.withdrawAmount : '¥0.00' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="店铺数" align="center" prop="storeCount">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.storeCount || 0 }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="是否管理员" align="center" prop="isAdmin">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="small" :type="scope.row.isAdmin === 1 ? 'success' : 'info'">
|
||||
{{ scope.row.isAdmin === 1 ? '是' : '否' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="最后登录时间" align="center" prop="createTime" width="160">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.loginDate) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="注册时间" align="center" prop="createTime" width="160">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="操作"
|
||||
align="center"
|
||||
|
|
@ -122,7 +133,7 @@
|
|||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleSee(scope.row)"
|
||||
@click="handleView(scope.row)"
|
||||
v-hasPermi="['system:smUser:detail']"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
|
|
@ -459,6 +470,11 @@ export default {
|
|||
});
|
||||
},
|
||||
methods: {
|
||||
handleView(row){
|
||||
if (row.userId) {
|
||||
this.$router.push(`/user/detail/${row.userId}`);
|
||||
}
|
||||
},
|
||||
handleUpdateRisk(row) {
|
||||
this.row = row;
|
||||
this.showConfigDialog = true;
|
||||
|
|
@ -669,7 +685,6 @@ export default {
|
|||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.operation-btns {
|
||||
display: flex;
|
||||
|
|
@ -699,3 +714,4 @@ export default {
|
|||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user