<template>
|
<div id="container" ref="container" class="position-container">
|
<el-form ref="form" :inline="true" :model="formData" class="demo-form-inline">
|
<!-- <el-form-item label="仓库">
|
<el-select v-model="formData.storage_Id" placeholder="请选择仓库" @change="onStorageChange()">
|
<el-option v-for="(item, index) in storageList" :key="index" :label="item.storageName" :value="item.storage_Id"></el-option>
|
</el-select>
|
</el-form-item> -->
|
<el-form-item label="巷道">
|
<el-select v-model="formData.areaCode" placeholder="请选择库区" @change="onStorageAreaChange(formData.areaCode)">
|
<el-option v-for="(item, index) in storageAreaList" :key="index" :label="item.areaCode" :value="item.areaCode"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button icon="el-icon-yrt-shuaxin" @click="refreshArea">刷新</el-button>
|
<el-button type="info" @click="getPosition">空库位统计</el-button>
|
<!-- <el-button type="success" @click="emtypContainerStock(1)">空托盘出库</el-button> -->
|
<el-button type="warning" @click="emtypContainerStock(2)">空托盘入库</el-button>
|
</el-form-item>
|
<el-form-item>
|
颜色标记:
|
<el-tag style="background:#8877dd;color:white">托盘剩余空间</el-tag>
|
<el-tag style="background:#20B2AA;color:white">货物占用空间</el-tag>
|
</el-form-item>
|
<!-- <el-form-item>
|
<el-tag type="danger" style="font-size: 20px; height: 35px;" >{{infoTotal}}</el-tag>
|
</el-form-item> -->
|
<br />
|
<el-form-item label="巷道">
|
<span id="i_storageArea" class="area-content">{{ areaData.areaCode }}</span>
|
</el-form-item>
|
<el-form-item label="列数">
|
<span id="i_colNum" class="area-content">{{ areaData.columnNum }}</span>
|
</el-form-item>
|
<el-form-item :label="areaData.rowTitle">
|
<span id="i_rowNum" class="area-content">{{ areaData.rowNum }}</span>
|
</el-form-item>
|
</el-form>
|
|
<!-- BEGIN PAGE -->
|
<div class="layoutarea">
|
<div class="position-layout">
|
<!--整体外框-->
|
<div v-drawposition="{areaData: areaData, storageData: storageData, shelveDataList: shelveDataList, isViewer: true, isRefresh: isRefresh, updateRefresh:updateRefresh, displayDetail: displayDetail}" ref="refDraw" class="table-wrap clearfix">
|
</div>
|
</div>
|
<!--整体外框-->
|
</div>
|
<!-- END PAGE -->
|
<el-dialog :title="emtypTitle" :visible.sync="emtypContainer" width="450px">
|
<el-form :model="emtypform" >
|
<el-form-item label="" :label-width="formLabelWidth" v-if="tags">
|
<el-tag type="warning" style=" font-size: 20px;">请一定从一号出口入空托盘!!!</el-tag>
|
</el-form-item>
|
<el-form-item label="出库库位" :label-width="formLabelWidth" v-if="isOUT">
|
<el-input v-model="emtypform.name" autocomplete="off" style="width: 200px;" ></el-input>
|
</el-form-item>
|
<el-form-item label="选择托盘类型" :label-width="formLabelWidth" v-if="isIN">
|
<el-select v-model="emtypform.type" placeholder="请选择托盘类型">
|
<el-option label="大托盘" :value="2"></el-option>
|
<el-option label="小托盘" :value="1"></el-option>
|
</el-select>
|
</el-form-item>
|
<!-- <el-form-item :label="positionStation" :label-width="formLabelWidth">
|
<el-select v-model="emtypform.station" placeholder="请选择站点号">
|
<el-option label="入口" :value="1026"></el-option>
|
<el-option label="小托盘入口" :value="1021"></el-option>
|
<el-option label="一号出口" :value="1001"></el-option>
|
</el-select>
|
</el-form-item> -->
|
</el-form>
|
<div slot="footer" class="dialog-footer">
|
<el-button @click="reset">取 消</el-button>
|
<el-button type="primary" @click="emtypContainerAdd()">确 定</el-button>
|
</div>
|
</el-dialog>
|
<el-dialog :visible.sync="emtypPosition" width="1050px" >
|
<div slot="title" >
|
<span style=" font-size: 35px;color: #ffdd11; background-color:#474d4b;">------------------------------------空库位统计---------------------------------</span>
|
</div>
|
|
<el-table :data="emtypPositionform" border stripe :cell-style="cellStyle" style="width: 1201px; font-size: 25px;">
|
<el-table-column label="序号" type="index" width="80"> </el-table-column>
|
<el-table-column property="name" label="库位高度等级"></el-table-column>
|
<el-table-column property="quantity" label="剩余库位数/总库位" width="250"></el-table-column>
|
</el-table>
|
</el-dialog>
|
<!-- 货位库存明细对话框 -->
|
<el-dialog v-dialogDrag :visible.sync="detailVisible" :top="common.getDialogTop()" :title="detailTitle" class="dialog-container" width="830px">
|
<el-table ref="detailTable" :data="productPositionList" :max-height="'300px'" size="mini" style="width: 100%">
|
<el-table-column prop="className" label="类别" width="120">
|
</el-table-column>
|
<el-table-column prop="positionName" label="货位名称" width="110">
|
</el-table-column>
|
<el-table-column prop="productCode" label="物料编号" width="160">
|
</el-table-column>
|
<el-table-column prop="productName" label="物料名称" width="170">
|
</el-table-column>
|
<el-table-column prop="productStorage" label="库存量" width="90">
|
</el-table-column>
|
<el-table-column prop="inStorageDate" label="入库时间" width="140">
|
<template slot-scope="{row, column, $index}">
|
{{ common.formatDate(row.inStorageDate, "YYYY-MM-DD") }}
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="detailVisible = false">关闭</el-button>
|
</span>
|
</el-dialog>
|
|
</div>
|
</template>
|
|
<script>
|
import PositionDialog from './components/position-dialog'
|
import { drawposition } from './directives/drawposition.js'
|
import { format } from 'url'
|
|
export default {
|
name: 'storage-setting-position-viewer',
|
components: {
|
PositionDialog
|
},
|
directives: {
|
drawposition
|
},
|
data() {
|
return {
|
emtypform: { name: '', type: '', station: '' },
|
emtypPositionform: [{ name: '一排小库位', quantity: 20 }],
|
emtypTitle: '',
|
tags: false,
|
isOUT: false,
|
isIN: false,
|
positionStation: '',
|
|
emtypContainer: false,
|
|
emtypPosition: false,
|
formLabelWidth: '120px',
|
isLoading: false,
|
//库位统计信息
|
infoTotal: '库位统计：',
|
// 表单数据
|
formData: {
|
storage_Id: 87,
|
storageName: '立体库',
|
areaCode: 1
|
},
|
// 仓库下拉框值
|
storageList: [],
|
// 库区下拉框值
|
storageAreaList: [],
|
// 库区数据
|
areaData: {
|
storage_Id: 87,
|
storageName: '立体库',
|
positionType: null,
|
areaCode: 'A',
|
pickMode: 'U型',
|
shelveMode: '立体货架',
|
maxCapacity: 100,
|
channelNum: 0,
|
rowNum: 0,
|
columnNum: 0,
|
shelveNumA_1: 0,
|
shelveNumA_2: 0,
|
shelveNumB_1: 0,
|
shelveNumB_2: 0,
|
positionRegular: null,
|
channelRegular: null,
|
shelvesRegular: null,
|
rowRegular: null,
|
columnRegular: null,
|
action: 'add',
|
rowTitle: '层数'
|
},
|
// 仓库数据
|
storageData: {
|
positionRegular: null,
|
channelRegular: null,
|
shelvesRegular: null,
|
rowRegular: null,
|
columnRegular: null,
|
action: 'add'
|
},
|
// 货架信息
|
shelveDataList: [],
|
// 刷新货位数据
|
isRefresh: false,
|
// 显示货位库存详情对话框
|
detailVisible: false,
|
detailTitle: '货位库存详情',
|
// 货位库存详情数据列表
|
productPositionList: []
|
}
|
},
|
created() {
|
this.common.loadDropDown([501], { projectName: 'Rattan.ERP.Storage' })
|
this.getStorageList()
|
this.onStorageChange()
|
this.onStorageAreaChange(1)
|
this.formData.areaCode = 1
|
//this.getPosition()
|
},
|
activated() {
|
// SaaS模块权限
|
this.common.hasSaaSAuth('货位库存可视化', this.$refs.container)
|
},
|
methods: {
|
emtypContainerStock(inorout) {
|
if (inorout == 1) {
|
this.emtypTitle = '空托盘出库'
|
this.emtypContainer = true
|
// this.positionStation = '请选择出口位置'
|
this.isIN = false
|
this.isOUT = true
|
this.tags = false
|
} else {
|
this.emtypTitle = '空托盘入库'
|
this.tags = true
|
this.emtypContainer = true
|
// this.positionStation = '请选择入口位置'
|
this.isIN = true
|
this.isOUT = false
|
}
|
},
|
|
// 获得仓储列表
|
getStorageList() {
|
var url = '/api/basicInfo/base/storage/getList'
|
var params = {}
|
this.common.ajax(
|
url,
|
params,
|
res => {
|
this.common.showMsg(res)
|
if (res.result) {
|
this.storageList = res.data
|
}
|
},
|
true
|
)
|
},
|
//空托盘出入库
|
emtypContainerAdd() {
|
const url = '/api/task/emtypContainerOUtandIN'
|
var _creator = localStorage.getItem("creator") || ''; //创建人
|
//debugger
|
var params = ''
|
if (this.emtypTitle === '空托盘出库') {
|
if (this.emtypform.name === '') {
|
this.$message.error('库位名称不能为空')
|
return
|
}
|
|
params = {
|
name: this.emtypform.name,
|
creator:_creator
|
}
|
} else {
|
if (this.emtypform.type === '') {
|
this.$message.error('请选择托盘类型')
|
return
|
}
|
|
params = {
|
type: this.emtypform.type,
|
creator:_creator
|
}
|
}
|
this.common.ajax(url, params, res => {
|
this.common.showMsg(res)
|
if (res.result) {
|
this.$message.success('已生成任务')
|
} else {
|
this.$message.error(res.msg)
|
}
|
})
|
},
|
reset() {
|
this.emtypform.type = ''
|
this.emtypform.name = ''
|
this.emtypform.station = ''
|
this.emtypContainer = false
|
},
|
// 仓库选择改变后，获得库区列表
|
onStorageChange() {
|
this.storageAreaList = []
|
this.formData.areaCode = null
|
// this.storageData = this.storageList.find(item => item.storage_Id === storage_Id);
|
this.formData.storageName = '立体库'
|
|
var url = '/api/basicInfo/base/position/getStorageAreaList'
|
var params = {
|
storage_Id: 87
|
}
|
this.common.ajax(
|
url,
|
params,
|
res => {
|
this.common.showMsg(res)
|
if (res.result) {
|
this.storageAreaList = res.data
|
}
|
},
|
true
|
)
|
},
|
|
// 库区选择改变后
|
onStorageAreaChange(areaCode) {
|
this.areaData = this.storageAreaList.find(item => {
|
return item.areaCode === areaCode
|
})
|
|
this.loadArea(areaCode)
|
},
|
|
// 加载库区数据
|
loadArea(areaCode) {
|
this.shelveDataList = [] // 初始化货架数据
|
this.isRefresh = true
|
|
var url = '/api/basicInfo/base/position/getStorageAreaInfo'
|
var params = {
|
storage_Id: this.formData.storage_Id,
|
areaCode: areaCode
|
}
|
this.common.ajax(
|
url,
|
params,
|
res => {
|
this.common.showMsg(res)
|
if (res.result) {
|
this.areaData = res.data
|
this.areaData.rowTitle = '层数'
|
if (this.areaData.shelveMode === '地堆') {
|
this.areaData.channelNum_didui = this.areaData.channelNum
|
this.areaData.rowNum_didui = this.areaData.rowNum
|
this.areaData.columnNum_didui = this.areaData.columnNum
|
this.areaData.rowTitle = '行数'
|
} else if (this.areaData.shelveMode === '立体货架') {
|
if (this.areaData.pickMode === 'Z型') {
|
this.areaData.shelveNumZ_1 = this.areaData.shelveNumA_1
|
this.areaData.shelveNumZ_2 = this.areaData.shelveNumA_2
|
}
|
}
|
this.storageData.action = 'modify'
|
|
this.loadShelveList(areaCode) // 加载货架
|
this.$nextTick(() => {
|
this.isRefresh = false
|
})
|
}
|
},
|
true
|
)
|
},
|
|
// 加载货架数据
|
loadShelveList(areaCode) {
|
this.shelveDataList = [] // 初始化货架数据
|
|
var url = '/api/basicInfo/base/position/loadShelveList'
|
var params = {
|
storage_Id: this.formData.storage_Id,
|
areaCode: areaCode
|
}
|
this.common.ajax(
|
url,
|
params,
|
res => {
|
this.common.showMsg(res)
|
if (res.result) {
|
this.shelveDataList = res.data
|
}
|
},
|
true
|
)
|
},
|
|
// 刷新
|
refreshArea() {
|
this.isRefresh = true
|
var areaCode = this.formData.areaCode
|
if (!areaCode) return
|
this.loadArea(areaCode)
|
//this.getPosition()
|
},
|
//改变颜色
|
cellStyle({ row, rowIndex }) {
|
if (rowIndex == 0 || rowIndex == 1) {
|
return 'background: #8888aa;color:white'
|
} else {
|
if (rowIndex == 2 ) {
|
return 'background: #99aa8a;color:white'
|
} else {
|
return 'background: #dd9877;color:white'
|
}
|
}
|
},
|
//获取货位统计
|
getPosition() {
|
const url = '/api/task/getPositionTotal'
|
|
const params = {
|
paparm: '' //输入框的值
|
}
|
var callback = res => {
|
//debugger
|
if (res.statusCode !== 200) return (this.infoTotal = '库位统计:获取失败')
|
this.emtypPositionform = res.data
|
var placeTotal = [108, 500, 32, 80, 64, 74, 22, 104, 156]
|
let numbers = 0
|
this.emtypPositionform.map(datas => {
|
//datas.quantity = datas.quantity + '/' + placeTotal[numbers]
|
datas.quantity = datas.quantity + '/' + datas.all_quantity
|
numbers++
|
})
|
|
this.emtypPosition = true
|
}
|
this.common.ajax(url, params, callback, true)
|
},
|
// 新建库区
|
onConfirm(formData) {
|
this.areaData = JSON.parse(JSON.stringify(formData))
|
},
|
|
// 修改库区数据
|
modifyAreaData() {
|
const positionTmpl = this.storageData.positionRegular
|
if (!positionTmpl) {
|
this.$message.error('货位编码规则为空，请设置好货位编码规则！')
|
return
|
}
|
|
if (this.storageData.action !== 'modify') {
|
this.$message.error('当前库区数据未保存！')
|
return
|
}
|
},
|
// 修改刷新状态
|
updateRefresh(isRefresh) {
|
this.isRefresh = isRefresh
|
},
|
// 显示库存详情数据
|
displayDetail(cellTarget, positionName) {
|
this.detailVisible = true
|
this.detailTitle = '货位库存详情-' + positionName
|
// 获得库存数据
|
const url = '/api/basicInfo/base/position/getPositionStorageList'
|
const params = {
|
storage_Id: this.formData.storage_Id,
|
areaCode: this.formData.areaCode,
|
positionName: positionName
|
}
|
this.common.ajax(
|
url,
|
params,
|
res => {
|
this.common.showMsg(res)
|
if (res.result) {
|
this.productPositionList = res.data
|
}
|
},
|
this.$refs.detailTable
|
)
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.position-container {
|
padding: 10px;
|
background-color: white;
|
// background-color: rgb(62, 117, 199);
|
border-bottom: 1px solid #eee;
|
/deep/ .el-form-item__label {
|
padding: 0;
|
&::after {
|
content: '：';
|
}
|
}
|
|
.layoutarea {
|
overflow-x: auto;
|
overflow-y: visible;
|
.position-layout {
|
width: 50000px;
|
/* 84 = navbar + tags-view = 50 +34 */
|
max-height: calc(100vh - 254px);
|
}
|
}
|
|
/* table-wrap */
|
/deep/ .table-wrap {
|
position: relative;
|
display: inline-block;
|
* {
|
margin: 0;
|
padding: 0;
|
list-style: none;
|
font-family: '微软雅黑', Arial;
|
}
|
.table-row {
|
position: relative;
|
background-color: #fff;
|
// background-color: color:darkcyan;
|
min-height: 100px;
|
padding: 10px 0 10px 0;
|
border-bottom: 1px solid #ccc;
|
.column-num {
|
width: 35px;
|
height: 50px;
|
position: absolute;
|
margin-top: -25px;
|
left: 10px;
|
top: 50%;
|
font-size: 14px;
|
color: #666;
|
z-index: 100;
|
cursor: pointer;
|
}
|
}
|
|
.table-row.didui {
|
margin: 20px 0;
|
}
|
|
.table-row .column-num p {
|
font-size: 24px;
|
font-family: Arial, Helvetica, sans-serif;
|
font-weight: 400;
|
color: #333;
|
}
|
|
.table-row .t-box {
|
position: relative;
|
}
|
|
.table-row .t-box .guanlian-line {
|
display: block;
|
width: 20px;
|
background-color: #fff;
|
border: 1px solid #ccc;
|
border-right: none;
|
height: 10px;
|
position: absolute;
|
top: 50%;
|
left: 60px;
|
}
|
|
.table-row .column-line {
|
min-height: 100px;
|
padding-left: 100px;
|
}
|
|
.table-row .column-line.didui {
|
padding-left: 50px;
|
}
|
|
.table-row .column-line .nood-a,
|
.table-row .column-line .nood-b {
|
position: relative;
|
}
|
|
.table-row .column-line .nood-a .nood-text,
|
.table-row .column-line .nood-b .nood-text {
|
display: block;
|
width: 18px;
|
height: 40px;
|
line-height: 1.5;
|
position: absolute;
|
top: 50%;
|
margin-top: 15px;
|
left: -20px;
|
font-size: 12px;
|
color: #666;
|
border: 1px solid #ccc;
|
text-align: center;
|
}
|
|
.table-row .column-line .nood-b .nood-text {
|
margin-top: -50px !important;
|
}
|
|
.table-row .column-line .table-reset {
|
display: inline-block;
|
margin-left: 50px;
|
position: relative;
|
vertical-align: top;
|
}
|
|
.table-row .column-line .table-reset .table-num {
|
font-size: 14px;
|
color: #666;
|
font-weight: 400;
|
margin: 0 0 25px 0;
|
}
|
|
.table-row .column-line .table-reset .table-num.didui {
|
margin: 0 0 0px 0;
|
}
|
|
.table-row .column-line .table-reset .table-num strong {
|
font-size: 24px;
|
font-weight: 400;
|
padding-left: 5px;
|
color: #333;
|
cursor: pointer;
|
}
|
|
.table-row .column-line .table-reset .table-num.didui strong {
|
display: none;
|
}
|
|
.table-row .column-line .table-reset .table-list-ul {
|
position: relative;
|
display: table;
|
}
|
|
/* .table-row .column-line .table-reset .table-list-ul:last-child{ border-bottom:1px solid #ccc;} */
|
|
.table-row .column-line .table-reset .table-list-ul li {
|
position: relative;
|
min-width: 100px;
|
padding-right: 5px;
|
height: 30px;
|
line-height: 30px;
|
border: 1px solid #ccc;
|
border-right: none;
|
border-bottom: none;
|
display: table-cell;
|
font-size: 12px;
|
padding-left: 5px;
|
color: #666;
|
cursor: pointer;
|
}
|
|
.table-row .column-line .table-reset .table-list-ul li.border-bottom {
|
border-bottom: 1px solid #ccc;
|
}
|
|
.table-row .column-line .table-reset .table-list-ul li:last-child {
|
border-right: 1px solid #ccc;
|
}
|
|
.table-row .column-line .table-reset .table-list-ul li .t-n {
|
position: absolute;
|
top: -30px;
|
left: 10px;
|
font-size: 12px;
|
cursor: pointer;
|
}
|
|
.table-row .column-line .table-reset .table-list-ul li .b-n {
|
position: absolute;
|
bottom: -30px;
|
left: 10px;
|
font-size: 12px;
|
cursor: pointer;
|
}
|
|
.table-row .column-line .table-reset .table-list-ul li .l-n {
|
position: absolute;
|
left: -25px;
|
top: 1px;
|
font-size: 12px;
|
cursor: pointer;
|
}
|
|
/* B面style */
|
|
.table-row .column-line .nood-b {
|
margin-top: 20px;
|
}
|
|
.table-row .column-line .nood-b .table-num {
|
font-size: 14px;
|
color: #666;
|
font-weight: 400;
|
margin: 20px 0 0 0;
|
}
|
|
.nood-b .table-reset .table-list-ul:last-child {
|
border-bottom: 10px solid #ccc !important;
|
background-color: red !important;
|
}
|
|
/* 图标类型 */
|
|
.postype-1 {
|
display: inline-block;
|
width: 8px;
|
height: 8px;
|
background: url(/static/images/type.png) no-repeat 0 0;
|
vertical-align: middle;
|
position: absolute;
|
bottom: 3px;
|
right: 3px;
|
}
|
|
.postype-2 {
|
display: inline-block;
|
width: 8px;
|
height: 8px;
|
background: url(/static/images/type.png) no-repeat -8px 0;
|
vertical-align: middle;
|
position: absolute;
|
bottom: 3px;
|
right: 3px;
|
}
|
|
.postype-3 {
|
display: inline-block;
|
width: 8px;
|
height: 8px;
|
background: url(/static/images/type.png) no-repeat -16px 0;
|
vertical-align: middle;
|
position: absolute;
|
bottom: 3px;
|
right: 3px;
|
}
|
|
.postype-4 {
|
display: inline-block;
|
width: 8px;
|
height: 8px;
|
background: url(/static/images/type.png) no-repeat -24px 0;
|
vertical-align: middle;
|
position: absolute;
|
bottom: 3px;
|
right: 3px;
|
}
|
|
.postype-5 {
|
display: inline-block;
|
width: 8px;
|
height: 8px;
|
background: url(/static/images/type.png) no-repeat -32px 0;
|
vertical-align: middle;
|
position: absolute;
|
bottom: 3px;
|
right: 3px;
|
}
|
|
.postype-6 {
|
display: inline-block;
|
width: 8px;
|
height: 8px;
|
background: url(/static/images/type.png) no-repeat -40px 0;
|
vertical-align: middle;
|
position: absolute;
|
bottom: 3px;
|
right: 3px;
|
}
|
|
.postype-7 {
|
display: inline-block;
|
width: 8px;
|
height: 8px;
|
background: url(/static/images/type.png) no-repeat -48px 0;
|
vertical-align: middle;
|
position: absolute;
|
bottom: 3px;
|
right: 3px;
|
}
|
|
.locked {
|
display: inline-block;
|
width: 8px;
|
height: 8px;
|
background: url(/static/images/type.png) no-repeat -56px 0;
|
vertical-align: middle;
|
position: absolute;
|
top: 3px;
|
right: 3px;
|
}
|
|
.isMixProduct {
|
display: inline-block;
|
width: 8px;
|
height: 8px;
|
background: url(/static/images/type.png) no-repeat -64px 0;
|
vertical-align: middle;
|
position: absolute;
|
top: 3px;
|
right: 3px;
|
}
|
|
.nostorage {
|
margin: 5px;
|
color: #dcdcdc;
|
}
|
.storageRate {
|
height: 6px;
|
margin-right: 3px;
|
border: 1px solid #eee;
|
margin-bottom: 2px;
|
}
|
.productStorage {
|
padding: 1px;
|
min-width: 16px;
|
text-align: center;
|
background-color: #f60;
|
color: white;
|
float: left;
|
margin-right: 5px;
|
font-size: 9px;
|
line-height: 1.5;
|
}
|
.validQuantity {
|
padding: 1px;
|
min-width: 16px;
|
text-align: center;
|
background-color: #2eade8;
|
color: white;
|
float: left;
|
margin-right: 5px;
|
font-size: 9px;
|
line-height: 1.5;
|
}
|
.placeholderStorage {
|
padding: 1px;
|
min-width: 16px;
|
text-align: center;
|
background-color: #080706;
|
color: white;
|
float: left;
|
margin-right: 5px;
|
font-size: 9px;
|
line-height: 1.5;
|
}
|
.placeholderStorage {
|
padding: 1px;
|
min-width: 16px;
|
text-align: center;
|
background-color: #080706;
|
color: white;
|
float: left;
|
margin-right: 5px;
|
font-size: 9px;
|
line-height: 1.5;
|
}
|
.plateCount {
|
padding: 1px;
|
min-width: 16px;
|
text-align: center;
|
background-color: #850640;
|
color: white;
|
float: left;
|
margin-right: 5px;
|
font-size: 9px;
|
line-height: 1.5;
|
}
|
.infoSize {
|
font-size: 65px;
|
line-height: 40px;
|
}
|
}
|
}
|
</style>
|
