Commit e67e6ee6 authored by 纪泽龙's avatar 纪泽龙

稍微更改一下数据

parent 6e584af6
<!--
* @Author: your name
* @Date: 2022-03-25 17:15:31
* @LastEditTime: 2022-03-28 13:59:56
* @LastEditTime: 2022-03-28 14:24:41
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: /gassafety-progress/gassafetyprogress-web/src/views/operationMonitor/monitorData/component/charsData/CzCard.vue
......@@ -52,17 +52,15 @@ export default {
addStartNum: 3,
filterList: [
{ value: "加气站", count: 100, type: 1 },
{ value: "加气站1", count: 100, type: 2 },
{ value: "加气站2", count: 100, type: 3 },
{ value: "加气站3", count: 100, type: 4 },
{ value: "加气站4", count: 100, type: 5 },
{ value: "加气站5", count: 100, type: 6 },
{ value: "加气站7", count: 100, type: 7 },
{ value: "门站", count: 100, type: 2 },
{ value: "调压站", count: 100, type: 3 },
{ value: "储备站", count: 100, type: 4 },
{ value: "气化站", count: 100, type: 5 },
],
deviceTypeArr: [1, 2, 3, 4, 5, 6, 7],
deviceTypeArr: [1, 2, 3, 4, 5],
czList: [
{
deviceName: "加气站a",
deviceName: "加气站",
state: 1,
a: 25,
b: 56,
......@@ -74,7 +72,7 @@ export default {
type: 1,
},
{
deviceName: "加气站b",
deviceName: "门站",
state: 1,
a: 25,
b: 56,
......@@ -86,7 +84,7 @@ export default {
type: 2,
},
{
deviceName: "加气站c",
deviceName: "调压站",
state: 1,
a: 25,
b: 56,
......@@ -98,7 +96,7 @@ export default {
type: 3,
},
{
deviceName: "加气站d",
deviceName: "储备站",
state: 1,
a: 25,
b: 56,
......@@ -110,7 +108,7 @@ export default {
type: 4,
},
{
deviceName: "加气站e",
deviceName: "气化站",
state: 1,
a: 25,
b: 56,
......@@ -119,10 +117,10 @@ export default {
e: 56,
image: "",
show: true,
type: 4,
type: 5,
},
{
deviceName: "加气站f",
deviceName: "气化站",
state: 1,
a: 25,
b: 56,
......@@ -131,10 +129,10 @@ export default {
e: 56,
image: "",
show: true,
type: 4,
type: 5,
},
{
deviceName: "加气站g",
deviceName: "储备站",
state: 1,
a: 25,
b: 56,
......
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form
:model="queryParams"
ref="queryForm"
:inline="true"
v-show="showSearch"
label-width="68px"
>
<el-form-item label="设备名称" prop="deviceName">
<el-input
v-model="queryParams.deviceName"
......@@ -19,18 +25,26 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<!-- <el-form-item label="所在地址" prop="deviceAddr">-->
<!-- <el-input-->
<!-- v-model="queryParams.deviceAddr"-->
<!-- placeholder="请输入所在地址"-->
<!-- clearable-->
<!-- size="small"-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="所在地址" prop="deviceAddr">-->
<!-- <el-input-->
<!-- v-model="queryParams.deviceAddr"-->
<!-- placeholder="请输入所在地址"-->
<!-- clearable-->
<!-- size="small"-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
......@@ -43,7 +57,8 @@
size="mini"
@click="handleAdd"
v-hasPermi="['device:device:add']"
>新增</el-button>
>新增</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
......@@ -54,7 +69,8 @@
:disabled="single"
@click="handleUpdate"
v-hasPermi="['device:device:edit']"
>修改</el-button>
>修改</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
......@@ -65,7 +81,8 @@
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['device:device:remove']"
>删除</el-button>
>删除</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
......@@ -73,54 +90,85 @@
plain
icon="el-icon-download"
size="mini"
:loading="exportLoading"
:loading="exportLoading"
@click="handleExport"
v-hasPermi="['device:device:export']"
>导出</el-button>
>导出</el-button
>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange">
<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" />-->
<el-table-column label="照片" align="center" >
<template scope="List">
<img :src="List.row.iconUrl" width="100px">
<!-- <el-table-column label="设备id" align="center" prop="deviceId" />-->
<el-table-column label="照片" align="center">
<template slot-scope="List">
<img :src="List.row.iconUrl" width="100px" />
</template>
</el-table-column>
<el-table-column label="设备名称" align="center" prop="deviceName">
<span slot-scope="scope" v-if="scope.row.deviceName">{{scope.row.deviceName}}</span>
<span slot-scope="scope" v-if="scope.row.deviceName">{{
scope.row.deviceName
}}</span>
<span v-else>-</span>
</el-table-column>
<el-table-column label="设备编号" align="center" prop="deviceCode">
<span slot-scope="scope" v-if="scope.row.deviceCode">{{scope.row.deviceCode}}</span>
<span slot-scope="scope" v-if="scope.row.deviceCode">{{
scope.row.deviceCode
}}</span>
<span v-else>-</span>
</el-table-column>
<el-table-column label="所在地址" align="center" prop="deviceAddr">
<span slot-scope="scope" v-if="scope.row.deviceAddr">{{scope.row.deviceAddr}}</span>
<span slot-scope="scope" v-if="scope.row.deviceAddr">{{
scope.row.deviceAddr
}}</span>
<span v-else>-</span>
</el-table-column>
<el-table-column label="设备型号" align="center" prop="deviceModel" >
<span slot-scope="scope" v-if="scope.row.deviceModel">{{scope.row.deviceModel}}</span>
<el-table-column label="设备型号" align="center" prop="deviceModel">
<span slot-scope="scope" v-if="scope.row.deviceModel">{{
scope.row.deviceModel
}}</span>
<span v-else>-</span>
</el-table-column>
<el-table-column label="设备类型" align="center" prop="deviceType" >
<span slot-scope="scope" v-if="scope.row.deviceType">{{scope.row.deviceType}}</span>
<el-table-column label="设备类型" align="center" prop="deviceType">
<span slot-scope="scope" v-if="scope.row.deviceType">{{
scope.row.deviceType
}}</span>
<span v-else>-</span>
</el-table-column>
<el-table-column label="权属单位名称" align="center" prop="beyondEnterpriseName" >
<span slot-scope="scope" v-if="scope.row.beyondEnterpriseName">{{scope.row.beyondEnterpriseName}}</span>
<el-table-column
label="权属单位名称"
align="center"
prop="beyondEnterpriseName"
>
<span slot-scope="scope" v-if="scope.row.beyondEnterpriseName">{{
scope.row.beyondEnterpriseName
}}</span>
<span v-else>-</span>
</el-table-column>
<el-table-column label="安装时间" align="center" prop="installationTime" width="180">
<el-table-column
label="安装时间"
align="center"
prop="installationTime"
width="180"
>
<template slot-scope="scope">
<span v-if="scope.row.installationTime">{{ parseTime(scope.row.installationTime, '{y}-{m}-{d}') }}</span>
<span v-if="scope.row.installationTime">{{
parseTime(scope.row.installationTime, "{y}-{m}-{d}")
}}</span>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column label="照片" align="center" >
<template slot-scope="List">
<el-table-column label="照片" align="center">
<template slot-scope="List">
<span
class="dbtn"
@click="checkFile(List.row.iconUrl)"
......@@ -128,10 +176,14 @@
>
<i class="el-icon el-icon-view"></i>查看/下载
</span>
<span v-else>-</span>
</template>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="mini"
......@@ -139,262 +191,358 @@
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['device:device:edit']"
>修改</el-button>
>修改</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['device:device:remove']"
>删除</el-button>
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!--选择关联设备弹出框-->
<el-dialog title="选择关联设备" width="1100px" :visible.sync="dialogTableVisible" formLabelWidth="160px">
<template>
<el-form :model="dateQueryParams" ref="queryForm" :inline="true" v-show="showSearch" >
<el-form-item label="设备名称" prop="deviceName">
<el-input
v-model="dateQueryParams.deviceName"
placeholder="请输入设备名称"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="设备型号" prop="deviceCode">
<el-input
v-model="dateQueryParams.deviceModel"
placeholder="请输入设备型号"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="物联网编号" prop="deviceAddr">
<el-input
v-model="dateQueryParams.iotNo"
placeholder="请输入物联网编号"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQueryData">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQueryDate">重置</el-button>
</el-form-item>
</el-form>
<el-dialog
title="选择关联设备"
width="1100px"
:visible.sync="dialogTableVisible"
formLabelWidth="160px"
>
<template>
<el-form
:model="dateQueryParams"
ref="queryForm"
:inline="true"
v-show="showSearch"
>
<el-form-item label="设备名称" prop="deviceName">
<el-input
v-model="dateQueryParams.deviceName"
placeholder="请输入设备名称"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="设备型号" prop="deviceCode">
<el-input
v-model="dateQueryParams.deviceModel"
placeholder="请输入设备型号"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="物联网编号" prop="deviceAddr">
<el-input
v-model="dateQueryParams.iotNo"
placeholder="请输入物联网编号"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQueryData"
>搜索</el-button
>
<el-button
icon="el-icon-refresh"
size="mini"
@click="resetQueryDate"
>重置</el-button
>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="dialogFormVisible = true"
v-hasPermi="['device:device:add']"
>新增</el-button>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="success"-->
<!-- plain-->
<!-- icon="el-icon-edit"-->
<!-- size="mini"-->
<!-- :disabled="single"-->
<!-- @click="handleUpdate"-->
<!-- v-hasPermi="['device:device:edit']"-->
<!-- >修改</el-button>-->
<!-- </el-col>-->
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="deleteListDetailInfo"
v-hasPermi="['device:device:remove']"
>删除</el-button>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="warning"-->
<!-- plain-->
<!-- icon="el-icon-download"-->
<!-- size="mini"-->
<!-- :loading="exportLoading"-->
<!-- @click="handleExport"-->
<!-- v-hasPermi="['device:device:export']"-->
<!-- >导出</el-button>-->
<!-- </el-col>-->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getDataList"></right-toolbar>
</el-row>
<el-table v-loading="loadings" ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%" max-height="250" @selection-change="tableDataSelectionChange">
<el-table-column type="selection" width="55" align="center"></el-table-column>
<el-table-column label="设备名称" align="center" prop="deviceName" />
<el-table-column label="设备型号" align="center" prop="deviceModel" />
<el-table-column label="设备类型" align="center" prop="deviceType" />
<el-table-column label="探测介质" align="center" prop="detectionMedium" />
<el-table-column label="物联网编号" align="center" prop="iotNo" />
<el-table-column label="备注" align="center" prop="remarksn" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
type="text"
@click="dialogFormVisible = true"
v-hasPermi="['device:device:add']"
>新增</el-button
>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="success"-->
<!-- plain-->
<!-- icon="el-icon-edit"-->
<!-- size="mini"-->
<!-- :disabled="single"-->
<!-- @click="handleUpdate"-->
<!-- v-hasPermi="['device:device:edit']"-->
<!-- >修改</el-button>-->
<!-- </el-col>-->
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
@click="deleteDetailInfo(scope.row)"
size="mini"
:disabled="multiple"
@click="deleteListDetailInfo"
v-hasPermi="['device:device:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="insertListDetailInfo"> </el-button>
<el-button @click="dialogTableVisible=false"> </el-button>
</div>
</template>
>删除</el-button
>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="warning"-->
<!-- plain-->
<!-- icon="el-icon-download"-->
<!-- size="mini"-->
<!-- :loading="exportLoading"-->
<!-- @click="handleExport"-->
<!-- v-hasPermi="['device:device:export']"-->
<!-- >导出</el-button>-->
<!-- </el-col>-->
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getDataList"
></right-toolbar>
</el-row>
<el-table
v-loading="loadings"
ref="multipleTable"
:data="tableData"
tooltip-effect="dark"
style="width: 100%"
max-height="250"
@selection-change="tableDataSelectionChange"
>
<el-table-column
type="selection"
width="55"
align="center"
></el-table-column>
<el-table-column label="设备名称" align="center" prop="deviceName" />
<el-table-column label="设备型号" align="center" prop="deviceModel" />
<el-table-column label="设备类型" align="center" prop="deviceType" />
<el-table-column
label="探测介质"
align="center"
prop="detectionMedium"
/>
<el-table-column label="物联网编号" align="center" prop="iotNo" />
<el-table-column label="备注" align="center" prop="remarksn" />
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="deleteDetailInfo(scope.row)"
v-hasPermi="['device:device:remove']"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="insertListDetailInfo"
> </el-button
>
<el-button @click="dialogTableVisible = false"> </el-button>
</div>
</template>
</el-dialog>
<!--添加关联设备弹出框-->
<el-dialog title="添加关联设备" :visible.sync="dialogFormVisible">
<el-form ref="formDetailInfo" :model="formDetailInfo" :rules="formDetailInfoRules" label-width="95px" style="height: 230px">
<el-dialog title="添加关联设备" :visible.sync="dialogFormVisible">
<el-form
ref="formDetailInfo"
:model="formDetailInfo"
:rules="formDetailInfoRules"
label-width="95px"
style="height: 230px"
>
<el-row>
<el-col :span="11">
<el-form-item label="设备名称" prop="deviceName">
<el-input v-model="formDetailInfo.deviceName" placeholder="请输入设备名称" autocomplete="off"></el-input>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="设备名称" prop="deviceName">
<el-input
v-model="formDetailInfo.deviceName"
placeholder="请输入设备名称"
autocomplete="off"
></el-input>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="设备型号" prop="deviceModel">
<el-input v-model="formDetailInfo.deviceModel" placeholder="请输入设备型号" />
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="设备型号" prop="deviceModel">
<el-input
v-model="formDetailInfo.deviceModel"
placeholder="请输入设备型号"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="设备类型" prop="deviceType">
<el-select v-model="formDetailInfo.deviceType" placeholder="请选择设备类型">
<el-option label="压力表" value="1" />
<el-option label="流量计" value="2" />
<el-option label="探测器" value="3" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="设备类型" prop="deviceType">
<el-select
v-model="formDetailInfo.deviceType"
placeholder="请选择设备类型"
>
<el-option label="压力表" value="1" />
<el-option label="流量计" value="2" />
<el-option label="探测器" value="3" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="物联网编号" prop="iotNo" >
<el-input v-model="formDetailInfo.iotNo" placeholder="请输入物联网编号" />
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="物联网编号" prop="iotNo">
<el-input
v-model="formDetailInfo.iotNo"
placeholder="请输入物联网编号"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="22">
<el-form-item label="探测介质" prop="detectionMedium" >
<el-input v-model="formDetailInfo.detectionMedium" placeholder="请输入探测介质" />
</el-form-item>
</el-col>
<el-col :span="22">
<el-form-item label="探测介质" prop="detectionMedium">
<el-input
v-model="formDetailInfo.detectionMedium"
placeholder="请输入探测介质"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="22">
<el-form-item label="备注" prop="remarksn">
<el-input v-model="formDetailInfo.remarksn" type="textarea" placeholder="请输入备注" />
</el-form-item>
<el-form-item label="备注" prop="remarksn">
<el-input
v-model="formDetailInfo.remarksn"
type="textarea"
placeholder="请输入备注"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="addDetailInfo"> </el-button>
<el-button @click="dialogFormVisible=false"> </el-button>
<el-button @click="dialogFormVisible = false"> </el-button>
</div>
</el-dialog>
<!-- 添加或修改设备信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="780px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<el-col :span="11">
<el-form-item label="设备名称" prop="deviceName">
<el-input v-model="form.deviceName" placeholder="请输入设备名称" />
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="设备名称" prop="deviceName">
<el-input
v-model="form.deviceName"
placeholder="请输入设备名称"
/>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="设备编号" prop="deviceCode">
<el-input v-model="form.deviceCode" placeholder="请输入设备编号" :disabled="true"/>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="设备编号" prop="deviceCode">
<el-input
v-model="form.deviceCode"
placeholder="请输入设备编号"
:disabled="true"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="所在地址" prop="deviceAddr">
<el-input v-model="form.deviceAddr" placeholder="请输入所在地址" />
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="所在地址" prop="deviceAddr">
<el-input
v-model="form.deviceAddr"
placeholder="请输入所在地址"
/>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="设备型号" prop="deviceModel">
<el-input v-model="form.deviceModel" placeholder="请输入设备型号" />
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="设备型号" prop="deviceModel">
<el-input
v-model="form.deviceModel"
placeholder="请输入设备型号"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="设备类型" prop="deviceType">
<el-select v-model="form.deviceType" placeholder="请选择设备类型">
<el-option label="阀井" value="1" />
<el-option label="调压箱" value="2" />
</el-select>
</el-form-item>
<el-form-item label="设备类型" prop="deviceType">
<el-select v-model="form.deviceType" placeholder="请选择设备类型">
<el-option label="阀井" value="1" />
<el-option label="调压箱" value="2" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="权属单位" prop="beyondEnterpriseId">
<el-select v-model="form.beyondEnterpriseId" placeholder="请在下拉框中选择权属单位" maxlength="255" :disabled="false" clearable>
<el-option v-for="item in test" :key="item.enterpriseId" :label="item.enterpriseName" :value="item.enterpriseId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="权属单位" prop="beyondEnterpriseId">
<el-select
v-model="form.beyondEnterpriseId"
placeholder="请在下拉框中选择权属单位"
maxlength="255"
:disabled="false"
clearable
>
<el-option
v-for="item in test"
:key="item.enterpriseId"
:label="item.enterpriseName"
:value="item.enterpriseId"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<!-- <el-row>-->
<!-- <el-col :span="11">-->
<!-- <el-form-item label="经度" prop="longitude">-->
<!-- <el-input v-model="form.longitude" placeholder="请输入经度" />-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<!-- <el-row>-->
<!-- <el-col :span="11">-->
<!-- <el-form-item label="经度" prop="longitude">-->
<!-- <el-input v-model="form.longitude" placeholder="请输入经度" />-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<!-- <el-col :span="11">-->
<!-- <el-form-item label="纬度" prop="latitude">-->
<!-- <el-input v-model="form.latitude" placeholder="请输入纬度" />-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<!-- </el-row>-->
<!-- <el-col :span="11">-->
<!-- <el-form-item label="纬度" prop="latitude">-->
<!-- <el-input v-model="form.latitude" placeholder="请输入纬度" />-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<!-- </el-row>-->
<el-row>
<el-col :span="21">
......@@ -403,10 +551,12 @@
<el-input v-model="form.longitude" placeholder="请输入经度" />
</el-col>
<el-col :span="9" style="margin-left: 15px">
<el-input v-model="form.latitude" placeholder="请输入纬度"/>
<el-input v-model="form.latitude" placeholder="请输入纬度" />
</el-col>
<el-col :span="3" style="margin-left: 35px">
<el-button type="primary" plain @click="MapdialogFun">选择经纬度</el-button>
<el-button type="primary" plain @click="MapdialogFun"
>选择经纬度</el-button
>
</el-col>
</el-form-item>
</el-col>
......@@ -419,83 +569,118 @@
listType="picture"
@resFun="getFileInfo"
@remove="listRemove"
:fileArr="fileList">
:fileArr="fileList"
>
</FileUpload>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="联系人" prop="linkman">
<el-input v-model="form.linkman" placeholder="请输入联系人" />
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="联系人" prop="linkman">
<el-input v-model="form.linkman" placeholder="请输入联系人" />
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="电话" prop="phone">
<el-input v-model="form.phone" placeholder="请输入电话" />
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="电话" prop="phone">
<el-input v-model="form.phone" placeholder="请输入电话" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label="安装时间" prop="installationTime">
<el-date-picker clearable size="small"
v-model="form.installationTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择安装时间">
</el-date-picker>
<el-col :span="11">
<el-form-item label="安装时间" prop="installationTime">
<el-date-picker
clearable
size="small"
v-model="form.installationTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择安装时间"
>
</el-date-picker>
</el-form-item>
</el-col>
</el-col>
<el-col :span="11">
<el-form-item label="最后巡检时间" prop="inspectionTime">
<el-date-picker clearable size="small"
v-model="form.inspectionTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择最后巡检时间">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="最后巡检时间" prop="inspectionTime">
<el-date-picker
clearable
size="small"
v-model="form.inspectionTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择最后巡检时间"
>
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="22">
<el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" type="textarea" placeholder="请输入备注" />
<el-input
v-model="form.remarks"
type="textarea"
placeholder="请输入备注"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="tableTitle">
<img :src="relationImg" style="width: 24px; height: 25px;position: relative; left: -339px; top: -12px;"/>
<img
:src="relationImg"
style="
width: 24px;
height: 25px;
position: relative;
left: -339px;
top: -12px;
"
/>
<span class="midText">关联设备</span>
</div>
<el-table v-loading="loadings" ref="multipleTable" :data="DetailInfoList" tooltip-effect="dark" style="width: 100%" max-height="250" @selection-change="tableDataSelectionChange">
<el-table
v-loading="loadings"
ref="multipleTable"
:data="DetailInfoList"
tooltip-effect="dark"
style="width: 100%"
max-height="250"
@selection-change="tableDataSelectionChange"
>
<el-table-column label="设备名称" align="center" prop="deviceName" />
<el-table-column label="设备型号" align="center" prop="deviceModel" />
<el-table-column label="设备类型" align="center" prop="deviceType" />
<el-table-column label="物联网编号" align="center" prop="iotNo" />
<el-table-column label="备注" align="center" prop="remarksn" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="deleteDataListilInfo(scope.row,scope.$index)"
@click="deleteDataListilInfo(scope.row, scope.$index)"
v-hasPermi="['device:device:remove']"
>删除</el-button>
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="selectDataListInfo">选择关联设备</el-button>
<el-button type="primary" @click="selectDataListInfo"
>选择关联设备</el-button
>
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
......@@ -512,9 +697,24 @@
<script>
import { listDevice, getDevice, delDevice, addDevice, updateDevice, exportDevice, selectTEnterprise,getDdeviceDetailInfo,addDetailInfos,deleteDetailInfo,deleteeListDetailInfo,selectDetailInfoList,deleteDeviceDetailInfo,updateDetailInfoLists} from "@/api/regulation/device";
import GetPos from '@/components/GetPos';
import FileUpload from '@/components/FileSuperviseUpload';
import {
listDevice,
getDevice,
delDevice,
addDevice,
updateDevice,
exportDevice,
selectTEnterprise,
getDdeviceDetailInfo,
addDetailInfos,
deleteDetailInfo,
deleteeListDetailInfo,
selectDetailInfoList,
deleteDeviceDetailInfo,
updateDetailInfoLists,
} from "@/api/regulation/device";
import GetPos from "@/components/GetPos";
import FileUpload from "@/components/FileSuperviseUpload";
export default {
name: "Device",
components: {
......@@ -523,16 +723,16 @@ export default {
},
data() {
return {
relationImg: require('@/assets/project/relation.png'),
relationImg: require("@/assets/project/relation.png"),
//头像
fileList: [],
/**弹出层*/
//下级设备数据数组
tableData: [],
//存储已被选中的下级数据id
DetailInfoListId :[],
DetailInfoListId: [],
//存储已经选中的下级关联数据
DetailInfoList:[],
DetailInfoList: [],
multipleSelection: [],
dialogTableVisible: false,
dialogFormVisible: false,
......@@ -541,41 +741,43 @@ export default {
devicePos: [],
/**--------------地图使用数据---------------*/
form: {
name: '',
region: '',
date1: '',
date2: '',
name: "",
region: "",
date1: "",
date2: "",
delivery: false,
type: [],
resource: '',
desc: '',
resource: "",
desc: "",
},
formLabelWidth: '120px',
formLabelWidth: "120px",
/*添加关联设备*/
formDetailInfo:{
relationDeviceDetailId:'',
deviceName: '',
deviceModel:'',
deviceType:'',
iotNo:'',
detectionMedium:'',
remarksn:''
formDetailInfo: {
relationDeviceDetailId: "",
deviceName: "",
deviceModel: "",
deviceType: "",
iotNo: "",
detectionMedium: "",
remarksn: "",
},
/*动态添加输入框*/
dynamicValidateForm: {
domains: [{
deviceName: '',
deviceModel:'',
deviceType:'',
iotNo:'',
remarksn:''
}],
domains: [
{
deviceName: "",
deviceModel: "",
deviceType: "",
iotNo: "",
remarksn: "",
},
],
},
// 遮罩层
loading: true,
//下级数据的遮罩层
loadings:true,
loadings: true,
// 导出遮罩层
exportLoading: false,
// 选中数组
......@@ -589,7 +791,7 @@ export default {
// 总条数
total: 0,
//下级关联设备条数
detailTotal:0,
detailTotal: 0,
// 设备信息表格数据
deviceList: [],
// 弹出层标题
......@@ -611,7 +813,7 @@ export default {
iotNo: null,
},
//下级参数
detailInfoParams:{
detailInfoParams: {
pageNum: 1,
pageSize: 10,
},
......@@ -639,19 +841,19 @@ export default {
],
},
//关联设备下级数据 表单校验
formDetailInfoRules:{
deviceName:[
formDetailInfoRules: {
deviceName: [
{ required: true, message: "请输入设备名称", trigger: "blur" },
{ min: 0, max: 20, message: "长度20位", trigger: "blur" },
],
deviceModel:[
deviceModel: [
{ required: true, message: "请输入设备型号", trigger: "blur" },
{ min: 0, max: 20, message: "长度20位", trigger: "blur" },
],
deviceType:[
deviceType: [
{ required: true, message: "请选择设备类型", trigger: "blur" },
],
iotNo:[
iotNo: [
{ required: true, message: "请输入联网编号", trigger: "blur" },
{ min: 0, max: 20, message: "长度20位", trigger: "blur" },
],
......@@ -663,18 +865,18 @@ export default {
},
methods: {
/**上传头像*/
getFileInfo(res){
getFileInfo(res) {
this.form.dealPlan = res.fileName;
this.form.iconUrl = res.url;
this.form.burl=res.burl;
this.form.burl = res.burl;
this.fileList.push({
name: res.fileName,
url: uploadfile,
burl:res.burl,
burl: res.burl,
});
},
checkFile(url) {
window.open(url,'_blank');
window.open(url, "_blank");
},
listRemove(e) {
this.form.dealPlan = "";
......@@ -682,21 +884,19 @@ export default {
},
/** 查询设备信息列表 */
getList() {
this.loading = true;
listDevice(this.queryParams).then(response => {
listDevice(this.queryParams).then((response) => {
this.deviceList = response.rows;
this.total = response.total;
this.loading = false;
});
},
/**查询下级数据列表方法*/
getDataList(){
getDataList() {
this.loadings = true;
// console.log(this.dateQueryParams)
//查询下级设备数据
getDdeviceDetailInfo(this.dateQueryParams).then(response => {
getDdeviceDetailInfo(this.dateQueryParams).then((response) => {
//下级设备数据 到时候换成下级数据
this.tableData = response.rows;
this.detailTotal = response.total;
......@@ -733,7 +933,7 @@ export default {
updateTime: null,
isDel: null,
remarks: null,
relationDeviceType:'1',
relationDeviceType: "1",
};
this.resetForm("form");
},
......@@ -743,7 +943,7 @@ export default {
this.getList();
},
/** 下级数据搜索*/
handleQueryData(){
handleQueryData() {
this.getDataList();
},
/** 重置按钮操作 */
......@@ -752,39 +952,39 @@ export default {
this.handleQuery();
},
/** 下级数据重置按钮操作 搜索框重置*/
resetQueryDate(){
this.dateQueryParams={
resetQueryDate() {
this.dateQueryParams = {
deviceName: null,
deviceModel: null,
iotNo: null,
}
deviceModel: null,
iotNo: null,
};
this.getDataList();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.deviceId)
this.single = selection.length!==1
this.multiple = !selection.length
this.ids = selection.map((item) => item.deviceId);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
//关联数据多选框选中数据
tableDataSelectionChange(selection){
this.ids = selection.map(item => item.relationDeviceDetailId)
this.datalist=selection.map(item => item)
tableDataSelectionChange(selection) {
this.ids = selection.map((item) => item.relationDeviceDetailId);
this.datalist = selection.map((item) => item);
//按钮 非选中禁用
this.single = selection.length!==1
this.multiple = !selection.length
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
/** 新增按钮操作 */
handleAdd() {
//查询企业名称下拉框数据
selectTEnterprise().then(response => {
selectTEnterprise().then((response) => {
this.test = response.data;
});
//清空关联设备数据
this.DetailInfoList=''
this.DetailInfoList = "";
this.loadings = true;
//查询下级设备数据
getDdeviceDetailInfo(this.dateQueryParams).then(response => {
getDdeviceDetailInfo(this.dateQueryParams).then((response) => {
//下级设备数据 到时候换成下级数据
this.tableData = response.rows;
this.detailTotal = response.total;
......@@ -798,28 +998,28 @@ export default {
/** 修改按钮操作 */
handleUpdate(row) {
//查询企业名称下拉框数据
selectTEnterprise().then(response => {
selectTEnterprise().then((response) => {
this.test = response.data;
});
const deviceId = row.deviceId || this.ids
var tDeviceInfon={
id:deviceId,
relationDeviceType:'1'
}
const deviceId = row.deviceId || this.ids;
var tDeviceInfon = {
id: deviceId,
relationDeviceType: "1",
};
//查询关联设备信息数据
selectDetailInfoList(JSON.stringify(tDeviceInfon)).then(response => {
selectDetailInfoList(JSON.stringify(tDeviceInfon)).then((response) => {
this.DetailInfoList = response.rows;
this.loadings = false;
});
this.reset();
getDevice(deviceId).then(response => {
getDevice(deviceId).then((response) => {
this.form = response.data;
//图片回显
if (this.form.iconUrl) {
this.fileList.push({
name: '照片',
name: "照片",
url: this.form.iconUrl,
});
}
......@@ -832,205 +1032,226 @@ export default {
handleDelete(row) {
const deviceIds = row.deviceId || this.ids;
// const deviceIds = row.relationDeviceDetailId || this.ids;
this.$confirm('是否确认删除设备信息编号为"' + deviceIds + '"的数据项?', "警告", {
this.$confirm(
'是否确认删除设备信息编号为"' + deviceIds + '"的数据项?',
"警告",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
type: "warning",
}
)
.then(function () {
return delDevice(deviceIds);
}).then(() => {
})
.then(() => {
this.getList();
this.msgSuccess("删除成功");
}).catch(() => {});
})
.catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
const queryParams = this.queryParams;
this.$confirm('是否确认导出所有设备信息数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
this.$confirm("是否确认导出所有设备信息数据项?", "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.exportLoading = true;
return exportDevice(queryParams);
}).then(response => {
})
.then((response) => {
this.download(response.msg);
this.exportLoading = false;
}).catch(() => {});
})
.catch(() => {});
},
/**动态添加输入框方法*/
addDomain() {
this.dynamicValidateForm.domains.push({
deviceName: '',
deviceModel:'',
deviceType:'',
iotNo:'',
remarksn:'',
deviceName: "",
deviceModel: "",
deviceType: "",
iotNo: "",
remarksn: "",
});
},
/**动态删除输入框方法*/
removeDomain(item) {
var index = this.dynamicValidateForm.domains.indexOf(item)
var index = this.dynamicValidateForm.domains.indexOf(item);
if (index !== -1) {
this.dynamicValidateForm.domains.splice(index, 1)
this.dynamicValidateForm.domains.splice(index, 1);
}
},
/**提交数据方法*/
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.deviceId != null) {
updateDevice(this.form).then(response => {
this.msgSuccess("修改成功");
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.deviceId != null) {
updateDevice(this.form).then((response) => {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
});
if (this.datalist != null) {
this.form.relationDeviceType = "1";
var tDeviceInfon = {
tDeviceInfo: this.form,
tDeviceInfoS: this.datalist,
};
//重新绑定修改后的关联设备
updateDetailInfoLists(JSON.stringify(tDeviceInfon)).then(
(response) => {
this.open = false;
this.getList();
}
);
}
} else {
if (valid) {
//获取已经选中的下级设备id
const deviceIds = this.ids;
// alert(deviceIds)
this.form.relationDeviceType = "1";
var tDeviceInfon = {
tDeviceInfo: this.form,
tDeviceInfoS: this.datalist,
};
addDevice(JSON.stringify(tDeviceInfon)).then((response) => {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
});
if ( this.datalist !=null){
this.form.relationDeviceType='1';
var tDeviceInfon={
tDeviceInfo:this.form,
tDeviceInfoS:this.datalist
}
//重新绑定修改后的关联设备
updateDetailInfoLists(JSON.stringify(tDeviceInfon)).then(response => {
this.open = false;
this.getList();
});
}
} else {
if (valid) {
//获取已经选中的下级设备id
const deviceIds = this.ids;
// alert(deviceIds)
this.form.relationDeviceType='1';
var tDeviceInfon={
tDeviceInfo:this.form,
tDeviceInfoS:this.datalist
}
addDevice(JSON.stringify(tDeviceInfon)).then(response => {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
});
} else {
console.log('error submit!!');
return false;
}
console.log("error submit!!");
return false;
}
}
});
}
});
},
/**关联设备添加方法*/
addDetailInfo(){
this.$refs["formDetailInfo"].validate(valid => {
addDetailInfo() {
this.$refs["formDetailInfo"].validate((valid) => {
if (valid) {
addDetailInfos(this.formDetailInfo).then(response => {
addDetailInfos(this.formDetailInfo).then((response) => {
// this.tableData.push(this.formDetailInfo)
//关闭弹出层
this.dialogFormVisible = false;
//数据表单重置
this.formDetailInfo={
this.formDetailInfo = {
deviceName: null,
deviceModel:null,
deviceType:null,
iotNo:null,
remarksn:null
deviceModel: null,
deviceType: null,
iotNo: null,
remarksn: null,
};
this.getDataList();
this.msgSuccess("新增成功");
});
}
});
},
/**关联设备单条删除方法*/
deleteDetailInfo(row){
deleteDetailInfo(row) {
const deviceIds = row.relationDeviceDetailId;
this.$confirm('是否确认删除设备信息编号为"' + deviceIds + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return deleteDetailInfo(deviceIds);
}).then(() => {
// this.tableData.splice(index,1);
this.getDataList();
this.msgSuccess("删除成功");
}).catch(() => {});
this.$confirm(
'是否确认删除设备信息编号为"' + deviceIds + '"的数据项?',
"警告",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}
)
.then(function () {
return deleteDetailInfo(deviceIds);
})
.then(() => {
// this.tableData.splice(index,1);
this.getDataList();
this.msgSuccess("删除成功");
})
.catch(() => {});
},
/**关联设备已经选中数据删除方法*/
deleteDataListilInfo(row,index){
deleteDataListilInfo(row, index) {
const deviceIds = row.relationDeviceDetailId;
//判断form表单是否有id来验证是修改的删除还是添加的删除
if (this.form.deviceId != null) {
deleteDeviceDetailInfo(deviceIds).then(response => {
deleteDeviceDetailInfo(deviceIds).then((response) => {
this.msgSuccess("删除成功");
this.DetailInfoList.splice(index,1);
this.DetailInfoList.splice(index, 1);
});
}else {
this.DetailInfoList.splice(index,1);
} else {
this.DetailInfoList.splice(index, 1);
this.msgSuccess("删除成功");
}
},
/**
* 批量删除关联设备方法
* @param row
*/
deleteListDetailInfo(row){
deleteListDetailInfo(row) {
const deviceIds = this.ids;
this.$confirm('是否确认删除设备信息编号为"' + deviceIds + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return deleteeListDetailInfo(deviceIds);
}).then(() => {
this.getDataList();
this.msgSuccess("删除成功");
}).catch(() => {});
this.$confirm(
'是否确认删除设备信息编号为"' + deviceIds + '"的数据项?',
"警告",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}
)
.then(function () {
return deleteeListDetailInfo(deviceIds);
})
.then(() => {
this.getDataList();
this.msgSuccess("删除成功");
})
.catch(() => {});
},
/**添加关联设备与设备绑定的数据 (存储到数组中)*/
insertListDetailInfo(row){
insertListDetailInfo(row) {
//获取已经选中的下级设备id
const deviceIds = this.ids;
const li=this.datalist;
if (this.form.deviceId != null) {
//修改
this.DetailInfoList=this.DetailInfoList.concat(this.datalist)
//添加到数组中 以便下次使用
this.DetailInfoListId.push(deviceIds);
// alert(this.DetailInfoListId)
this.dialogTableVisible=false
this.msgSuccess("添加成功");
}else {
//添加
// this.DetailInfoList.push(this.datalist)
//清空数组数据 将之前的数据清空
this.DetailInfoListId.splice(row);
this.DetailInfoList=this.datalist;
//添加到数组中 以便下次使用
this.DetailInfoListId.push(deviceIds);
// alert(this.DetailInfoListId)
this.dialogTableVisible=false
this.msgSuccess("添加成功");
}
const deviceIds = this.ids;
const li = this.datalist;
if (this.form.deviceId != null) {
//修改
this.DetailInfoList = this.DetailInfoList.concat(this.datalist);
//添加到数组中 以便下次使用
this.DetailInfoListId.push(deviceIds);
// alert(this.DetailInfoListId)
this.dialogTableVisible = false;
this.msgSuccess("添加成功");
} else {
//添加
// this.DetailInfoList.push(this.datalist)
//清空数组数据 将之前的数据清空
this.DetailInfoListId.splice(row);
this.DetailInfoList = this.datalist;
//添加到数组中 以便下次使用
this.DetailInfoListId.push(deviceIds);
// alert(this.DetailInfoListId)
this.dialogTableVisible = false;
this.msgSuccess("添加成功");
}
},
/**
* 选择关联设备查询方法
*/
selectDataListInfo(){
selectDataListInfo() {
//查询下级设备数据
getDdeviceDetailInfo(this.dateQueryParams).then(response => {
getDdeviceDetailInfo(this.dateQueryParams).then((response) => {
//下级设备数据 到时候换成下级数据
this.tableData = response.rows;
this.detailTotal = response.total;
this.loadings = false;
//打开选择关联设备弹出框
this.dialogTableVisible = true
this.dialogTableVisible = true;
});
},
......@@ -1052,47 +1273,47 @@ export default {
* 经纬度 选择
* @param res
*/
getPath(res){
getPath(res) {
console.log("res", res);
console.log(this.form.longitude, this.form.latitude);
//确认选择经纬度
this.form.longitude = res[0];
this.form.latitude = res[1];
}
}
},
},
};
</script>
<style>
.dbtn {
display: inline-block;
line-height: normal;
padding-left: 2px;
padding-right: 2px;
cursor: pointer;
border-radius: 3px;
border-style: solid;
border-width: 0;
color: rgb(48, 180, 107);
}
.dbtn:hover {
border-width: 1px;
border-color: rgb(48, 180, 107);
}
.tableTitle {
position: relative;
margin: 24px auto;
width: 600px;
height: 2px;
background-color: #d4d4d4;
text-align: center;
font-size: 16px;
color: rgba(101, 101, 101, 1);
}
.midText {
position: absolute;
left: 3%;
background-color: #ffffff;
padding: 0 15px;
transform: translateX(-50%) translateY(-50%);
}
.dbtn {
display: inline-block;
line-height: normal;
padding-left: 2px;
padding-right: 2px;
cursor: pointer;
border-radius: 3px;
border-style: solid;
border-width: 0;
color: rgb(48, 180, 107);
}
.dbtn:hover {
border-width: 1px;
border-color: rgb(48, 180, 107);
}
.tableTitle {
position: relative;
margin: 24px auto;
width: 600px;
height: 2px;
background-color: #d4d4d4;
text-align: center;
font-size: 16px;
color: rgba(101, 101, 101, 1);
}
.midText {
position: absolute;
left: 3%;
background-color: #ffffff;
padding: 0 15px;
transform: translateX(-50%) translateY(-50%);
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment