chuangte/smart-switch-ui
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

抽出设备列表为组件

Browse Source
This commit is contained in:
墨大叔 2024-10-07 18:02:45 +08:00
parent 5219b1507a
commit a3f5bc4281
6 changed files with 396 additions and 137 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

216
src/router/agentRouter.js Normal file
View File

@ -0,0 +1,216 @@
import { mchRoutes } from '@/router/mchRouter'
import Layout from '@/layout/index.vue'
export const agentRoutes = [
{
path: '/business',
component: Layout,
hidden: false,
alwaysShow: true,
meta: {
title: '经营管理',
icon: 'store'
},
children: [
{
path: 'store',
component: () => import('../views/mch/store'),
hidden: false,
name: "MyStore",
meta: {
noCache: false,
title: '我的店铺',
icon: 'store'
}
},
{
path: 'store/:storeId',
component: () => import('../views/mch/store/detail.vue'),
hidden: true,
name: "MyStoreDetail",
meta: {
noCache: false,
title: '店铺详情',
}
},
{
path: 'suit',
component: () => import('@/views/mch/suit/index.vue'),
hidden: false,
name: "MchSuit",
meta: {
noCache: false,
title: '套餐管理',
icon: 'suit',
}
},
]
},
{
path: '/device',
component: Layout,
hidden: false,
alwaysShow: true,
meta: {
title: '设备管理',
icon: 'monitor',
},
children: [
{
path: 'my',
component: () => import('@/views/mch/device'),
hidden: false,
name: "MyDevice",
meta: {
noCache: false,
title: '我的设备',
icon: 'monitor',
}
},
{
path: 'agent',
component: () => import('@/views/mch/device'),
hidden: false,
name: "AgentDevice",
meta: {
noCache: false,
title: '代理设备',
icon: 'monitor',
}
},
{
path: ':deviceId',
component: () => import('@/views/mch/device/detail.vue'),
hidden: true,
name: "MyDeviceDetail",
meta: {
noCache: false,
title: '设备详情',
}
},
]
},
{
path: '/bill',
component: Layout,
hidden: false,
alwaysShow: true,
meta: {
title: '订单管理',
icon: 'shopping'
},
children: [
{
path: 'recharge',
component: () => import('../views/mch/recharge'),
hidden: false,
name: "MchRecharge",
meta: {
noCache: false,
title: '订单列表',
icon: 'shopping'
}
},
// {
// path: 'refund',
// component: () => import('@/views/mch/refund'),
// hidden: false,
// name: "MchRefund",
// meta: {
// noCache: false,
// title: '订单退款',
// icon: 'refund'
// }
// },
{
path: 'recharge/:billId',
component: () => import('@/views/mch/recharge/detail.vue'),
hidden: true,
name: "MchRechargeDetail",
meta: {
noCache: false,
title: '订单详情',
}
},
]
},
{
path: '/money',
component: Layout,
hidden: false,
alwaysShow: true,
meta: {
title: '财务管理',
icon: 'money'
},
children: [
{
path: 'withdraw',
component: () => import('@/views/mch/withdraw/index.vue'),
hidden: false,
name: "MchWithdraw",
meta: {
noCache: false,
title: '提现记录',
icon: 'withdraw'
}
},
{
path: 'recordBalance',
component: () => import('@/views/mch/recordBalance/index.vue'),
hidden: false,
name: "MchRecordBalance",
meta: {
noCache: false,
title: '余额明细',
icon: 'money',
}
},
{
path: 'receiveBill',
component: () => import('@/views/mch/receiveBill/index.vue'),
hidden: false,
name: "MchReceiveBill",
meta: {
noCache: false,
title: '应付账单',
icon: 'withdraw'
}
},
]
},
{
path: '/dev',
component: Layout,
hidden: false,
alwaysShow: true,
meta: {
title: '开发管理',
icon: 'code'
},
children: [
{
path: 'access',
hidden: false,
component: () => import('@/views/mch/access/index.vue'),
name: "MchAccess",
meta: {
noCache: false,
title: '秘钥管理',
icon: 'key',
},
},
{
path: 'doc',
component: () => import('@/views/mch/devDoc/index.vue'),
hidden: false,
name: 'DevDoc',
meta: {
noCache: false,
title: '开发文档',
icon: 'documentation'
},
}
]
},
]

1
src/store/getters.js
View File

