fix(列表页面): 样式优化

This commit is contained in:
Zhunianya
2026-03-26 16:29:32 +08:00
parent 153d643aff
commit 0143280742
25 changed files with 1151 additions and 1131 deletions

View File

@@ -1,6 +1,6 @@
<template> <template>
<div class="category_wrap"> <div class="category_wrap">
<el-card v-show="showSearch" style="margin-bottom: 10px"> <el-card shadow="never" v-show="showSearch" style="margin-bottom: 10px">
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" style="margin-bottom: -20px"> <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" style="margin-bottom: -20px">
<el-form-item :label="$t('product.category.142342-0')" prop="categoryName"> <el-form-item :label="$t('product.category.142342-0')" prop="categoryName">
<el-input v-model="queryParams.categoryName" :placeholder="$t('product.index.091251-3')" clearable size="small" @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.categoryName" :placeholder="$t('product.index.091251-3')" clearable size="small" @keyup.enter.native="handleQuery" />
@@ -12,7 +12,7 @@
</el-form> </el-form>
</el-card> </el-card>
<el-card style="padding-bottom: 100px"> <el-card shadow="never" style="padding-bottom: 100px">
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['iot:category:add']" style="margin-bottom: 10px">{{ $t('add') }}</el-button> <el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['iot:category:add']" style="margin-bottom: 10px">{{ $t('add') }}</el-button>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
<el-table v-loading="loading" :data="categoryList" @selection-change="handleSelectionChange" :border="false" header-cell-class-name="table-header"> <el-table v-loading="loading" :data="categoryList" @selection-change="handleSelectionChange" :border="false" header-cell-class-name="table-header">

View File

