<template>
|
<div class="main tabs_main">
|
<div class="main_header">
|
<div class="header_item">
|
<span class="header_label">设备名称：</span>
|
<el-input v-model="bigDeviceName" clearable placeholder="请输入设备名称"></el-input>
|
</div>
|
<div class="header_item">
|
<span class="header_label">设备编号：</span>
|
<el-input v-model="bigNumber" clearable placeholder="请输入设备编号"></el-input>
|
</div>
|
<div class="header_item">
|
<el-button icon="el-icon-search" @click="searchDeviceInfoList(true)">查询</el-button>
|
<el-button class="search_btn" icon="el-icon-plus" @click="propInsert()">新增</el-button>
|
<el-button icon="el-icon-upload2" @click="exportExcel()">导出Excel</el-button>
|
</div>
|
</div>
|
<div class="main_content">
|
<el-table
|
v-loading="loading"
|
:data="generalList"
|
height="100%">
|
<el-table-column label="序号" width="55" align="center">
|
<template #default="scope">
|
<span>{{(pageNum - 1) * pageSize + scope.$index + 1}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column prop="bigDeviceName" label="设备名称" align="center" width="200"></el-table-column>
|
<el-table-column prop="bigDeviceModel" label="规格型号" align="center" width="200"></el-table-column>
|
<el-table-column prop="bigNumber" label="设备编号" align="center" width="200"></el-table-column>
|
<el-table-column prop="manufacturer" label="生产厂家" align="center" width="200"></el-table-column>
|
<el-table-column prop="dateOfProduction" label="出厂年月" align="center"></el-table-column>
|
<el-table-column prop="useYearMonth" label="使用年月" align="center"></el-table-column>
|
<el-table-column prop="useLife" label="使用年限" align="center"></el-table-column>
|
<el-table-column prop="shapeSize" label="外形尺寸mm(长*宽*高)" align="center" width="200"></el-table-column>
|
<el-table-column prop="totalPower" label="总功率(KW)" align="center" width="200"></el-table-column>
|
<el-table-column prop="totalWeight" label="总重量(KG)" align="center" width="200"></el-table-column>
|
<el-table-column prop="originalValue" label="原值(元)" align="center"></el-table-column>
|
<el-table-column prop="yearDepreciationRate" label="年折旧率" align="center"></el-table-column>
|
<el-table-column prop="accumulatedDepreciation" label="已提折旧" align="center"></el-table-column>
|
<el-table-column prop="netWorth" label="净值(元)" align="center"></el-table-column>
|
<el-table-column label="使用状况" align="center">
|
<template #default="{ row }">
|
<div>
|
{{ row.useStatus ? row.useStatus === 1 ? '良好' : '老化' : '' }}
|
</div>
|
</template>
|
</el-table-column>
|
<el-table-column label="是否满足需要" align="center" width="120">
|
<template #default="{ row }">
|
<div>
|
{{ row.isNeed ? row.isNeed === 1 ? '是' : '否' : '' }}
|
</div>
|
</template>
|
</el-table-column>
|
<el-table-column prop="deviceSource" label="设备来源" align="center"></el-table-column>
|
<el-table-column prop="deviceNexus" label="设备配属关系" align="center" width="150"></el-table-column>
|
<el-table-column prop="fixedPerson" label="定机人" align="center"></el-table-column>
|
<el-table-column label="操作" align="center" width="400">
|
<template #default="{ row }">
|
<el-button class="table_btn" size="mini" @click="propDetail(row)">查看</el-button>
|
<el-button class="table_btn" size="mini" @click="propUpdate(row)">修改</el-button>
|
<el-button class="table_btn" size="mini" @click="propPlate(row)">设备标识牌</el-button>
|
<el-button class="table_btn" size="mini" @click="printDevice(row)">打印</el-button>
|
<el-button class="delete_btn" size="mini" @click="deleteInfo(row)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="main_footer">
|
<el-pagination
|
background
|
@current-change="changePageNum"
|
@size-change="changePageSize"
|
:current-page="pageNum"
|
:page-sizes="[10, 20, 50, 100]"
|
:page-size="pageSize"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="total">
|
</el-pagination>
|
</div>
|
<!-- 新增 修改 -->
|
<el-dialog
|
class="prop_dialog"
|
:title="asyncTitle === true ? '新增特种设备' : asyncTitle === false ? '修改特种设备信息' : '查看特种设备信息'"
|
:visible.sync="asyncDevice"
|
width="35%">
|
<el-form ref="form" :model="formDevice" :rules="rulesDevice" :disabled="disabled" label-width="auto" class="rule_form">
|
<el-form-item label="设备名称：" prop="bigDeviceName">
|
<el-input v-model="formDevice.bigDeviceName" :disabled="disabled" clearable placeholder="请输入设备名称"></el-input>
|
</el-form-item>
|
<el-form-item label="规格型号：" prop="bigDeviceModel">
|
<el-input v-model="formDevice.bigDeviceModel" :disabled="disabled" clearable placeholder="请输入规格型号"></el-input>
|
</el-form-item>
|
<el-form-item label="设备编号：" prop="bigNumber">
|
<el-input v-model="formDevice.bigNumber" :disabled="disabled" clearable placeholder="请输入设备编号"></el-input>
|
</el-form-item>
|
<el-form-item label="生产厂家：" prop="manufacturer">
|
<el-input v-model="formDevice.manufacturer" :disabled="disabled" clearable placeholder="请输入生产厂家"></el-input>
|
</el-form-item>
|
<el-form-item label="出厂年月：" prop="dateOfProduction">
|
<el-date-picker
|
v-model="formDevice.dateOfProduction"
|
:disabled="disabled"
|
type="month"
|
placeholder="请选择出厂年月"
|
value-format="yyyy-MM">
|
</el-date-picker>
|
</el-form-item>
|
<el-form-item label="使用年月：" prop="useYearMonth">
|
<el-date-picker
|
v-model="formDevice.useYearMonth"
|
:disabled="disabled"
|
type="month"
|
placeholder="请选择使用年月"
|
value-format="yyyy-MM">
|
</el-date-picker>
|
</el-form-item>
|
<el-form-item label="使用年限：" prop="useLife">
|
<el-input-number
|
v-model="formDevice.useLife"
|
:disabled="disabled"
|
:controls="false"
|
:min="0"
|
placeholder="请输入使用年限">
|
</el-input-number>
|
</el-form-item>
|
<el-form-item label="外形尺寸：" prop="shapeSize">
|
<div class="form_flex">
|
<el-input-number
|
v-model="formDevice.shapeSize"
|
:disabled="disabled"
|
:controls="false"
|
:min="0"
|
placeholder="请输入外形尺寸">
|
</el-input-number>
|
<span class="form_flex_slot" style="min-width: 120px">mm（长*宽*高）</span>
|
</div>
|
</el-form-item>
|
<el-form-item label="总功率：" prop="totalPower">
|
<div class="form_flex">
|
<el-input-number
|
v-model="formDevice.totalPower"
|
:disabled="disabled"
|
:controls="false"
|
:min="0"
|
placeholder="请输入总功率">
|
</el-input-number>
|
<span class="form_flex_slot">KW</span>
|
</div>
|
</el-form-item>
|
<el-form-item label="总重量：" prop="totalWeight">
|
<div class="form_flex">
|
<el-input-number
|
v-model="formDevice.totalWeight"
|
:disabled="disabled"
|
:controls="false"
|
:min="0"
|
placeholder="请输入总重量">
|
</el-input-number>
|
<span class="form_flex_slot">KG</span>
|
</div>
|
</el-form-item>
|
<el-form-item label="原值：" prop="originalValue">
|
<div class="form_flex">
|
<el-input-number
|
v-model="formDevice.originalValue"
|
:disabled="disabled"
|
:controls="false"
|
:min="0"
|
placeholder="请输入原值">
|
</el-input-number>
|
<span class="form_flex_slot">元</span>
|
</div>
|
</el-form-item>
|
<el-form-item label="年折旧率：" prop="yearDepreciationRate">
|
<el-input-number
|
v-model="formDevice.yearDepreciationRate"
|
:disabled="disabled"
|
:controls="false"
|
:min="0"
|
placeholder="请输入年折旧率">
|
</el-input-number>
|
</el-form-item>
|
<el-form-item label="已提折旧：" prop="accumulatedDepreciation">
|
<el-input v-model="formDevice.accumulatedDepreciation" :disabled="disabled" clearable placeholder="请输入已提折旧"></el-input>
|
</el-form-item>
|
<el-form-item label="净值：" prop="netWorth">
|
<div class="form_flex">
|
<el-input-number
|
v-model="formDevice.netWorth"
|
:disabled="disabled"
|
:controls="false"
|
:min="0"
|
placeholder="请输入净值">
|
</el-input-number>
|
<span class="form_flex_slot">元</span>
|
</div>
|
</el-form-item>
|
<el-form-item label="使用状况：" prop="useStatus">
|
<el-radio-group v-model="formDevice.useStatus" :disabled="disabled">
|
<el-radio :label="1">良好</el-radio>
|
<el-radio :label="2">老化</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="是否满足需要：" prop="isNeed">
|
<el-radio-group v-model="formDevice.isNeed" :disabled="disabled">
|
<el-radio :label="1">是</el-radio>
|
<el-radio :label="2">否</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="设备来源：" prop="deviceSource">
|
<el-input v-model="formDevice.deviceSource" :disabled="disabled" clearable placeholder="请输入设备来源"></el-input>
|
</el-form-item>
|
<el-form-item label="设备配属关系：" prop="deviceNexus">
|
<el-input v-model="formDevice.deviceNexus" :disabled="disabled" clearable placeholder="请输入设备配属关系"></el-input>
|
</el-form-item>
|
<el-form-item label="定机人：" prop="fixedPerson">
|
<el-select v-model="formDevice.fixedPerson" :disabled="disabled" clearable placeholder="请选择定机人">
|
<el-option
|
v-for="item in plateUserData"
|
:key="item.userId"
|
:label="item.realName"
|
:value="item.realName">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="责任人：" prop="userId">
|
<el-select v-model="formDevice.userId" :disabled="disabled" clearable placeholder="请选择责任人" @change="changePerson">
|
<el-option
|
v-for="item in plateUserData"
|
:key="item.userId"
|
:label="item.realName"
|
:value="item.userId">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="责任人联系电话：" prop="zrrPhone">
|
<el-input v-model="formDevice.zrrPhone" disabled placeholder="请输入责任人联系电话"></el-input>
|
</el-form-item>
|
<el-form-item label="管理员联系电话：" prop="adminPhone">
|
<el-input v-model="formDevice.adminPhone" :disabled="disabled" clearable placeholder="请输入管理员联系电话："></el-input>
|
</el-form-item>
|
<el-form-item label="备注：">
|
<el-input
|
v-model="formDevice.bigNotes"
|
:disabled="disabled"
|
clearable
|
placeholder="请输入备注"
|
type="textarea">
|
</el-input>
|
</el-form-item>
|
</el-form>
|
<div slot="footer" v-if="asyncTitle != 3">
|
<el-button @click="asyncDevice = false">取 消</el-button>
|
<el-button class="submit_btn" @click="asyncTitle ? submitInsertForm() : submitUpdateForm()">提 交</el-button>
|
</div>
|
</el-dialog>
|
<!-- 设备标识牌 -->
|
<el-dialog
|
class="prop_dialog"
|
title="设备标识牌"
|
:visible.sync="asyncPlate"
|
width="50%">
|
<div class="prop_plate">
|
<div class="prop_plate_header">
|
<img :src="`${baseUrl}/materials/steelPrint/test?bigDeviceId=${bigDeviceId}&type=1`" width="100px" height="100px">
|
<span>设备标识牌</span>
|
</div>
|
<div class="prop_plate_content">
|
<div
|
v-for="item in plateList"
|
:key="item.id"
|
class="plate_item">
|
<span>{{item.label}}</span>
|
<span>{{plateData[item.value]}}</span>
|
</div>
|
</div>
|
<div class="prop_plate_footer">
|
<img src="../../../../assets/logos.png" width="44px" height="35px">
|
<span>中铁十四局集团有限公司新建南通至宁波高速铁路</span>
|
</div>
|
</div>
|
<div slot="footer">
|
<el-button @click="asyncPlate = false">取 消</el-button>
|
<el-button class="submit_btn" @click="printDeviceDialog()">打 印</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import { buttonPinia } from '../../../../pinia/index';
|
import { downFiles, throttle } from '../../../../plugins/public';
|
export default {
|
name: 'SpecialEquipment',
|
data() {
|
return {
|
bigDeviceName: '',
|
bigNumber: '',
|
pageNum: 1,
|
pageSize: 10,
|
total: 0,
|
loading: false,
|
generalList: [],
|
disabled: false,
|
asyncTitle: true, // true 新增 false 修改
|
asyncDevice: false,
|
formDevice: {},
|
rulesDevice: {
|
bigDeviceName: [{
|
required: true,
|
message: '请输入设备名称',
|
trigger: 'blur'
|
}],
|
bigDeviceModel: [{
|
required: true,
|
message: '请输入规格型号',
|
trigger: 'blur'
|
}],
|
bigNumber: [{
|
required: true,
|
message: '请输入设备编号',
|
trigger: 'blur'
|
}],
|
manufacturer: [{
|
required: true,
|
message: '请输入生产厂家',
|
trigger: 'blur'
|
}],
|
dateOfProduction: [{
|
required: true,
|
message: '请选择出厂年月',
|
trigger: ['blur', 'change']
|
}],
|
useYearMonth: [{
|
required: true,
|
message: '请选择使用年月',
|
trigger: ['blur', 'change']
|
}],
|
useLife: [{
|
required: true,
|
message: '请输入使用年限',
|
trigger: 'blur'
|
}],
|
shapeSize: [{
|
required: true,
|
message: '请输入外形尺寸',
|
trigger: 'blur'
|
}],
|
totalPower: [{
|
required: true,
|
message: '请输入总功率',
|
trigger: 'blur'
|
}],
|
totalWeight: [{
|
required: true,
|
message: '请输入总重量',
|
trigger: 'blur'
|
}],
|
originalValue: [{
|
required: true,
|
message: '请输入原值',
|
trigger: 'blur'
|
}],
|
yearDepreciationRate: [{
|
required: true,
|
message: '请输入年折旧率',
|
trigger: 'blur'
|
}],
|
accumulatedDepreciation: [{
|
required: true,
|
message: '请输入已提折旧',
|
trigger: 'blur'
|
}],
|
netWorth: [{
|
required: true,
|
message: '请输入净值',
|
trigger: 'blur'
|
}],
|
useStatus: [{
|
required: true,
|
message: '请选择使用状况',
|
trigger: ['blur', 'change']
|
}],
|
isNeed: [{
|
required: true,
|
message: '请选择是否满足需要',
|
trigger: ['blur', 'change']
|
}],
|
deviceSource: [{
|
required: true,
|
message: '请输入设备来源',
|
trigger: 'blur'
|
}],
|
deviceNexus: [{
|
required: true,
|
message: '请输入设备配属关系',
|
trigger: 'blur'
|
}],
|
fixedPerson: [{
|
required: true,
|
message: '请选择定机人',
|
trigger: ['blur', 'change']
|
}],
|
adminPhone: [{
|
required: true,
|
message: '请输入管理员联系电话',
|
trigger: 'blur'
|
}],
|
userId: [{
|
required: true,
|
message: '请选择责任人',
|
trigger: ['blur', 'change']
|
}],
|
zrrPhone: [{
|
required: true,
|
message: '请输入责任人联系电话',
|
trigger: 'blur'
|
}, {
|
validator: (rule, value, callback) => {
|
const reg = /^1[3456789]\d{9}$/
|
if(reg.test(value)) {
|
callback()
|
} else {
|
callback(new Error('请输入正确的电话格式'))
|
}
|
},
|
trigger: 'blur'
|
}]
|
},
|
baseUrl: process.env.VUE_APP_BASE_URL,
|
asyncPlate: false,
|
bigDeviceId: '',
|
plateList: [{
|
id: 1,
|
label: '设备名称',
|
value: 'bigDeviceName'
|
},{
|
id: 2,
|
label: '编号',
|
value: 'bigNumber'
|
},{
|
id: 3,
|
label: '规格型号',
|
value: 'bigDeviceModel'
|
},{
|
id: 4,
|
label: '生产厂家',
|
value: 'manufacturer'
|
},{
|
id: 5,
|
label: '设备状态',
|
value: 'useStatusName'
|
},{
|
id: 6,
|
label: '责任人',
|
value: 'realName'
|
},{
|
id: 7,
|
label: '设备管理员联系方式',
|
value: 'adminPhone'
|
},{
|
id: 8,
|
label: '责任人联系方式',
|
value: 'zrrPhone'
|
}],
|
plateData: {},
|
plateUserData: []
|
}
|
},
|
mounted() {
|
this.searchDeviceInfoList(true);
|
},
|
methods: {
|
// 获取全部人员
|
async getAllPlatUserpulldown() {
|
const { data } = await this.$api.Personnerl.GETSTAFFALLDATA();
|
this.plateUserData = data;
|
},
|
// 查询特种设备信息
|
searchDeviceInfoList(bol) {
|
if(bol) {
|
this.pageNum = 1;
|
}
|
this.loading = true;
|
this.generalList = [];
|
this.$api.Device.searchDeviceInfoList({
|
pageNum: this.pageNum,
|
pageSize: this.pageSize,
|
bigType: 1,
|
bigDeviceName: this.bigDeviceName,
|
bigNumber: this.bigNumber
|
}).then((result) => {
|
if(result.success) {
|
this.total = result.data.total;
|
this.generalList = result.data.list;
|
}
|
this.loading = false;
|
}).catch(() => {
|
this.loading = false;
|
});
|
},
|
// 打开添加信息
|
propInsert() {
|
this.asyncTitle = true;
|
this.disabled = false;
|
this.asyncDevice = true;
|
},
|
// 打开修改信息
|
propUpdate(row) {
|
this.asyncTitle = false;
|
this.disabled = false;
|
this.asyncDevice = true;
|
this.$api.Device.getDeviceDetails({
|
bigDeviceId : row.bigDeviceId
|
}).then((res) => {
|
this.$set(this.formDevice, 'bigDeviceId', res.data.bigDeviceId);
|
this.$set(this.formDevice, 'bigDeviceName', res.data.bigDeviceName);
|
this.$set(this.formDevice, 'bigDeviceModel', res.data.bigDeviceModel);
|
this.$set(this.formDevice, 'bigNumber', res.data.bigNumber);
|
this.$set(this.formDevice, 'manufacturer', res.data.manufacturer);
|
this.$set(this.formDevice, 'dateOfProduction', res.data.dateOfProduction);
|
this.$set(this.formDevice, 'useYearMonth', res.data.useYearMonth);
|
this.$set(this.formDevice, 'useLife', res.data.useLife);
|
this.$set(this.formDevice, 'shapeSize', res.data.shapeSize);
|
this.$set(this.formDevice, 'totalPower', res.data.totalPower);
|
this.$set(this.formDevice, 'totalWeight', res.data.totalWeight);
|
this.$set(this.formDevice, 'originalValue', res.data.originalValue);
|
this.$set(this.formDevice, 'yearDepreciationRate', res.data.yearDepreciationRate);
|
this.$set(this.formDevice, 'accumulatedDepreciation', res.data.accumulatedDepreciation);
|
this.$set(this.formDevice, 'netWorth', res.data.netWorth);
|
this.$set(this.formDevice, 'useStatus', res.data.useStatus);
|
this.$set(this.formDevice, 'isNeed', res.data.isNeed);
|
this.$set(this.formDevice, 'deviceSource', res.data.deviceSource);
|
this.$set(this.formDevice, 'deviceNexus', res.data.deviceNexus);
|
this.$set(this.formDevice, 'fixedPerson', res.data.fixedPerson);
|
this.$set(this.formDevice, 'userId', res.data.userId);
|
this.$set(this.formDevice, 'zrrPhone', res.data.zrrPhone);
|
this.$set(this.formDevice, 'adminPhone', res.data.adminPhone);
|
this.$set(this.formDevice, 'bigNotes', res.data.bigNotes);
|
})
|
},
|
// 打开查看
|
propDetail(row) {
|
this.asyncTitle = 3;
|
this.disabled = true;
|
this.asyncDevice = true;
|
this.$api.Device.getDeviceDetails({
|
bigDeviceId : row.bigDeviceId
|
}).then((res) => {
|
this.formDevice = res.data;
|
})
|
},
|
// 查看设备标识牌
|
propPlate(row) {
|
this.bigDeviceId = row.bigDeviceId;
|
this.asyncPlate = true;
|
this.$api.Device.getDeviceDetails({
|
bigDeviceId : row.bigDeviceId
|
}).then(res => {
|
this.plateData = res.data;
|
})
|
},
|
// 打印
|
printDevice(item) {
|
const link = document.createElement('a');
|
link.id = `link`;
|
link.href = `printpipe://4,${item.bigDeviceId}`
|
link.click()
|
},
|
// 弹框打印
|
printDeviceDialog() {
|
const link = document.createElement('a');
|
link.id = `link`;
|
link.href = `printpipe://4,${this.bigDeviceId}`
|
link.click();
|
this.asyncPlate = false;
|
},
|
// 删除设备信息
|
deleteInfo(row) {
|
this.$confirm("该操作将删除该设备信息，是否继续删除?", "提示", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
})
|
.then(() => {
|
this.$api.Device.deleteDeviceInfo({
|
bigDeviceId: row.bigDeviceId
|
})
|
.then(res => {
|
if(res.statusMsg === 'ok') {
|
this.searchDeviceInfoList(true);
|
this.$message.success("删除成功！");
|
} else {
|
this.$message.warning(res.statusMsg);
|
}
|
})
|
})
|
.catch(() => {
|
this.$message.warning("您已取消");
|
})
|
},
|
// 导出
|
exportExcel() {
|
this.$api.Device.exportDeviceExcel({
|
bigType: 1,
|
bigDeviceName: this.bigDeviceName,
|
bigNumber: this.bigNumber
|
}).then(res => {
|
downFiles(res, '特种设备信息', 'xls')
|
})
|
},
|
// 提交添加信息
|
submitInsertForm: throttle(function() {
|
this.$refs.form.validate((valid) => {
|
if(valid) {
|
const params = Object.assign({}, this.formDevice);
|
params.bigType = 1;
|
this.$api.Device.insertDeviceInfo(params).then((res) => {
|
if(res.success) {
|
this.asyncDevice = false;
|
this.$message.success('添加成功！');
|
this.searchDeviceInfoList(true);
|
} else {
|
this.$message.warning(res.statusMsg);
|
}
|
})
|
}
|
})
|
}, 3000),
|
// 提交修改信息
|
submitUpdateForm: throttle(function() {
|
this.$refs.form.validate((valid) => {
|
if(valid) {
|
const params = Object.assign({}, this.formDevice);
|
params.bigType = 1;
|
this.$api.Device.updateDeviceInfo(params).then((res) => {
|
if(res.success) {
|
this.asyncDevice = false;
|
this.$message.success('修改成功！');
|
this.searchDeviceInfoList(true);
|
} else {
|
this.$message.warning(res.statusMsg);
|
}
|
})
|
}
|
})
|
}, 3000),
|
//
|
changePerson(data) {
|
if(data) {
|
const dataInfo = this.plateUserData.find(item => item.userId == data);
|
this.$set(this.formDevice, 'zrrPhone', dataInfo.phone);
|
} else {
|
this.$set(this.formDevice, 'zrrPhone', '');
|
}
|
|
},
|
// 切换页数
|
changePageNum(page) {
|
this.pageNum = page;
|
this.searchDeviceInfoList();
|
},
|
// 切换每页条数
|
changePageSize(size) {
|
this.pageSize = size;
|
this.searchDeviceInfoList();
|
},
|
// 判断按钮权限信息
|
showButton(str) {
|
const pinia = buttonPinia();
|
return pinia.$state.buttonInfo.includes(str);
|
},
|
},
|
watch: {
|
asyncDevice(bol) {
|
if(!bol) {
|
this.formDevice = {};
|
this.$refs.form.resetFields();
|
} else {
|
this.getAllPlatUserpulldown();
|
}
|
},
|
asyncPlate(bol) {
|
if(!bol) {
|
this.plateData = {};
|
}
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
@import'@/style/layout-main.scss';
|
|
.form_flex {
|
display: flex;
|
align-items: center;
|
width: 100%;
|
|
.form_flex_slot {
|
padding: 0 10px;;
|
min-width: 60px;
|
white-space: nowrap;
|
text-align: center;
|
color: #EAEAEA;
|
background: #0B5274;
|
border: 1px solid #1B428F;
|
border-radius: 0 2px 2px 0;
|
}
|
}
|
|
.prop_plate {
|
padding: 0 15px 10px 0;
|
height: 500px;
|
|
.prop_plate_header {
|
position: relative;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
height: 120px;
|
background: #153876;
|
|
img {
|
position: absolute;
|
top: 50%;
|
left: 35px;
|
transform: translateY(-50%);
|
}
|
|
span {
|
color: #FFFFFF;
|
font-size: 70px;
|
font-weight: 600;
|
letter-spacing: 32px;
|
}
|
}
|
|
.prop_plate_content {
|
position: relative;
|
display: flex;
|
flex-wrap: wrap;
|
padding: 40px 0;
|
height: 320px;
|
background: #FFFFFF;
|
|
&::before {
|
content: '';
|
position: absolute;
|
top: 2px;
|
width: 100%;
|
height: 100%;
|
background: url('../../../../assets/sign_bg.png') no-repeat;
|
background-size: 100% 100%;
|
}
|
|
.plate_item {
|
display: flex;
|
align-items: center;
|
padding: 5px 0 8px;
|
margin: 5px 20px 10px;
|
width: calc(50% - 40px);
|
color: #050402;
|
font-size: 22px;
|
letter-spacing: 2px;
|
border-bottom: 1px solid #E4E4E4;
|
|
& > span:last-child {
|
padding-left: 20px;
|
color: #555;
|
letter-spacing: 0;
|
}
|
}
|
}
|
|
.prop_plate_footer {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
height: 50px;
|
color: #000;
|
font-size: 16px;
|
letter-spacing: 2px;
|
background: #FFFFFF;
|
|
span {
|
margin-left: 10px;
|
}
|
}
|
}
|
|
/deep/ .el-radio {
|
padding: 10px 0;
|
}
|
</style>
|