@ -9,6 +9,7 @@ const getters = {
avatar: state => state.user.avatar,
name: state => state.user.name,
userType: state => state.user.userType,
smUserType: state => state.user.smUserType,
userId: state => state.user.id,
title: state => state.user.title,
introduction: state => state.user.introduction,

9
src/store/modules/permission.js
View File

@ -6,7 +6,8 @@ import ParentView from '@/components/ParentView'
import InnerLink from '@/layout/components/InnerLink'
import { mchRoutes } from '@/router/mchRouter'
import store from '@/store'
import { UserType } from '@/utils/constants'
import { SmUserType, UserType } from '@/utils/constants'
import { agentRoutes } from '@/router/agentRouter'
const permission = {
state: {
@ -37,7 +38,11 @@ const permission = {
return new Promise(resolve => {
// 商户
if (store.getters.userType === UserType.APP) {
handleRoutes(mchRoutes, mchRoutes, resolve, commit);
if (store.getters.smUserType === SmUserType.AGENT) {
handleRoutes(agentRoutes, agentRoutes, resolve, commit);
} else {
handleRoutes(mchRoutes, mchRoutes, resolve, commit);
}
}
// 管理员
else {

5
src/store/modules/user.js
View File

@ -11,6 +11,7 @@ const user = {
roles: [],
permissions: [],
userType: getUserType(),
smUserType: null,
title: process.env.VUE_APP_TITLE
},
@ -38,6 +39,9 @@ const user = {
},
SET_TITLE: (state, title) => {
state.title = title;
},
SET_SM_USER_TYPE: (state, smUserType) => {
state.smUserType = smUserType;
}
},
@ -95,6 +99,7 @@ const user = {
commit('SET_USER_TYPE', userType)
if (userType === UserType.APP) {
commit('SET_TITLE', "创特物联-商户中心")
commit('SET_SM_USER_TYPE', user.type)
}
resolve(res)
}).catch(error => {

133
src/views/system/device/components/DeviceTable.vue Normal file
View File

@ -0,0 +1,133 @@
<template>
<el-table v-loading="loading" :data="data" v-on="$listeners">
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="设备ID" align="center" prop="deviceId" width="100"/>-->
<el-table-column label="图片" align="center" prop="picture" width="100">
<template slot-scope="scope">
<image-preview v-if="isEmpty(scope.row.customPicture)" :src="scope.row.picture" :width="50" :height="50"/>
<image-preview v-else :src="scope.row.customPicture" :width="50" :height="50"/>
</template>
</el-table-column>
<el-table-column label="二维码" align="center" width="80">
<template slot-scope="d">
<el-popover
placement="top"
width="180"
trigger="hover">
<div class="qr-code-box">
<qr-code :text="qrCodeText(d.row)" :width="150" :height="150" />
<p>扫描二维码进行设备绑定</p>
</div>
<el-button slot="reference" type="text" icon="el-icon-picture">查看</el-button>
</el-popover>
</template>
</el-table-column>
<el-table-column label="MAC-1" align="center" prop="mac" min-width="100">
<device-link slot-scope="d" :text="d.row.mac" :id="d.row.deviceId"/>
</el-table-column>
<el-table-column label="MAC-2" align="center" prop="mac2" min-width="100">
<device-link slot-scope="d" :text="d.row.mac2" :id="d.row.deviceId"/>
</el-table-column>
<el-table-column label="设备SN" align="center" prop="deviceNo" min-width="100">
<template slot-scope="d">
<el-link type="danger" v-if="d.row.deviceNo == null" @click="handleBindSn(d.row)">点击绑定</el-link>
<device-link v-else :text="d.row.deviceNo" :id="d.row.deviceId"/>
</template>
</el-table-column>
<el-table-column label="设备名称" align="center" prop="deviceName" >
<device-link slot-scope="d" :text="d.row.deviceName" :id="d.row.deviceId"/>
</el-table-column>
<el-table-column label="型号" align="center" prop="model" />
<el-table-column label="在线状态" align="center" prop="onlineStatus" width="80">
<template slot-scope="scope">
<dict-tag :options="dict.type.sm_device_online_status" :value="scope.row.onlineStatus"/>
</template>
</el-table-column>
<el-table-column label="状态" align="center" prop="status" width="80">
<template slot-scope="scope">
<dict-tag :options="dict.type.sm_device_status" :value="scope.row.status"/>
</template>
</el-table-column>
<el-table-column label="服务模式" align="center" prop="serviceMode">
<template slot-scope="d">
<dict-tag :options="dict.type.device_service_mode" :value="d.row.serviceMode"/>
</template>
</el-table-column>
<el-table-column label="归属信息" align="center" width="180">
<template slot-scope="d">
<template v-if="d.row.userId != null">
商户:<user-link :id="d.row.userId" :name="d.row.userName"/><br/>
</template>
<template v-if="d.row.storeId != null">
店铺:<store-link :id="d.row.storeId" :name="d.row.storeName"/><br/>
</template>
<template v-if="d.row.agentId != null">
代理:<user-link :id="d.row.agentId" :name="d.row.agentName"/>
</template>
</template>
</el-table-column>
<el-table-column label="服务费" align="center" prop="serviceRate" width="180">
<template slot-scope="d">
<template v-if="d.row.monthFee">
月费：{{d.row.monthFee | money | defaultValue}} 元 / 月 <br/>
</template>
<template v-if="d.row.serviceMode === DeviceServiceMode.DIRECT">
平台：{{d.row.realServiceRate | money | defaultValue}} % <br/>
</template>
<template v-if="d.row.serviceMode === DeviceServiceMode.AGENT">
代理：{{d.row.agentServiceRate | money | defaultValue}} % <br/>
</template>
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remark" show-overflow-tooltip />
<el-table-column label="创建时间" align="center" prop="createTime" width="100"/>
<el-table-column label="到期时间" align="center" prop="rentTime" width="100"/>
<el-table-column label="最后在线" align="center" prop="lastOnlineTime" width="100"/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="200">
<template slot-scope="scope">
<slot :row="scope.row"/>
</template>
</el-table-column>
</el-table>
</template>
<script >
import QrCode from '@/components/QrCode/index.vue'
import StoreLink from '@/components/Business/Store/StoreLink.vue'
import DeviceLink from '@/components/Business/Device/DeviceLink.vue'
import UserLink from '@/components/Business/SmUser/UserLink.vue'
import { isEmpty } from '@/utils'
import { getWxIndexUrl } from '@/utils/wx'
import { DeviceServiceMode } from '@/utils/constants'
export default {
name: "DeviceTable",
components: { UserLink, DeviceLink, StoreLink, QrCode },
dicts: ['sm_device_online_status', 'sm_device_status', 'sm_device_outage_way','sm_device_notice_way', 'service_type', 'time_unit', 'device_service_mode'],
props: {
loading: {
type: Boolean,
default: false
},
data: {
type: Array,
default: () => {
return []
}
},
},
computed: {
DeviceServiceMode() {
return DeviceServiceMode
},
// 二维码文本
qrCodeText() {
return (device) => {
return getWxIndexUrl({ s: device.deviceNo});
}
},
},
methods: {
isEmpty,
}
}
</script>

169
src/views/system/device/index.vue
View File

@ -126,137 +126,41 @@
v-hasPermi="['system:device:export']"
>导出</el-button>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="warning"-->
<!-- plain-->
<!-- icon="el-icon-edit"-->
<!-- size="mini"-->
<!-- @click="handleBatchModel"-->
<!-- :disabled="multiple"-->
<!-- v-hasPermi="['system:device:edit']"-->
<!-- >批量修改型号</el-button>-->
<!-- </el-col>-->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="设备ID" align="center" prop="deviceId" width="100"/>-->
<el-table-column label="图片" align="center" prop="picture" width="100">
<template slot-scope="scope">
<image-preview v-if="isEmpty(scope.row.customPicture)" :src="scope.row.picture" :width="50" :height="50"/>
<image-preview v-else :src="scope.row.customPicture" :width="50" :height="50"/>
</template>
</el-table-column>
<el-table-column label="二维码" align="center" width="80">
<template slot-scope="d">
<el-popover
placement="top"
width="180"
trigger="hover">
<div class="qr-code-box">
<qr-code :text="qrCodeText(d.row)" :width="150" :height="150" />
<p>扫描二维码进行设备绑定</p>
</div>
<el-button slot="reference" type="text" icon="el-icon-picture">查看</el-button>
</el-popover>
</template>
</el-table-column>
<el-table-column label="MAC-1" align="center" prop="mac" min-width="100">
<device-link slot-scope="d" :text="d.row.mac" :id="d.row.deviceId"/>
</el-table-column>
<el-table-column label="MAC-2" align="center" prop="mac2" min-width="100">
<device-link slot-scope="d" :text="d.row.mac2" :id="d.row.deviceId"/>
</el-table-column>
<el-table-column label="设备SN" align="center" prop="deviceNo" min-width="100">
<template slot-scope="d">
<el-link type="danger" v-if="d.row.deviceNo == null" @click="handleBindSn(d.row)">点击绑定</el-link>
<device-link v-else :text="d.row.deviceNo" :id="d.row.deviceId"/>
</template>
</el-table-column>
<el-table-column label="设备名称" align="center" prop="deviceName" >
<device-link slot-scope="d" :text="d.row.deviceName" :id="d.row.deviceId"/>
</el-table-column>
<el-table-column label="型号" align="center" prop="model" />
<el-table-column label="在线状态" align="center" prop="onlineStatus" width="80">
<template slot-scope="scope">
<dict-tag :options="dict.type.sm_device_online_status" :value="scope.row.onlineStatus"/>
</template>
</el-table-column>
<el-table-column label="状态" align="center" prop="status" width="80">
<template slot-scope="scope">
<dict-tag :options="dict.type.sm_device_status" :value="scope.row.status"/>
</template>
</el-table-column>
<el-table-column label="服务模式" align="center" prop="serviceMode">
<template slot-scope="d">
<dict-tag :options="dict.type.device_service_mode" :value="d.row.serviceMode"/>
</template>
</el-table-column>
<el-table-column label="归属信息" align="center" width="180">
<template slot-scope="d">
<template v-if="d.row.userId != null">
商户:<user-link :id="d.row.userId" :name="d.row.userName"/><br/>
</template>
<template v-if="d.row.storeId != null">
店铺:<store-link :id="d.row.storeId" :name="d.row.storeName"/><br/>
</template>
<template v-if="d.row.agentId != null">
代理:<user-link :id="d.row.agentId" :name="d.row.agentName"/>
</template>
</template>
</el-table-column>
<el-table-column label="服务费" align="center" prop="serviceRate" width="180">
<template slot-scope="d">
<template v-if="d.row.monthFee">
月费：{{d.row.monthFee | money | defaultValue}} 元 / 月 <br/>
</template>
<template v-if="d.row.serviceMode === DeviceServiceMode.DIRECT">
平台：{{d.row.realServiceRate | money | defaultValue}} % <br/>
</template>
<template v-if="d.row.serviceMode === DeviceServiceMode.AGENT">
代理：{{d.row.agentServiceRate | money | defaultValue}} % <br/>
</template>
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remark" show-overflow-tooltip />
<el-table-column label="创建时间" align="center" prop="createTime" width="100"/>
<el-table-column label="到期时间" align="center" prop="rentTime" width="100"/>
<el-table-column label="最后在线" align="center" prop="lastOnlineTime" width="100"/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="200">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="handleSee(scope.row)"
v-hasPermi="['system:device:detail']"
>详情</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-refresh"
@click="handleResetService(scope.row)"
v-hasPermi="['system:device:edit']"
>重置服务费</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>
<device-table :data="deviceList" :loading="loading" @selection-change="handleSelectionChange">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="handleSee(scope.row)"
v-hasPermi="['system:device:detail']"
>详情</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-refresh"
@click="handleResetService(scope.row)"
v-hasPermi="['system:device:edit']"
>重置服务费</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>
</device-table>
<pagination
v-show="total>0"
@ -372,11 +276,12 @@ import DeviceLink from '@/components/Business/Device/DeviceLink.vue'
import { $serviceType, $view } from '@/utils/mixins'
import ModelSimpleSelect from '@/components/Business/Model/ModelSimpleSelect.vue'
import { DeviceServiceMode, SmUserType } from '@/utils/constants'
import DeviceTable from '@/views/system/device/components/DeviceTable.vue'
export default {
name: "Device",
mixins: [$serviceType, $view],
components: { ModelSimpleSelect, DeviceLink, StoreLink, UserLink, ModelDialog, UserInput, StoreInput, SnInput, QrCode, SmUserSelect, ModelSelect},
components: { DeviceTable, ModelSimpleSelect, DeviceLink, StoreLink, UserLink, ModelDialog, UserInput, StoreInput, SnInput, QrCode, SmUserSelect, ModelSelect},
dicts: ['sm_device_online_status', 'sm_device_status', 'sm_device_outage_way','sm_device_notice_way', 'service_type', 'time_unit', 'device_service_mode'],
props: {
query: {
@ -468,12 +373,6 @@ export default {
isEdit() {
return this.title === "修改设备";
},
// 二维码文本
qrCodeText() {
return (device) => {
return getWxIndexUrl({ s: device.deviceNo});
}
},
},
created() {
this.queryParams = {