@@ -1,6 +1,6 @@
<template> <template>
<div style="padding: 20px"> <div class="device_wrap">
<el-card style="margin-bottom: 15px"> <el-card shadow="never" style="margin-bottom: 10px">
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="75px" style="margin-bottom: -20px"> <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="75px" style="margin-bottom: -20px">
<el-form-item :label="$t('device.index.105953-0')" prop="deviceName"> <el-form-item :label="$t('device.index.105953-0')" prop="deviceName">
<el-input v-model="queryParams.deviceName" :placeholder="$t('device.index.105953-1')" clearable size="small" @keyup.enter.native="handleQuery" style="width: 150px" /> <el-input v-model="queryParams.deviceName" :placeholder="$t('device.index.105953-1')" clearable size="small" @keyup.enter.native="handleQuery" style="width: 150px" />
@@ -18,7 +18,7 @@
<el-option v-for="group in myGroupList" :key="group.groupId" :label="group.groupName" :value="group.groupId" /> <el-option v-for="group in myGroupList" :key="group.groupId" :label="group.groupName" :value="group.groupId" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item style="float: right">
<el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">{{ $t('search') }}</el-button> <el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">{{ $t('search') }}</el-button>
<el-button icon="el-icon-refresh" size="small" @click="resetQuery">{{ $t('reset') }}</el-button> <el-button icon="el-icon-refresh" size="small" @click="resetQuery">{{ $t('reset') }}</el-button>
<el-button type="text" @click="searchChange"> <el-button type="text" @click="searchChange">
@@ -28,14 +28,13 @@
<i style="color: #486ff2; margin-left: 10px" :class="{ 'el-icon-arrow-down': !searchShow, 'el-icon-arrow-up': searchShow }"></i> <i style="color: #486ff2; margin-left: 10px" :class="{ 'el-icon-arrow-down': !searchShow, 'el-icon-arrow-up': searchShow }"></i>
</el-button> </el-button>
</el-form-item> </el-form-item>
<el-form-item style="float: right">
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleEditDevice(0)" v-hasPermi="['iot:device:add']">{{ $t('add') }}</el-button>
<el-button type="primary" plain icon="el-icon-s-grid" size="small" @click="handleChangeShowType" v-hasPermi="['iot:device:add']">{{ $t('device.index.105953-17') }}</el-button>
</el-form-item>
</el-form> </el-form>
</el-card> </el-card>
<el-card style="padding-bottom: 100px" v-if="showType == 'list'"> <el-card shadow="never" style="padding-bottom: 100px">
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleEditDevice(0)" style="margin-bottom: 10px" v-hasPermi="['iot:device:add']">{{ $t('add') }}</el-button>
<el-button type="primary" plain icon="el-icon-s-grid" size="small" @click="handleChangeShowType" v-hasPermi="['iot:device:add']">{{ $t('device.index.105953-17') }}</el-button>
<div v-if="showType == 'list'">
<el-table v-loading="loading" :data="deviceList" :border="false" header-cell-class-name="table-header"> <el-table v-loading="loading" :data="deviceList" :border="false" header-cell-class-name="table-header">
<el-table-column :label="$t('device.index.105953-20')" align="center" header-align="center" prop="deviceId" width="50" /> <el-table-column :label="$t('device.index.105953-20')" align="center" header-align="center" prop="deviceId" width="50" />
<el-table-column :label="$t('device.index.105953-0')" align="center" header-align="center" prop="deviceName" min-width="120" /> <el-table-column :label="$t('device.index.105953-0')" align="center" header-align="center" prop="deviceName" min-width="120" />
@@ -100,7 +99,7 @@
<div class="pagination-container"> <div class="pagination-container">
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" :pageSizes="[12, 24, 36, 60]" @pagination="getList" /> <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" :pageSizes="[12, 24, 36, 60]" @pagination="getList" />
</div> </div>
</el-card> </div>
<div style="padding-bottom: 100px" v-if="showType == 'card'"> <div style="padding-bottom: 100px" v-if="showType == 'card'">
<el-row :gutter="20" v-loading="loading"> <el-row :gutter="20" v-loading="loading">
@@ -186,6 +185,8 @@
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" :pageSizes="[12, 24, 36, 60]" @pagination="getList" /> <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" :pageSizes="[12, 24, 36, 60]" @pagination="getList" />
</div> </div>
</div> </div>
</el-card>
<!-- 二维码 --> <!-- 二维码 -->
<el-dialog :visible.sync="openSummary" width="300px" append-to-body> <el-dialog :visible.sync="openSummary" width="300px" append-to-body>
<div style="border: 1px solid #ccc; width: 220px; text-align: center; margin: 0 auto; margin-top: -15px"> <div style="border: 1px solid #ccc; width: 220px; text-align: center; margin: 0 auto; margin-top: -15px">
@@ -498,8 +499,10 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.card-item { .device_wrap {
border-radius: 15px; padding: 15px;
min-height: 100vh;
background-color: #f5f7fa;
} }
.table-header { .table-header {
@@ -511,7 +514,6 @@ export default {
::v-deep .el-table { ::v-deep .el-table {
th { th {
background-color: #f5f7fa;
color: #606266; color: #606266;
font-weight: 600; font-weight: 600;
text-align: center; text-align: center;
@@ -637,16 +639,4 @@ export default {
} }
} }
} }
.pagination-container {
line-height: 40px;
margin-bottom: 30px;
margin-top: 0;
padding: 0;
}
::v-deep .el-pagination {
padding: 0;
text-align: right;
}
</style> </style>

View File

@@ -1,6 +1,6 @@
<template> <template>
<div class="group_wrap"> <div class="group_wrap">
<el-card v-show="showSearch" style="margin-bottom: 10px"> <el-card shadow="never" v-show="showSearch" style="margin-bottom: 10px">
<el-form ref="queryForm" :model="queryParams" :inline="true" label-width="68px" style="margin-bottom: -20px"> <el-form ref="queryForm" :model="queryParams" :inline="true" label-width="68px" style="margin-bottom: -20px">
<el-form-item :label="$t('iot.group.index.637432-0')" prop="groupName"> <el-form-item :label="$t('iot.group.index.637432-0')" prop="groupName">
<el-input v-model="queryParams.groupName" :placeholder="$t('iot.group.index.637432-1')" clearable size="small" @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.groupName" :placeholder="$t('iot.group.index.637432-1')" clearable size="small" @keyup.enter.native="handleQuery" />
@@ -15,7 +15,7 @@
</el-form> </el-form>
</el-card> </el-card>
<el-card style="padding-bottom: 100px"> <el-card shadow="never" style="padding-bottom: 100px">
<el-button v-hasPermi="['iot:group:add']" type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" style="margin-bottom: 10px">{{ $t('iot.group.index.637432-5') }}</el-button> <el-button v-hasPermi="['iot:group:add']" type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" style="margin-bottom: 10px">{{ $t('iot.group.index.637432-5') }}</el-button>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
<el-table v-loading="loading" :data="groupList" :border="false" @selection-change="handleSelectionChange"> <el-table v-loading="loading" :data="groupList" :border="false" @selection-change="handleSelectionChange">

View File

@@ -1,6 +1,6 @@
<template> <template>
<div class="clients_wrap"> <div class="clients_wrap">
<el-card v-show="showSearch" style="margin-bottom: 10px"> <el-card shadow="never" v-show="showSearch" style="margin-bottom: 10px">
<el-form @submit.native.prevent :model="queryParams" ref="queryForm" :inline="true" label-width="68px" style="margin-bottom: -20px"> <el-form @submit.native.prevent :model="queryParams" ref="queryForm" :inline="true" label-width="68px" style="margin-bottom: -20px">
<el-form-item :label="$t('netty.clients.654908-0')" prop="clientId"> <el-form-item :label="$t('netty.clients.654908-0')" prop="clientId">
<el-input v-model="queryParams.clientId" :placeholder="$t('netty.clients.654908-1')" clearable size="small" @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.clientId" :placeholder="$t('netty.clients.654908-1')" clearable size="small" @keyup.enter.native="handleQuery" />
@@ -15,7 +15,7 @@
</el-form> </el-form>
</el-card> </el-card>
<el-card style="padding-bottom: 100px"> <el-card shadow="never" style="padding-bottom: 100px">
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
<el-table v-loading="loading" :data="clientList" :border="false"> <el-table v-loading="loading" :data="clientList" :border="false">
<el-table-column :label="$t('netty.clients.654908-4')" align="left" header-align="center" prop="clientId"> <el-table-column :label="$t('netty.clients.654908-4')" align="left" header-align="center" prop="clientId">

View File

@@ -36,7 +36,7 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
</el-card> </el-card>
<el-card> <el-card shadow="never">
<el-row :gutter="10" class="mb8" style="margin-bottom: 10px"> <el-row :gutter="10" class="mb8" style="margin-bottom: 10px">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['iot:news:add']">{{ $t('system.sysclient.652154-4') }}</el-button> <el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['iot:news:add']">{{ $t('system.sysclient.652154-4') }}</el-button>

View File

@@ -1,7 +1,7 @@
<template> <template>
<div style="padding:6px;"> <div class="product_wrap">
<el-card style="margin-bottom:5px;"> <el-card shadow="never" style="margin-bottom: 10px; border-radius: 5px">
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" style="margin-bottom:-20px;"> <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" style="margin-bottom: -20px">
<el-form-item :label="$t('product.index.091251-0')" prop="productName"> <el-form-item :label="$t('product.index.091251-0')" prop="productName">
<el-input v-model="queryParams.productName" :placeholder="$t('product.index.091251-1')" clearable size="small" @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.productName" :placeholder="$t('product.index.091251-1')" clearable size="small" @keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item>
@@ -13,84 +13,79 @@
<el-option v-for="dict in dict.type.iot_product_status" :key="dict.value" :label="dict.label" :value="dict.value" /> <el-option v-for="dict in dict.type.iot_product_status" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item style="float: right">
<el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">{{ $t('search') }}</el-button> <el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">{{ $t('search') }}</el-button>
<el-button icon="el-icon-refresh" size="small" @click="resetQuery">{{ $t('reset') }}</el-button> <el-button icon="el-icon-refresh" size="small" @click="resetQuery">{{ $t('reset') }}</el-button>
</el-form-item> </el-form-item>
<el-form-item style="float:right;">
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleEditProduct(0)" v-hasPermi="['iot:product:add']">{{ $t('add') }}</el-button>
</el-form-item>
</el-form> </el-form>
</el-card> </el-card>
<el-card style="padding-bottom:100px;"> <el-card shadow="never" style="border-radius: 5px">
<el-row :gutter="30" v-loading="loading"> <el-button type="primary" plain icon="el-icon-plus" style="margin-bottom: 10px" size="small" @click="handleEditProduct(0)" v-hasPermi="['iot:product:add']">{{ $t('add') }}</el-button>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" v-for="(item,index) in productList" :key="index" style="margin-bottom:30px;text-align:center;"> <el-row :gutter="20" v-loading="loading">
<el-card :body-style="{ padding: '20px'}" shadow="always" class="card-item"> <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" v-for="(item, index) in productList" :key="index" style="margin-bottom: 20px">
<el-row type="flex" :gutter="10" justify="space-between"> <el-card shadow="hover" class="product-card">
<el-col :span="20" style="text-align:left;"> <div class="card-header">
<el-link type="" :underline="false" @click="handleEditProduct(item)" style="font-weight:bold;font-size:16px;line-height:32px;white-space:nowrap;"> <div class="product-name" @click="handleEditProduct(item)">
<svg-icon icon-class="product" /> {{item.productName}} <span>{{ item.productName }}</span>
<el-tag type="info" size="small" style="margin-left:5px;font-weight:200" v-if="item.isSys==1">{{ $t('product.index.091251-47') }}</el-tag> <el-tag type="info" size="mini" style="margin-left: 8px; font-weight: normal" v-if="item.isSys == 1">{{ $t('product.index.091251-47') }}</el-tag>
</el-link> </div>
</el-col> <div class="header-status">
<el-col :span="4"> <dict-tag :options="dict.type.iot_product_status" :value="item.status" size="mini" />
<el-tooltip class="item" effect="dark" :content="$t('product.index.091251-12')" placement="top-start" v-if="item.status==2"> </div>
<el-button type="success" size="small" style="padding:5px;" @click="changeProductStatus(item.productId,1,item.deviceType)">{{ $t('product.index.091251-13') }}</el-button> </div>
</el-tooltip>
<el-tooltip class="item" effect="dark" :content="$t('product.index.091251-14')" placement="top-start" v-if="item.status==1"> <div class="card-time">
<el-button type="info" size="small" style="padding:5px;" @click="changeProductStatus(item.productId,2,item.deviceType)">{{ $t('product.index.091251-15') }}</el-button> {{ parseTime(item.createTime, '{y}-{m}-{d} {h}:{i}:{s}') }}
</el-tooltip> </div>
</el-col>
</el-row> <div class="card-info">
<el-row :gutter="10"> <div class="info-row">
<el-col :span="14"> <span class="info-value">{{ $t('product.index.091251-16') }}{{ item.categoryName }}</span>
<el-descriptions :column="1" size="small" style="margin-top:10px;white-space:nowrap;"> </div>
<el-descriptions-item :label="$t('product.index.091251-16')"> <div class="info-row">
<el-link type="primary" :underline="false">{{item.categoryName}}</el-link> <span class="info-value" style="display: flex">
</el-descriptions-item> {{ $t('product.index.091251-17') }}
<el-descriptions-item :label="$t('product.index.091251-17')"> <dict-tag :options="dict.type.iot_device_type" :value="item.deviceType" size="mini" />
<dict-tag :options="dict.type.iot_device_type" :value="item.deviceType" /> </span>
</el-descriptions-item> </div>
<el-descriptions-item :label="$t('product.index.091251-18')"> <div class="info-row">
<dict-tag :options="dict.type.iot_network_method" :value="item.networkMethod" /> <span class="info-value" style="display: flex">
</el-descriptions-item> {{ $t('product.index.091251-18') }}
<el-descriptions-item :label="$t('product.index.091251-19')"> <dict-tag :options="dict.type.iot_network_method" :value="item.networkMethod" size="mini" />
<el-tag type="success" size="small" v-if="item.isAuthorize==1">{{ $t('product.index.091251-20') }}</el-tag> </span>
<el-tag type="info" size="small" v-else>{{ $t('product.index.091251-21') }}</el-tag> </div>
</el-descriptions-item> <div class="info-row">
</el-descriptions> <span class="info-value">
</el-col> {{ $t('product.index.091251-19') }}
<el-col :span="10"> <el-tag type="success" size="mini" v-if="item.isAuthorize == 1">{{ $t('product.index.091251-20') }}</el-tag>
<div style="margin-top:10px;"> <el-tag type="info" size="mini" v-else>{{ $t('product.index.091251-21') }}</el-tag>
<el-image style="width:100%;height:100px;border-radius:10px;" lazy :preview-src-list="[baseUrl+item.imgUrl]" :src="baseUrl+item.imgUrl" fit="cover" v-if="item.imgUrl!=null && item.imgUrl!=''"></el-image> </span>
<el-image style="width:100%;height:100px;border-radius:10px;" :preview-src-list="[require('@/assets/images/gateway.png')]" :src="require('@/assets/images/gateway.png')" fit="cover" v-else-if="item.deviceType==2"></el-image> </div>
<el-image style="width:100%;height:100px;border-radius:10px;" :preview-src-list="[require('@/assets/images/video.png')]" :src="require('@/assets/images/video.png')" fit="cover" v-else-if="item.deviceType==3"></el-image> </div>
<el-image style="width:100%;height:100px;border-radius:10px;" :preview-src-list="[require('@/assets/images/product.png')]" :src="require('@/assets/images/product.png')" fit="cover" v-else></el-image>
<div class="card-footer">
<div class="footer-left"></div>
<div class="footer-actions">
<i class="el-icon-edit-outline" @click="handleEditProduct(item)" :title="$t('product.index.091251-48')"></i>
<i class="el-icon-view" @click="handleViewDevice(item.productId)" :title="$t('product.index.091251-24')"></i>
<i class="el-icon-delete" @click="handleDelete(item)" v-if="item.status == 1" :title="$t('product.index.091251-23')"></i>
<i class="el-icon-s-check" @click="handleDeviceAuthorize(item)" v-if="item.status == 2" :title="$t('product.index.091251-19')"></i>
</div>
</div> </div>
</el-col>
</el-row>
<el-button-group style="margin-top:15px;height:28px;">
<el-button size="small" type="primary" icon="el-icon-view" @click="handleEditProduct(item)" v-hasPermi="['iot:product:query']">{{ $t('product.index.091251-48') }}</el-button>
<el-button size="small" type="danger" icon="el-icon-delete" @click="handleDelete(item)" v-hasPermi="['iot:product:remove']" v-if="item.status==1">{{ $t('product.index.091251-23') }}</el-button>
<el-button size="small" type="success" icon="el-icon-s-check" @click="handleDeviceAuthorize(item)" v-hasPermi="['iot:product:edit']" v-if="item.status==2" :disabled="item.isAuthorize!=1">{{ $t('product.index.091251-19') }}</el-button>
<el-button size="small" type="warning" icon="el-icon-search" @click="handleViewDevice(item.productId)" v-hasPermi="['iot:device:query']">{{ $t('product.index.091251-24') }}</el-button>
</el-button-group>
</el-card> </el-card>
</el-col> </el-col>
</el-row> </el-row>
<el-empty :description="$t('product.index.091251-25')" v-if="total==0"></el-empty> <el-empty :description="$t('product.index.091251-25')" v-if="total == 0"></el-empty>
<div class="pagination-container"> <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" :pageSizes="[12, 24, 36, 60]" @pagination="getList" />
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" :pageSizes="[12, 24, 36, 60]" @pagination="getList" />
</div>
<!-- 下载SDK --> <!-- 下载SDK -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-link type="danger" style="padding-left:10px;" :underline="false">{{ $t('product.index.091251-26') }}</el-link> <el-link type="danger" style="padding-left: 10px" :underline="false">{{ $t('product.index.091251-26') }}</el-link>
<el-form label-width="80px"> <el-form label-width="80px">
<el-form-item :label="$t('product.index.091251-27')"> <el-form-item :label="$t('product.index.091251-27')">
<el-radio-group v-model="form.datatype"> <el-radio-group v-model="form.datatype">
<el-radio v-for="dict in dict.type.iot_device_chip" :key="dict.value" :label="dict.value" style="margin-top:15px;width:160px;">{{dict.label}}</el-radio> <el-radio v-for="dict in dict.type.iot_device_chip" :key="dict.value" :label="dict.value" style="margin-top: 15px; width: 160px">{{ dict.label }}</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
</el-form> </el-form>
@@ -99,25 +94,21 @@
<el-button @click="cancel">{{ $t('product.index.091251-29') }}</el-button> <el-button @click="cancel">{{ $t('product.index.091251-29') }}</el-button>
</div> </div>
</el-dialog> </el-dialog>
</el-card> </el-card>
</div> </div>
</template> </template>
<script> <script>
import { import { listProduct, delProduct, changeProductStatus, deviceCount } from '@/api/iot/product';
listProduct,
delProduct,
changeProductStatus,
deviceCount,
} from "@/api/iot/product";
import { import { checkPermi } from '@/utils/permission';
checkPermi import RightToolbar from '@/components/RightToolbar';
} from "@/utils/permission"
export default { export default {
name: "Product", name: 'Product',
components: {
RightToolbar,
},
dicts: ['iot_yes_no', 'iot_product_status', 'iot_device_type', 'iot_network_method', 'iot_vertificate_method', 'iot_device_chip'], dicts: ['iot_yes_no', 'iot_product_status', 'iot_device_type', 'iot_network_method', 'iot_vertificate_method', 'iot_device_chip'],
data() { data() {
return { return {
@@ -128,7 +119,7 @@ export default {
// 产品表格数据 // 产品表格数据
productList: [], productList: [],
// 弹出层标题 // 弹出层标题
title: "", title: '',
// 是否显示弹出层 // 是否显示弹出层
open: false, open: false,
// 查询参数 // 查询参数
@@ -148,6 +139,8 @@ export default {
// 表单参数 // 表单参数
form: {}, form: {},
baseUrl: process.env.VUE_APP_BASE_API, baseUrl: process.env.VUE_APP_BASE_API,
// 显示搜索条件
showSearch: true,
}; };
}, },
created() { created() {
@@ -165,7 +158,7 @@ export default {
/** 查询产品列表 */ /** 查询产品列表 */
getList() { getList() {
this.loading = true; this.loading = true;
listProduct(this.queryParams).then(response => { listProduct(this.queryParams).then((response) => {
this.productList = response.rows; this.productList = response.rows;
this.total = response.total; this.total = response.total;
this.loading = false; this.loading = false;
@@ -174,12 +167,14 @@ export default {
/**同步获取产品下的设备数量**/ /**同步获取产品下的设备数量**/
getDeviceCountByProductId(productId) { getDeviceCountByProductId(productId) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
deviceCount(productId).then(res => { deviceCount(productId)
.then((res) => {
resolve(res); resolve(res);
}).catch(error => { })
.catch((error) => {
reject(error); reject(error);
}) });
}) });
}, },
/** 更新产品状态 */ /** 更新产品状态 */
async changeProductStatus(productId, status, deviceType) { async changeProductStatus(productId, status, deviceType) {
@@ -207,17 +202,21 @@ export default {
this.$confirm(message, this.$t('product.index.091251-34'), { this.$confirm(message, this.$t('product.index.091251-34'), {
confirmButtonText: this.$t('product.index.091251-35'), confirmButtonText: this.$t('product.index.091251-35'),
cancelButtonText: this.$t('cancel'), cancelButtonText: this.$t('cancel'),
type: 'warning' type: 'warning',
}).then(() => { })
.then(() => {
let data = {}; let data = {};
data.productId = productId; data.productId = productId;
data.status = status; data.status = status;
data.deviceType = deviceType; data.deviceType = deviceType;
changeProductStatus(data).then(response => { changeProductStatus(data)
.then((response) => {
this.getList(); this.getList();
this.$modal.alertSuccess(response.msg); this.$modal.alertSuccess(response.msg);
}).catch(() => {}); })
}).catch(() => {}); .catch(() => {});
})
.catch(() => {});
}, },
/** 查看设备按钮操作 */ /** 查看设备按钮操作 */
handleViewDevice(productId) { handleViewDevice(productId) {
@@ -226,7 +225,7 @@ export default {
query: { query: {
t: Date.now(), t: Date.now(),
productId: productId, productId: productId,
} },
}); });
}, },
// 取消按钮 // 取消按钮
@@ -242,63 +241,181 @@ export default {
}, },
/** 重置按钮操作 */ /** 重置按钮操作 */
resetQuery() { resetQuery() {
this.resetForm("queryForm"); this.resetForm('queryForm');
this.handleQuery(); this.handleQuery();
}, },
/** 生成SDK */ /** 生成SDK */
handleGeneratorSDK(row) { handleGeneratorSDK(row) {
this.title = this.$t('product.index.091251-38') this.title = this.$t('product.index.091251-38');
this.open = true; this.open = true;
}, },
/** 下载SDK */ /** 下载SDK */
downloadSdk() { downloadSdk() {
this.$download.zip("/iot/tool/genSdk?deviceChip=" + 1, "fastbee-sdk"); this.$download.zip('/iot/tool/genSdk?deviceChip=' + 1, 'fastbee-sdk');
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { handleDelete(row) {
const productIds = row.productId || this.ids; const productIds = row.productId || this.ids;
let msg = ""; let msg = '';
this.$modal.confirm(this.$i18n.t('product.index.091251-39', [productIds])).then(function () { this.$modal
.confirm(this.$i18n.t('product.index.091251-39', [productIds]))
.then(function () {
// // 删除SIP配置 // // 删除SIP配置
// delSipconfigByProductId(productIds).then(response => {}); // delSipconfigByProductId(productIds).then(response => {});
return delProduct(productIds); return delProduct(productIds);
}).then(() => { })
.then(() => {
this.getList(); this.getList();
this.$modal.msgSuccess(msg); this.$modal.msgSuccess(msg);
}).catch(() => {}); })
.catch(() => {});
}, },
/** 修改按钮操作 */ /** 修改按钮操作 */
handleEditProduct(row) { handleEditProduct(row) {
let productId = 0; let productId = 0;
if (row != 0) { if (row != 0) {
productId = row.productId || this.ids productId = row.productId || this.ids;
} }
this.$router.push({ this.$router.push({
path: '/iot/product-edit', path: '/iot/product-edit',
query: { query: {
productId: productId, productId: productId,
pageNum: this.queryParams.pageNum pageNum: this.queryParams.pageNum,
} },
}); });
}, },
/** 设备授权操作 */ /** 设备授权操作 */
handleDeviceAuthorize(row) { handleDeviceAuthorize(row) {
let productId = row.productId let productId = row.productId;
this.$router.push({ this.$router.push({
path: '/iot/product-edit', path: '/iot/product-edit',
query: { query: {
productId: productId, productId: productId,
tabPanelName: 'productAuthorize', tabPanelName: 'productAuthorize',
pageNum: this.queryParams.pageNum pageNum: this.queryParams.pageNum,
} },
}); });
}, },
} },
}; };
</script> </script>
<style scoped> <style lang="scss" scoped>
.card-item { .product_wrap {
border-radius: 15px; padding: 15px;
min-height: 100vh;
background-color: #f5f7fa !important;
.toolbar {
margin-bottom: 15px;
display: flex;
justify-content: space-between;
align-items: center;
}
}
.product-card {
border-radius: 8px;
// transition: all 0.3s;
&:hover {
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
border-color: #409eff;
}
.card-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 12px;
.product-name {
cursor: pointer;
font-weight: 600;
font-size: 15px;
color: #303133;
display: flex;
align-items: center;
&:hover {
color: #409eff;
}
}
.header-status {
flex-shrink: 0;
}
}
.card-time {
font-size: 12px;
color: #909399;
margin-bottom: 16px;
}
.card-info {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
margin-bottom: 16px;
.info-row {
display: flex;
flex-direction: column;
.info-label {
font-size: 12px;
color: #909399;
margin-bottom: 4px;
}
.info-value {
font-size: 13px;
color: #606266;
}
}
}
.card-footer {
display: flex;
justify-content: space-between;
align-items: center;
border-top: 1px solid #f0f0f0;
padding-top: 12px;
.footer-left {
i {
font-size: 18px;
color: #606266;
cursor: pointer;
transition: all 0.3s;
&:hover {
color: #409eff;
}
}
}
.footer-actions {
display: flex;
align-items: center;
gap: 12px;
i {
font-size: 18px;
color: #606266;
cursor: pointer;
transition: all 0.3s;
&:hover {
color: #409eff;
}
&.el-icon-delete:hover {
color: #f56c6c;
}
}
}
}
} }
</style> </style>

View File

@@ -1,8 +1,11 @@
<template> <template>
<el-card style="margin:6px;padding-bottom:100px;"> <el-card style="margin: 6px; padding-bottom: 100px">
<el-tabs v-model="activeName" tab-position="left" style="padding:10px;min-height:400px;" @tab-click="tabChange"> <el-tabs v-model="activeName" tab-position="left" style="padding: 10px; min-height: 400px" @tab-click="tabChange">
<el-tab-pane name="basic"> <el-tab-pane name="basic">
<span slot="label"><span style="color:red;">* </span>{{ $t('product.product-edit.473153-0') }}</span> <span slot="label">
<span style="color: red">*</span>
{{ $t('product.product-edit.473153-0') }}
</span>
<el-form ref="form" :model="form" :rules="rules" label-width="100px"> <el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-row :gutter="100"> <el-row :gutter="100">
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8"> <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
@@ -10,124 +13,122 @@
<el-input v-model="form.productName" :placeholder="$t('product.product-edit.473153-2')" :readonly="form.status == 2" /> <el-input v-model="form.productName" :placeholder="$t('product.product-edit.473153-2')" :readonly="form.status == 2" />
</el-form-item> </el-form-item>
<el-form-item :label="$t('product.product-edit.473153-3')" prop="categoryId"> <el-form-item :label="$t('product.product-edit.473153-3')" prop="categoryId">
<el-select v-model="form.categoryId" :placeholder="$t('product.product-edit.473153-4')" @change="selectCategory" <el-select v-model="form.categoryId" :placeholder="$t('product.product-edit.473153-4')" @change="selectCategory" style="width: 100%" :disabled="form.status == 2">
style="width:100%" :disabled="form.status == 2"> <el-option v-for="category in categoryShortList" :key="category.id" :label="category.name" :value="category.id"></el-option>
<el-option v-for="category in categoryShortList" :key="category.id"
:label="category.name" :value="category.id"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item :label="$t('product.product-edit.473153-78')" prop="deviceType"> <el-form-item :label="$t('product.product-edit.473153-78')" prop="deviceType">
<el-select v-model="form.deviceType" :placeholder="$t('product.product-edit.473153-98')" @change="deviceTypeChange" :disabled="form.status == 2" <el-select v-model="form.deviceType" :placeholder="$t('product.product-edit.473153-98')" @change="deviceTypeChange" :disabled="form.status == 2" style="width: 100%">
style="width:100%"> <el-option v-for="dict in dict.type.iot_device_type" :key="dict.value" :label="dict.label" :value="Number(dict.value)"></el-option>
<el-option v-for="dict in dict.type.iot_device_type" :key="dict.value"
:label="dict.label" :value="parseInt(dict.value)"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item :label="$t('product.product-edit.473153-14')" prop="transport"> <el-form-item :label="$t('product.product-edit.473153-14')" prop="transport">
<el-select v-model="form.transport" :placeholder="$t('product.product-edit.473153-15')" style="width: 100%" <el-select v-model="form.transport" :placeholder="$t('product.product-edit.473153-15')" style="width: 100%" :disabled="true">
:disabled="true"> <el-option v-for="dict in dict.type.iot_transport_type" :key="dict.value" :label="dict.label" :value="dict.value" />
<el-option v-for="dict in dict.type.iot_transport_type" :key="dict.value"
:label="dict.label" :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item :label="$t('product.product-edit.473153-97')" prop="protocolCode"> <el-form-item :label="$t('product.product-edit.473153-97')" prop="protocolCode">
<el-select v-model="form.protocolCode" :placeholder="$t('product.product-edit.473153-4')" style="width: 100%" <el-select v-model="form.protocolCode" :placeholder="$t('product.product-edit.473153-4')" style="width: 100%" :disabled="form.status == 2" @change="changeProductCode">
:disabled="form.status == 2" @change="changeProductCode"> <el-option v-for="p in protocolList" :key="p.protocolCode" :label="p.protocolName" :value="p.protocolCode" />
<el-option v-for="p in protocolList" :key="p.protocolCode" :label="p.protocolName"
:value="p.protocolCode" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item :label="$t('product.product-edit.473153-16')" prop="networkMethod"> <el-form-item :label="$t('product.product-edit.473153-16')" prop="networkMethod">
<el-select v-model="form.networkMethod" :placeholder="$t('product.product-edit.473153-17')" style="width:100%;" <el-select v-model="form.networkMethod" :placeholder="$t('product.product-edit.473153-17')" style="width: 100%" :disabled="form.status == 2">
:disabled="form.status == 2"> <el-option v-for="dict in dict.type.iot_network_method" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
<el-option v-for="dict in dict.type.iot_network_method" :key="dict.value"
:label="dict.label" :value="parseInt(dict.value)"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item :label="$t('product.product-edit.473153-32')" prop="remark"> <el-form-item :label="$t('product.product-edit.473153-32')" prop="remark">
<el-input v-model="form.remark" type="textarea" :placeholder="$t('product.product-edit.473153-33')" rows="3" <el-input v-model="form.remark" type="textarea" :placeholder="$t('product.product-edit.473153-33')" rows="3" :readonly="form.status == 2" />
:readonly="form.status == 2" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8"> <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
<el-form-item :label="$t('product.product-edit.473153-96')" prop="networkMethod"> <el-form-item :label="$t('product.product-edit.473153-96')" prop="networkMethod">
<el-switch v-model="form.isAuthorize" @change="changeIsAuthorize(form.isAuthorize)" <el-switch v-model="form.isAuthorize" @change="changeIsAuthorize(form.isAuthorize)" :active-value="1" :inactive-value="0" :disabled="form.status == 2 || form.deviceType == 3" />
:active-value="1" :inactive-value="0"
:disabled="form.status == 2 || form.deviceType == 3" />
</el-form-item> </el-form-item>
<el-form-item :label="$t('product.product-edit.473153-21')" prop="vertificateMethod"> <el-form-item :label="$t('product.product-edit.473153-21')" prop="vertificateMethod">
<el-select v-model="form.vertificateMethod" :placeholder="$t('product.product-edit.473153-22')" style="width:100%" <el-select v-model="form.vertificateMethod" :placeholder="$t('product.product-edit.473153-22')" style="width: 100%" :disabled="form.status == 2 || form.deviceType == 3">
:disabled="form.status == 2 || form.deviceType == 3"> <el-option v-for="dict in dict.type.iot_vertificate_method" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
<el-option v-for="dict in dict.type.iot_vertificate_method" :key="dict.value"
:label="dict.label" :value="parseInt(dict.value)"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item :label="$t('product.product-edit.473153-25')" prop="productId"> <el-form-item :label="$t('product.product-edit.473153-25')" prop="productId">
<el-input v-model="form.productId" :placeholder="$t('product.product-edit.473153-26')" <el-input v-model="form.productId" :placeholder="$t('product.product-edit.473153-26')" :disabled="!form.mqttAccount || form.deviceType == 3" readonly />
:disabled="!form.mqttAccount || form.deviceType == 3" readonly />
</el-form-item> </el-form-item>
<el-form-item :label="$t('product.product-edit.473153-27')" prop="mqttAccount"> <el-form-item :label="$t('product.product-edit.473153-27')" prop="mqttAccount">
<el-input v-model="form.mqttAccount" :placeholder="$t('product.product-edit.473153-28')" :disabled="form.deviceType == 3" <el-input
:readonly="accountInputType == 'password'" :type="accountInputType"> v-model="form.mqttAccount"
<el-button slot="append" icon="el-icon-view" style="font-size:18px;" :placeholder="$t('product.product-edit.473153-28')"
@click="changeInputType('account')"></el-button> :disabled="form.deviceType == 3"
:readonly="accountInputType == 'password'"
:type="accountInputType"
>
<el-button slot="append" icon="el-icon-view" style="font-size: 18px" @click="changeInputType('account')"></el-button>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item :label="$t('product.product-edit.473153-29')" prop="mqttPassword"> <el-form-item :label="$t('product.product-edit.473153-29')" prop="mqttPassword">
<el-input v-model="form.mqttPassword" :placeholder="$t('product.product-edit.473153-30')" :disabled="form.deviceType == 3" <el-input
:readonly="passwordInputType == 'password'" :type="passwordInputType"> v-model="form.mqttPassword"
<el-button slot="append" icon="el-icon-view" style="font-size:18px;" :placeholder="$t('product.product-edit.473153-30')"
@click="changeInputType('password')"></el-button> :disabled="form.deviceType == 3"
:readonly="passwordInputType == 'password'"
:type="passwordInputType"
>
<el-button slot="append" icon="el-icon-view" style="font-size: 18px" @click="changeInputType('password')"></el-button>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item :label="$t('product.product-edit.473153-31')" prop="mqttSecret"> <el-form-item :label="$t('product.product-edit.473153-31')" prop="mqttSecret">
<el-input v-model="form.mqttSecret" :placeholder="$t('product.product-edit.473153-26')" <el-input v-model="form.mqttSecret" :placeholder="$t('product.product-edit.473153-26')" :disabled="!form.mqttAccount || form.deviceType == 3" readonly :type="keyInputType">
:disabled="!form.mqttAccount || form.deviceType == 3" readonly :type="keyInputType"> <el-button slot="append" icon="el-icon-view" style="font-size: 18px" @click="changeInputType('key')"></el-button>
<el-button slot="append" icon="el-icon-view" style="font-size:18px;"
@click="changeInputType('key')"></el-button>
</el-input> </el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8"> <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
<el-form-item :label="$t('product.product-edit.473153-34')"> <el-form-item :label="$t('product.product-edit.473153-34')">
<div v-if="form.status == 2 && form.imgUrl == null"> <div v-if="form.status == 2 && form.imgUrl == null">
<el-image style="height:145px;height:145px;border-radius:10px;" <el-image
style="height: 145px; height: 145px; border-radius: 10px"
:preview-src-list="[require('@/assets/images/gateway.png')]" :preview-src-list="[require('@/assets/images/gateway.png')]"
:src="require('@/assets/images/gateway.png')" fit="cover" :src="require('@/assets/images/gateway.png')"
v-if="form.deviceType == 2"></el-image> fit="cover"
<el-image style="height:145px;height:145px;border-radius:10px;" v-if="form.deviceType == 2"
></el-image>
<el-image
style="height: 145px; height: 145px; border-radius: 10px"
:preview-src-list="[require('@/assets/images/video.png')]" :preview-src-list="[require('@/assets/images/video.png')]"
:src="require('@/assets/images/video.png')" fit="cover" :src="require('@/assets/images/video.png')"
v-else-if="form.deviceType == 3"></el-image> fit="cover"
<el-image style="height:145px;height:145px;border-radius:10px;" v-else-if="form.deviceType == 3"
></el-image>
<el-image
style="height: 145px; height: 145px; border-radius: 10px"
:preview-src-list="[require('@/assets/images/product.png')]" :preview-src-list="[require('@/assets/images/product.png')]"
:src="require('@/assets/images/product.png')" fit="cover" v-else></el-image> :src="require('@/assets/images/product.png')"
fit="cover"
v-else
></el-image>
</div> </div>
<div v-else> <div v-else>
<imageUpload ref="image-upload" :disabled="true" :value="form.imgUrl" <imageUpload ref="image-upload" :disabled="true" :value="form.imgUrl" :limit="form.status == 2 ? 0 : 1" :fileSize="1" @input="getImagePath($event)"></imageUpload>
:limit="form.status == 2 ? 0 : 1" :fileSize="1" @input="getImagePath($event)">
</imageUpload>
</div> </div>
<div class="el-upload__tip" style="color:#f56c6c" <div class="el-upload__tip" style="color: #f56c6c" v-if="form.productId == null || form.productId == 0">{{ $t('product.product-edit.473153-35') }}</div>
v-if="form.productId == null || form.productId == 0">{{ $t('product.product-edit.473153-35') }}</div>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-col :span="20"> <el-col :span="20">
<el-form-item style="text-align: center;margin:40px 0px;"> <el-form-item style="text-align: center; margin: 40px 0px">
<el-button type="primary" @click="submitForm" v-hasPermi="['iot:product:edit']" <el-button type="primary" @click="submitForm" v-hasPermi="['iot:product:edit']" v-show="form.productId != 0 && form.status != 2">{{ $t('product.product-edit.473153-36') }}</el-button>
v-show="form.productId != 0 && form.status != 2">{{ $t('product.product-edit.473153-36') }}</el-button> <el-button type="primary" @click="submitForm" v-hasPermi="['iot:product:add']" v-show="form.productId == 0 && form.status != 2">{{ $t('product.product-edit.473153-37') }}</el-button>
<el-button type="primary" @click="submitForm" v-hasPermi="['iot:product:add']"
v-show="form.productId == 0 && form.status != 2">{{ $t('product.product-edit.473153-37') }}</el-button>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-form> </el-form>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="" name="things" :disabled="form.productId == 0"> <el-tab-pane label="" name="things" :disabled="form.productId == 0">
<span slot="label"><span style="color:red;">* </span>{{ $t('product.product-edit.473153-38') }}</span> <span slot="label">
<span style="color: red">*</span>
{{ $t('product.product-edit.473153-38') }}
</span>
<product-things-model ref="productThingsModel" :product="form" /> <product-things-model ref="productThingsModel" :product="form" />
</el-tab-pane> </el-tab-pane>
@@ -143,26 +144,23 @@
<div style="margin-top: 200px"></div> <div style="margin-top: 200px"></div>
<div style="margin-top: 200px"></div>
<div style="margin-top:200px;"></div>
<!-- 用于设置间距 --> <!-- 用于设置间距 -->
<el-tab-pane> <el-tab-pane>
<span slot="label"> <span slot="label">
<div style="margin-top:200px;"></div> <div style="margin-top: 200px"></div>
</span> </span>
</el-tab-pane> </el-tab-pane>
<el-tab-pane v-if="form.status == 1" name="product04" disabled> <el-tab-pane v-if="form.status == 1" name="product04" disabled>
<span slot="label"> <span slot="label">
<el-button type="success" size="mini" @click="changeProductStatus(2)" <el-button type="success" size="mini" @click="changeProductStatus(2)" v-hasPermi="['iot:product:add']">{{ $t('product.product-edit.473153-86') }}</el-button>
v-hasPermi="['iot:product:add']">{{ $t('product.product-edit.473153-86') }}</el-button>
</span> </span>
</el-tab-pane> </el-tab-pane>
<el-tab-pane v-if="form.status == 2" name="product05" disabled> <el-tab-pane v-if="form.status == 2" name="product05" disabled>
<span slot="label"> <span slot="label">
<el-button type="danger" size="mini" @click="changeProductStatus(1)" <el-button type="danger" size="mini" @click="changeProductStatus(1)" v-hasPermi="['iot:product:edit']">{{ $t('product.product-edit.473153-87') }}</el-button>
v-hasPermi="['iot:product:edit']">{{ $t('product.product-edit.473153-87') }}</el-button>
</span> </span>
</el-tab-pane> </el-tab-pane>
<el-tab-pane name="product06" disabled> <el-tab-pane name="product06" disabled>
@@ -171,37 +169,24 @@
</span> </span>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</el-card> </el-card>
</template> </template>
<script> <script>
import productThingsModel from "./product-things-model"; import productThingsModel from './product-things-model';
import productApp from "./product-app"; import productApp from './product-app';
import productAuthorize from "./product-authorize"; import productAuthorize from './product-authorize';
import imageUpload from "../../../components/ImageUpload/index"; import imageUpload from '../../../components/ImageUpload/index';
import configSip from '../sip/sipconfig.vue'; import configSip from '../sip/sipconfig.vue';
import { import { listProtocol } from '@/api/iot/protocol';
listProtocol
} from "@/api/iot/protocol";
import { import { listShortCategory } from '@/api/iot/category';
listShortCategory, import { getProduct, addProduct, updateProduct, changeProductStatus, deviceCount } from '@/api/iot/product';
} from "@/api/iot/category";
import {
getProduct,
addProduct,
updateProduct,
changeProductStatus,
deviceCount,
} from "@/api/iot/product";
import { import { getAllPoints } from '@/api/iot/template';
getAllPoints
} from "@/api/iot/template";
export default { export default {
name: "ProductEdit", name: 'ProductEdit',
dicts: ['iot_device_type', 'iot_network_method', 'iot_vertificate_method', 'iot_transport_type', 'data_collect_type'], dicts: ['iot_device_type', 'iot_network_method', 'iot_vertificate_method', 'iot_transport_type', 'data_collect_type'],
components: { components: {
productThingsModel, productThingsModel,
@@ -213,9 +198,9 @@ export default {
data() { data() {
return { return {
// 输入框类型 // 输入框类型
keyInputType: "password", keyInputType: 'password',
accountInputType: "password", accountInputType: 'password',
passwordInputType: "password", passwordInputType: 'password',
// 选中选项卡 // 选中选项卡
activeName: 'basic', activeName: 'basic',
// 分类短列表 // 分类短列表
@@ -228,16 +213,16 @@ export default {
deviceType: 1, deviceType: 1,
vertificateMethod: 3, vertificateMethod: 3,
transport: 'MQTT', transport: 'MQTT',
imgUrl: "", imgUrl: '',
protocolCode: "JSON", protocolCode: 'JSON',
}, },
// 表单校验 // 表单校验
rules: { rules: {
productName: [{ productName: [
{
required: true, required: true,
message: this.$t('product.product-edit.473153-58'), message: this.$t('product.product-edit.473153-58'),
trigger: "blur", trigger: 'blur',
}, },
{ {
min: 1, min: 1,
@@ -246,26 +231,34 @@ export default {
trigger: 'blur', trigger: 'blur',
}, },
], ],
categoryId: [{ categoryId: [
{
required: true, required: true,
message: this.$t('product.product-edit.473153-59'), message: this.$t('product.product-edit.473153-59'),
trigger: "blur" trigger: 'blur',
}], },
deviceType: [{ ],
deviceType: [
{
required: true, required: true,
message: this.$t('product.product-edit.473153-98'), message: this.$t('product.product-edit.473153-98'),
trigger: "blur" trigger: 'blur',
}], },
protocolCode: [{ ],
protocolCode: [
{
required: true, required: true,
message: this.$t('product.product-edit.473153-60'), message: this.$t('product.product-edit.473153-60'),
trigger: "blur" trigger: 'blur',
}], },
transport: [{ ],
transport: [
{
required: true, required: true,
message: this.$t('product.product-edit.473153-61'), message: this.$t('product.product-edit.473153-61'),
trigger: 'blur' trigger: 'blur',
}] },
],
}, },
// 查询参数 // 查询参数
queryParams: { queryParams: {
@@ -274,7 +267,7 @@ export default {
pointList: [], pointList: [],
open: false, open: false,
// 弹出层标题 // 弹出层标题
title: "", title: '',
loading: true, loading: true,
tempList: [], tempList: [],
// 总条数 // 总条数
@@ -293,7 +286,6 @@ export default {
currentRow: {}, currentRow: {},
selectRowData: {}, selectRowData: {},
isModbus: false, isModbus: false,
}; };
}, },
created() { created() {
@@ -312,8 +304,8 @@ export default {
this.getShortCategory(); this.getShortCategory();
// 设置账号密码输入框类型,新增时为text查看时为password // 设置账号密码输入框类型,新增时为text查看时为password
if (!this.form.productId || this.form.productId == 0) { if (!this.form.productId || this.form.productId == 0) {
this.accountInputType = "text"; this.accountInputType = 'text';
this.passwordInputType = "text"; this.passwordInputType = 'text';
} }
this.getProtocol(); this.getProtocol();
}, },
@@ -323,7 +315,7 @@ export default {
this.uniqueId = time; this.uniqueId = time;
} }
// 获取产品信息 // 获取产品信息
let productId = this.$route.query.productId let productId = this.$route.query.productId;
if (productId != null && productId != 0) { if (productId != null && productId != 0) {
this.form.productId = Number(productId); this.form.productId = Number(productId);
this.getProduct(); this.getProduct();
@@ -334,30 +326,29 @@ export default {
if (tabPanelName != null && tabPanelName != '') { if (tabPanelName != null && tabPanelName != '') {
this.activeName = tabPanelName; this.activeName = tabPanelName;
} }
}, },
methods: { methods: {
// 获取简短分类列表 // 获取简短分类列表
getShortCategory() { getShortCategory() {
listShortCategory().then(response => { listShortCategory().then((response) => {
this.categoryShortList = response.data; this.categoryShortList = response.data;
}) });
}, },
/** 返回按钮 */ /** 返回按钮 */
goBack() { goBack() {
const obj = { const obj = {
path: "/iot/product", path: '/iot/product',
query: { query: {
t: Date.now(), t: Date.now(),
pageNum: this.$route.query.pageNum pageNum: this.$route.query.pageNum,
} },
}; };
this.$tab.closeOpenPage(obj); this.$tab.closeOpenPage(obj);
this.reset(); this.reset();
}, },
/** 获取产品信息 */ /** 获取产品信息 */
getProduct() { getProduct() {
getProduct(this.form.productId).then(response => { getProduct(this.form.productId).then((response) => {
this.form = response.data; this.form = response.data;
this.changeProductCode(this.form.protocolCode); this.changeProductCode(this.form.protocolCode);
}); });
@@ -379,21 +370,21 @@ export default {
mqttPassword: null, mqttPassword: null,
mqttSecret: null, mqttSecret: null,
remark: null, remark: null,
imgUrl: "", imgUrl: '',
}; };
this.resetForm("form"); this.resetForm('form');
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { submitForm() {
this.$refs["form"].validate(valid => { this.$refs['form'].validate((valid) => {
if (valid) { if (valid) {
if (this.form.productId != null && this.form.productId != 0) { if (this.form.productId != null && this.form.productId != 0) {
updateProduct(this.form).then(response => { updateProduct(this.form).then((response) => {
this.changeProductCode(this.form.protocolCode); this.changeProductCode(this.form.protocolCode);
this.$modal.alertSuccess(this.$t('product.product-edit.473153-62')); this.$modal.alertSuccess(this.$t('product.product-edit.473153-62'));
}); });
} else { } else {
addProduct(this.form).then(response => { addProduct(this.form).then((response) => {
if (!this.form.isModbus) { if (!this.form.isModbus) {
this.$modal.alertSuccess(this.$t('product.product-edit.473153-99')); this.$modal.alertSuccess(this.$t('product.product-edit.473153-99'));
} else { } else {
@@ -409,12 +400,14 @@ export default {
/**同步获取产品下的设备数量**/ /**同步获取产品下的设备数量**/
getDeviceCountByProductId(productId) { getDeviceCountByProductId(productId) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
deviceCount(productId).then(res => { deviceCount(productId)
.then((res) => {
resolve(res); resolve(res);
}).catch(error => { })
.catch((error) => {
reject(error); reject(error);
}) });
}) });
}, },
/** 更新产品状态 */ /** 更新产品状态 */
async changeProductStatus(status) { async changeProductStatus(status) {
@@ -430,25 +423,29 @@ export default {
this.$confirm(message, this.$t('product.product-edit.473153-69'), { this.$confirm(message, this.$t('product.product-edit.473153-69'), {
confirmButtonText: this.$t('product.product-edit.473153-70'), confirmButtonText: this.$t('product.product-edit.473153-70'),
cancelButtonText: this.$t('cancel'), cancelButtonText: this.$t('cancel'),
type: 'warning' type: 'warning',
}).then(() => { })
.then(() => {
let data = {}; let data = {};
data.productId = this.form.productId; data.productId = this.form.productId;
data.status = status; data.status = status;
data.deviceType = this.form.deviceType; data.deviceType = this.form.deviceType;
changeProductStatus(data).then(response => { changeProductStatus(data)
.then((response) => {
this.$modal.alertSuccess(response.msg); this.$modal.alertSuccess(response.msg);
this.activeName = "basic"; this.activeName = 'basic';
this.getProduct(); this.getProduct();
}).catch(() => { })
.catch(() => {
if (status == 2) { if (status == 2) {
this.activeName = "basic"; this.activeName = 'basic';
} else { } else {
this.goBack(); this.goBack();
} }
}); });
}).catch(() => { })
this.activeName = "basic"; .catch(() => {
this.activeName = 'basic';
}); });
}, },
/** 选择分类 */ /** 选择分类 */
@@ -466,42 +463,45 @@ export default {
}, },
/**改变输入框类型**/ /**改变输入框类型**/
changeInputType(name) { changeInputType(name) {
if (name == "key") { if (name == 'key') {
this.keyInputType = this.keyInputType == "password" ? "text" : "password"; this.keyInputType = this.keyInputType == 'password' ? 'text' : 'password';
} else if (name == "account") { } else if (name == 'account') {
this.accountInputType = this.accountInputType == "password" ? "text" : "password"; this.accountInputType = this.accountInputType == 'password' ? 'text' : 'password';
} else if (name == "password") { } else if (name == 'password') {
this.passwordInputType = this.passwordInputType == "password" ? "text" : "password"; this.passwordInputType = this.passwordInputType == 'password' ? 'text' : 'password';
} }
}, },
// 授权码状态修改 // 授权码状态修改
changeIsAuthorize() { changeIsAuthorize() {
let text = this.form.isAuthorize == "1" ? this.$t('product.product-edit.473153-72') : this.$t('product.product-edit.473153-74'); let text = this.form.isAuthorize == '1' ? this.$t('product.product-edit.473153-72') : this.$t('product.product-edit.473153-74');
this.$modal.confirm(this.$i18n.t('product.product-edit.473153-75', [text])).then(() => { this.$modal
.confirm(this.$i18n.t('product.product-edit.473153-75', [text]))
.then(() => {
if (this.form.productId != null && this.form.productId != 0) { if (this.form.productId != null && this.form.productId != 0) {
updateProduct(this.form).then(response => { updateProduct(this.form).then((response) => {
this.$modal.alertSuccess(this.$i18n.t('product.product-edit.473153-77', [text])); this.$modal.alertSuccess(this.$i18n.t('product.product-edit.473153-77', [text]));
}); });
} }
}).catch(() => { })
.catch(() => {
this.form.isAuthorize = 0; this.form.isAuthorize = 0;
}); });
}, },
//获取设备协议 //获取设备协议
getProtocol() { getProtocol() {
const data = { const data = {
protocolStatus: 1 protocolStatus: 1,
}; };
listProtocol(data).then(res => { listProtocol(data).then((res) => {
this.protocolList = res.rows; this.protocolList = res.rows;
}) });
}, },
// 设备类型改变事件 // 设备类型改变事件
deviceTypeChange(type){ deviceTypeChange(type) {
if(type===3){ if (type === 3) {
this.form.transport="GB28181"; this.form.transport = 'GB28181';
}else{ } else {
this.form.transport="MQTT"; this.form.transport = 'MQTT';
} }
}, },
// 取消按钮 // 取消按钮
@@ -510,13 +510,13 @@ export default {
// this.reset(); // this.reset();
}, },
getList() { getList() {
getAllPoints(this.pointsParams).then(response => { getAllPoints(this.pointsParams).then((response) => {
this.pointList = response.rows; this.pointList = response.rows;
this.total = response.total; this.total = response.total;
}); });
}, },
changeProductCode(val) { changeProductCode(val) {
if (val && val.startsWith("MODBUS")) { if (val && val.startsWith('MODBUS')) {
this.form.deviceType = 2; this.form.deviceType = 2;
this.form.isModbus = true; this.form.isModbus = true;
if (this.form.productId != 0 && this.form.productId != null) { if (this.form.productId != 0 && this.form.productId != null) {
@@ -529,7 +529,7 @@ export default {
/**选项卡切换事件**/ /**选项卡切换事件**/
tabChange(tabItem) { tabChange(tabItem) {
// 切换到告警配置,获取物模型 // 切换到告警配置,获取物模型
if (tabItem.paneName == "alert") { if (tabItem.paneName == 'alert') {
//this.$refs.productAlert.getCacheThingsModel(this.form.productId); //this.$refs.productAlert.getCacheThingsModel(this.form.productId);
} }
}, },
@@ -541,16 +541,16 @@ export default {
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleQuery() { handleQuery() {
this.tempParams.pageNum = 1 this.tempParams.pageNum = 1;
this.getTempList() this.getTempList();
}, },
/** 重置按钮操作 */ /** 重置按钮操作 */
resetQuery() { resetQuery() {
this.resetForm('tempParams') this.resetForm('tempParams');
this.handleQuery() this.handleQuery();
},
}, },
}
}; };
</script> </script>

View File

@@ -1,6 +1,6 @@
<template> <template>
<div class="script_wrap"> <div class="script_wrap">
<el-card v-show="showSearch" style="margin-bottom: 10px"> <el-card shadow="never" style="margin-bottom: 10px">
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" style="margin-bottom: -20px"> <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" style="margin-bottom: -20px">
<el-form-item :label="$t('script.349087-0')" prop="scriptId"> <el-form-item :label="$t('script.349087-0')" prop="scriptId">
<el-input v-model="queryParams.scriptId" :placeholder="$t('script.349087-1')" clearable @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.scriptId" :placeholder="$t('script.349087-1')" clearable @keyup.enter.native="handleQuery" />
@@ -15,7 +15,7 @@
</el-form> </el-form>
</el-card> </el-card>
<el-card style="padding-bottom: 100px"> <el-card shadow="never" style="padding-bottom: 100px">
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['iot:script:add']" style="margin-bottom: 10px">{{ $t('add') }}</el-button> <el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['iot:script:add']" style="margin-bottom: 10px">{{ $t('add') }}</el-button>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
<el-table v-loading="loading" :data="scriptList" @selection-change="handleSelectionChange" :border="false"> <el-table v-loading="loading" :data="scriptList" @selection-change="handleSelectionChange" :border="false">

View File

@@ -1,6 +1,6 @@
<template> <template>
<div class="sip_wrap"> <div class="sip_wrap">
<el-card style="margin-bottom: 10px" v-show="showSearch"> <el-card shadow="never" style="margin-bottom: 10px" v-show="showSearch">
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="60px" style="margin-bottom: -20px"> <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="60px" style="margin-bottom: -20px">
<el-form-item :label="$t('sip.index.998533-0')" prop="deviceSipId"> <el-form-item :label="$t('sip.index.998533-0')" prop="deviceSipId">
<el-input v-model="queryParams.deviceSipId" :placeholder="$t('sip.index.998533-1')" clearable size="small" @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.deviceSipId" :placeholder="$t('sip.index.998533-1')" clearable size="small" @keyup.enter.native="handleQuery" />
@@ -20,7 +20,7 @@
</el-form> </el-form>
</el-card> </el-card>
<el-card style="padding-bottom: 100px"> <el-card shadow="never" style="padding-bottom: 100px">
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['iot:video:add']" :disabled="isGeneralUser" style="margin-bottom: 10px"> <el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['iot:video:add']" :disabled="isGeneralUser" style="margin-bottom: 10px">
{{ $t('sip.index.998533-6') }} {{ $t('sip.index.998533-6') }}
</el-button> </el-button>

View File

@@ -1,13 +1,8 @@
<template> <template>
<div class="mediaServer_wrap"> <div class="mediaServer_wrap">
<el-card style="margin-bottom: 10px"> <el-card shadow="never">
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="75px" style="margin-bottom: -20px"> <el-button type="primary" plain icon="el-icon-plus" size="small" @click="add" v-hasPermi="['iot:video:add']" style="margin-right: 10px; margin-bottom: 10px">{{ $t('sip.mediaServer.998535-0') }}</el-button>
<el-form-item>
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="add" v-hasPermi="['iot:video:add']" style="margin-right: 10px">{{ $t('sip.mediaServer.998535-0') }}</el-button>
<el-button type="warning" plain icon="el-icon-refresh" size="small" @click="getServerList">{{ $t('refresh') }}</el-button> <el-button type="warning" plain icon="el-icon-refresh" size="small" @click="getServerList">{{ $t('refresh') }}</el-button>
</el-form-item>
</el-form>
</el-card>
<el-row :gutter="30" v-loading="loading"> <el-row :gutter="30" v-loading="loading">
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" v-for="(item, index) in mediaServerList" :key="index" style="margin-bottom: 30px; text-align: center"> <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" v-for="(item, index) in mediaServerList" :key="index" style="margin-bottom: 30px; text-align: center">
@@ -48,6 +43,7 @@
</el-row> </el-row>
<el-empty :description="$t('sip.mediaServer.998535-6')" v-if="total == 0"></el-empty> <el-empty :description="$t('sip.mediaServer.998535-6')" v-if="total == 0"></el-empty>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" :pageSizes="[12, 24, 36, 60]" @pagination="getServerList" /> <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" :pageSizes="[12, 24, 36, 60]" @pagination="getServerList" />
</el-card>
<mediaServerEdit ref="mediaServerEdit" :edit-flag="editFlag"></mediaServerEdit> <mediaServerEdit ref="mediaServerEdit" :edit-flag="editFlag"></mediaServerEdit>
</div> </div>
@@ -178,7 +174,7 @@ export default {
.mediaServer_wrap { .mediaServer_wrap {
padding: 15px; padding: 15px;
min-height: 100vh; min-height: 100vh;
/* background-color: #f5f7fa; */ background-color: #f5f7fa;
} }
::v-deep .pagination-container[data-v-72233bcd] { ::v-deep .pagination-container[data-v-72233bcd] {
background: none; background: none;

View File

@@ -1,6 +1,6 @@
<template> <template>
<div class="templete-wrap"> <div class="templete-wrap">
<el-card v-show="showSearch" style="margin-bottom: 10px"> <el-card shadow="never" v-show="showSearch" style="margin-bottom: 10px">
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" style="margin-bottom: -20px"> <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" style="margin-bottom: -20px">
<el-form-item :label="$t('template.index.891112-22')" prop="templateName"> <el-form-item :label="$t('template.index.891112-22')" prop="templateName">
<el-input v-model="queryParams.templateName" :placeholder="$t('template.index.891112-1')" clearable size="small" @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.templateName" :placeholder="$t('template.index.891112-1')" clearable size="small" @keyup.enter.native="handleQuery" />
@@ -17,7 +17,7 @@
</el-form> </el-form>
</el-card> </el-card>
<el-card style="padding-bottom: 100px"> <el-card shadow="never" style="padding-bottom: 100px">
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['iot:template:add']" style="margin-bottom: 10px">{{ $t('add') }}</el-button> <el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['iot:template:add']" style="margin-bottom: 10px">{{ $t('add') }}</el-button>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
<el-table v-loading="loading" :data="templateList" @selection-change="handleSelectionChange" :border="false"> <el-table v-loading="loading" :data="templateList" @selection-change="handleSelectionChange" :border="false">

View File

@@ -453,7 +453,7 @@ export default {
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {

View File

@@ -252,7 +252,7 @@ export default {
text-align: right; text-align: right;
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {

View File

@@ -1,5 +1,5 @@
<template> <template>
<div class="app-container"> <div class="online-wrap">
<el-card shadow="never" class="search-card"> <el-card shadow="never" class="search-card">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
<el-form-item :label="$t('online.093480-0')" prop="ipaddr"> <el-form-item :label="$t('online.093480-0')" prop="ipaddr">
@@ -110,8 +110,8 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.app-container { .online-wrap {
padding: 20px; padding: 15px;
min-height: 100vh; min-height: 100vh;
background-color: #f5f7fa; background-color: #f5f7fa;
} }
@@ -145,7 +145,7 @@ export default {
text-align: right; text-align: right;
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {

View File

@@ -1,6 +1,6 @@
<template> <template>
<div class="table-header"> <div class="table-header">
<el-card class="search-card" v-show="showSearch"> <el-card shadow="never" class="search-card" v-show="showSearch">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
<el-form-item :label="$t('operlog.874509-10')" prop="operIp"> <el-form-item :label="$t('operlog.874509-10')" prop="operIp">
<el-input v-model="queryParams.operIp" :placeholder="$t('operlog.874509-10')" clearable style="width: 240px" @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.operIp" :placeholder="$t('operlog.874509-10')" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
@@ -309,7 +309,7 @@ export default {
text-align: right; text-align: right;
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {

View File

@@ -1,29 +1,12 @@
<template> <template>
<div class="system-app-lang"> <div class="system-app-lang">
<el-card v-show="showSearch" style="margin-bottom: 10px"> <el-card shadow="never" v-show="showSearch" style="margin-bottom: 10px">
<el-form <el-form @submit.native.prevent :model="queryParams" ref="queryForm" :inline="true" label-width="46px" style="margin-bottom: -20px">
@submit.native.prevent
:model="queryParams"
ref="queryForm"
:inline="true"
label-width="46px"
style="margin-bottom: -20px"
>
<el-form-item prop="langName"> <el-form-item prop="langName">
<el-input <el-input v-model="queryParams.langName" :placeholder="$t('app.lang.755172-14')" clearable @keyup.enter.native="handleQuery" />
v-model="queryParams.langName"
:placeholder="$t('app.lang.755172-14')"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> </el-form-item>
<el-form-item prop="country"> <el-form-item prop="country">
<el-input <el-input v-model="queryParams.country" :placeholder="$t('app.lang.755172-12')" clearable @keyup.enter.native="handleQuery" />
v-model="queryParams.country"
:placeholder="$t('app.lang.755172-12')"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> </el-form-item>
<div style="float: right"> <div style="float: right">
<el-button type="primary" icon="el-icon-search" @click="handleQuery">{{ $t('search') }}</el-button> <el-button type="primary" icon="el-icon-search" @click="handleQuery">{{ $t('search') }}</el-button>
@@ -35,37 +18,17 @@
<el-card> <el-card>
<el-row :gutter="10" style="margin-bottom: 16px"> <el-row :gutter="10" style="margin-bottom: 16px">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['app:language:add']">
type="primary"
plain
icon="el-icon-plus"
size="small"
@click="handleAdd"
v-hasPermi="['app:language:add']"
>
{{ $t('add') }} {{ $t('add') }}
</el-button> </el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button plain icon="el-icon-delete" size="small" :disabled="multiple" @click="handleDelete" v-hasPermi="['app:language:remove']">
plain
icon="el-icon-delete"
size="small"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['app:language:remove']"
>
{{ $t('del') }} {{ $t('del') }}
</el-button> </el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button v-hasPermi="['app:language:export']" plain size="small" :loading="exportLoading" @click="handleExport">
v-hasPermi="['app:language:export']"
plain
size="small"
:loading="exportLoading"
@click="handleExport"
>
{{ $t('app.start.891644-43') }} {{ $t('app.start.891644-43') }}
</el-button> </el-button>
</el-col> </el-col>
@@ -83,11 +46,7 @@
<i class="el-icon-arrow-down el-icon--right"></i> <i class="el-icon-arrow-down el-icon--right"></i>
</el-button> </el-button>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item <el-dropdown-item v-for="dict in dict.type.international_configuration_template" :key="dict.value" :command="dict.value">
v-for="dict in dict.type.international_configuration_template"
:key="dict.value"
:command="dict.value"
>
{{ dict.label }} {{ dict.label }}
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
@@ -100,11 +59,7 @@
<i class="el-icon-arrow-down el-icon--right"></i> <i class="el-icon-arrow-down el-icon--right"></i>
</el-button> </el-button>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item <el-dropdown-item v-for="dict in dict.type.international_configuration_template" :key="dict.value" :command="dict.value">
v-for="dict in dict.type.international_configuration_template"
:key="dict.value"
:command="dict.value"
>
{{ dict.label }} {{ dict.label }}
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
@@ -112,25 +67,14 @@
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-dropdown v-hasRole="['admin']" @command="handleImportTranslate"> <el-dropdown v-hasRole="['admin']" @command="handleImportTranslate">
<el-upload <el-upload v-hasRole="['admin']" :show-file-list="false" ref="upload" action="" :http-request="handleImportBackendMenu" :disabled="true">
v-hasRole="['admin']"
:show-file-list="false"
ref="upload"
action=""
:http-request="handleImportBackendMenu"
:disabled="true"
>
<el-button slot="trigger" size="small" plain> <el-button slot="trigger" size="small" plain>
{{ $t('app.start.891644-46') }} {{ $t('app.start.891644-46') }}
<i class="el-icon-arrow-down el-icon--right"></i> <i class="el-icon-arrow-down el-icon--right"></i>
</el-button> </el-button>
</el-upload> </el-upload>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item <el-dropdown-item v-for="dict in dict.type.international_configuration_template" :key="dict.value" :command="dict.value">
v-for="dict in dict.type.international_configuration_template"
:key="dict.value"
:command="dict.value"
>
{{ dict.label }} {{ dict.label }}
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
@@ -148,36 +92,17 @@
<el-table-column :label="$t('app.lang.755172-7')" align="center" prop="timeZone" min-width="100" /> <el-table-column :label="$t('app.lang.755172-7')" align="center" prop="timeZone" min-width="100" />
<el-table-column fixed="right" :label="$t('opation')" align="center" width="130"> <el-table-column fixed="right" :label="$t('opation')" align="center" width="130">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button size="small" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['app:language:edit']">
size="small"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['app:language:edit']"
>
{{ $t('update') }} {{ $t('update') }}
</el-button> </el-button>
<el-button <el-button size="small" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['app:language:remove']">
size="small"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['app:language:remove']"
>
{{ $t('del') }} {{ $t('del') }}
</el-button> </el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination <pagination style="margin-bottom: 20px" v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
style="margin-bottom: 20px"
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</el-card> </el-card>
<!-- 添加或修改app语言对话框 --> <!-- 添加或修改app语言对话框 -->
@@ -227,15 +152,7 @@
</template> </template>
<script> <script>
import { import { listLanguage, getLanguage, delLanguage, addLanguage, updateLanguage, exportTranslate, importTranslate } from '@/api/system/language';
listLanguage,
getLanguage,
delLanguage,
addLanguage,
updateLanguage,
exportTranslate,
importTranslate,
} from '@/api/system/language';
import * as langTransformer from './script/langTransformer'; import * as langTransformer from './script/langTransformer';
import * as xlsxHandler from './script/xlsx'; import * as xlsxHandler from './script/xlsx';
import * as jszip from './script/jszip'; import * as jszip from './script/jszip';

View File

@@ -283,7 +283,7 @@ export default {
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {

View File

@@ -307,7 +307,7 @@ export default {
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {

View File

@@ -283,7 +283,7 @@ export default {
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {

View File

@@ -400,7 +400,7 @@ export default {
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {

View File

@@ -255,7 +255,7 @@ export default {
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {

View File

@@ -259,7 +259,7 @@ export default {
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {

View File

@@ -512,7 +512,7 @@ export default {
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {
@@ -534,7 +534,7 @@ export default {
::v-deep .el-table { ::v-deep .el-table {
th { th {
background-color: #f5f7fa; // background-color: #f5f7fa;
color: #606266; color: #606266;
font-weight: 600; font-weight: 600;
} }
@@ -553,7 +553,7 @@ export default {
::v-deep .el-table { ::v-deep .el-table {
th { th {
background-color: #f5f7fa; // background-color: #f5f7fa;
color: #606266; color: #606266;
font-weight: 600; font-weight: 600;
text-align: center; text-align: center;

View File

@@ -594,7 +594,7 @@ export default {
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {

View File

@@ -1,5 +1,5 @@
<template> <template>
<div class="app-container"> <div class="gen-wrap">
<!-- 搜索栏 - 上栏 --> <!-- 搜索栏 - 上栏 -->
<el-card shadow="never" class="search-card" v-show="showSearch"> <el-card shadow="never" class="search-card" v-show="showSearch">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
@@ -262,14 +262,14 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.app-container { .gen-wrap {
padding: 20px; padding: 15px;
min-height: 100vh; min-height: 100vh;
background-color: #f5f7fa; background-color: #f5f7fa;
} }
.search-card { .search-card {
margin-bottom: 15px; margin-bottom: 10px;
border-radius: 8px; border-radius: 8px;
::v-deep .el-card__body { ::v-deep .el-card__body {