430/vue_mdc_430_new.git

			@@ -1,107 +1,198 @@
			<template>
			<div style="width: 100%;">
			<a-card :bordered="false">
			<div :bordered="false">
			<!-- 查询区域 -->
			<div class="table-page-search-wrapper">
			<a-form layout="inline" @keyup.enter.native="searchQuery">
			<a-row :gutter="24">
			<a-col :md="6" :sm="6">
			<a-form-item label="时间">
			<a-range-picker @change="dateParamChange" :disabledDate="disabledDate" format="YYYYMMDD" v-model="dates"/>
			<a-col :md="4" :sm="4">
			<a-form-item label="设备类型">
			<a-select placeholder="请选择设备类型" :triggerChange="true" v-model="queryParam.equipmentType" :allowClear="true">
			<a-select-option v-for='item in selectList' :key='item.id' :value='item.equipmentTypeName'>
			{{item.equipmentTypeName}}
			</a-select-option>
			</a-select>
			</a-form-item>
			</a-col>
			<a-col :lg="2" :md="3" :sm="3" :xs="3">
			<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
			<a-col :md="4" :sm="4">
			<a-form-item label="驱动类型">
			<a-auto-complete
			v-model="queryParam.driveType"
			:data-source="driveTypeList"
			placeholder="请选择驱动类型"
			:filter-option="filterOption"
			:allowClear="true"
			/>
			</a-form-item>
			</a-col>
			<a-col :lg="2" :md="3" :sm="3" :xs="3">
			<a-button type="primary" @click="searchReset" icon="reload">重置</a-button>
			<a-col :md="6" :sm="6">
			<a-form-item label="时间">
			<a-range-picker @change="dateParamChange" :disabledDate="disabledDate" format="YYYYMMDD" v-model="dates" :allowClear="false"/>
			</a-form-item>
			</a-col>
			<a-col :lg="2" :md="3" :sm="3" :xs="3">
			<a-button type="primary" @click="exportExcel" icon="download">导出</a-button>
			<a-col :md="4" :sm="4" :xs="4">
			<a-form-item label="设备级别">
			<j-dict-select-tag placeholder="请选择设备级别" dictCode="device_level" v-model="queryParam.deviceLevel"
			allow-clear/>
			</a-form-item>
			</a-col>
			<a-col :md="4" :sm="4" :xs="4">
			<a-form-item label="设备种类">
			<j-dict-select-tag placeholder="请选择设备种类" dictCode="device_category"
			v-model="queryParam.deviceCategory"
			allow-clear/>
			</a-form-item>
			</a-col>
			<!--<a-col :md="8" :sm="8" style="display: flex;align-items: flex-start;-webkit-align-items: flex-start;justify-content: space-between;">-->
			<!--<table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;margin-left: 24px">-->
			<!--<tr>-->
			<!--<td v-for="(item, index) in identifying">{{item.title}}</td>-->
			<!--</tr>-->
			<!--<tr>-->
			<!--<td style="text-align:center;" v-for="(item, index) in identifying">-->
			<!--<div class="identifyingclass" :style="{background: item.color}"></div>-->
			<!--</td>-->
			<!--<!–<td style="text-align:center;"><div style="width: 55px;height: 15px;background-color: #e8ff37;display:inline-block"></div></td>–>-->
			<!--<!–<td style="text-align:center;"><div style="width: 55px;height: 15px;background-color: #99ff4e;display:inline-block"></div></td>–>-->
			<!--</tr>-->
			<!--</table>-->
			<!--</a-col>-->
			</a-row>
			<a-row :gutter="24">
			<a-col :md="15" :sm="15">
			<a-checkbox-group :value="checkedList" :default-value="['lyl']" :options="efficiencyOptions"
			@change="efficiencyOptionsOnChange"/>
			<a-row :gutter="24" type="flex" align="middle">
			<a-col :md="24" :sm="24" :xs="24"
			style="display: flex;justify-content: space-between;align-items: flex-start">
			<div>
			<a-space style="margin-right: 20px">
			<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
			<a-button type="primary" @click="searchReset" icon="reload">重置</a-button>
			<a-button type="primary" @click="exportExcel" icon="download">导出</a-button>
			<a-button type="primary" icon="printer" v-print="'#EfficiencyPO'"
			v-has="'EfficiencyPO:print'">打印
			</a-button>
			</a-space>
			<a-checkbox-group :value="checkedList" :default-value="['lyl']" :options="efficiencyOptions"
			@change="efficiencyOptionsOnChange"/>
			</div>
			<table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;">
			<tr>
			<td v-for="(item, index) in identifying">{{item.title}}</td>
			</tr>
			<tr>
			<td style="text-align:center;" v-for="(item, index) in identifying">
			<div class="identifyingclass" :style="{background: item.color}"></div>
			</td>
			</tr>
			</table>
			</a-col>
			<!--<a-col :md="6" :sm="6">-->
			<!--<a-space>-->
			<!--<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>-->
			<!--<a-button type="primary" @click="searchReset" icon="reload">重置</a-button>-->
			<!--<a-button type="primary" @click="exportExcel" icon="download">导出</a-button>-->
			<!--<a-button type="primary" icon="printer" v-print="'#EfficiencyPO'" v-has="'EfficiencyPO:print'">打印</a-button>-->
			<!--</a-space>-->
			<!--</a-col>-->
			<!--<a-col :md="18" :sm="18">-->
			<!--<a-checkbox-group :value="checkedList" :default-value="['lyl']" :options="efficiencyOptions"-->
			<!--@change="efficiencyOptionsOnChange"/>-->
			<!--</a-col>-->
			</a-row>
			</a-form>
			</div>
			<div style="width: 530px;position: absolute;top: 20px; right:1.5%;">
			<table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;">
			<tr>
			<td v-for="(item, index) in identifying">{{item.title}}</td>
			</tr>
			<tr>
			<td style="text-align:center;" v-for="(item, index) in identifying">
			<div class="identifyingclass" :style="{background: item.color}"></div>
			</td>
			<!--<td style="text-align:center;"><div style="width: 55px;height: 15px;background-color: #e8ff37;display:inline-block"></div></td>-->
			<!--<td style="text-align:center;"><div style="width: 55px;height: 15px;background-color: #99ff4e;display:inline-block"></div></td>-->
			</tr>
			</table>
			</div>
			<div class="container" id="EfficiencyPO" style="margin-top: 20px;">
			<div class="table2">
			<table class="dataContent table" border="1" cellspacing="0" cellpadding="0" style="white-space: nowrap">
			<thead>
			<tr class="thead fixed equipname">
			<th class="thgu dong1 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;"></th>
			<th class="thgu dong2 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;"></th>
			<th class="thgu dong3 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;"></th>
			<th class="thgu dong4 name" rowspan="2" style="min-width: 100px; max-width: 100px;width: 100px;">设备编号</th>
			<th class="thgu dong5 name" rowspan="2" style="min-width: 150px; max-width: 150px;width: 150px;">设备名称</th>
			<th class="thgu dong6 name" rowspan="2" style="min-width: 100px; max-width: 100px;width: 100px;">设备类型</th>
			<!--<th rowspan="2">组别</th>-->
			<template v-for="(tableHead, index) in tableHeads">
			<th class="timeth" :colspan="checkedList.length">{{tableHead}}</th>
			</template>
			</tr>
			<tr class="thead notfixed gudingth">
			<template v-for="(tableHead, index) in tableHeads">
			<th>开动率(%)</th>
			<th v-if="checkedList.indexOf('kjl') > -1">开机率(%)</th>
			<th v-if="checkedList.indexOf('kjsj') > -1">开机时间(s)</th>
			<th v-if="checkedList.indexOf('jgsj') > -1">加工时间(s)</th>
			<th v-if="checkedList.indexOf('djsj') > -1">待机时间(s)</th>
			<th v-if="checkedList.indexOf('gjsj') > -1">关机时间(s)</th>
			</template>
			</tr>
			</thead>
			<tbody>
			<tr class="mathData" v-for="(item, index) in dataList">
			<td class="tdgu kaitou wenzi" :rowspan="item.level1span" :class="{hidden: item.level1dis,noExl:item.level1dis}" v-show="!item.level1dis">{{item.level1}}</td>
			<td class="tdgu1 kaitou wenzi" :rowspan="item.level2span" :class="{hidden: item.level2dis,noExl:item.level2dis}" v-show="!item.level2dis">{{item.level2}}</td>
			<td class="tdgu2 kaitou wenzi" :rowspan="item.level3span" :class="{hidden: item.level3dis,noExl:item.level3dis}" v-show="!item.level3dis">{{item.level3}}</td>
			<td class="tdgu3 kaitou">{{item.equipmentId}}</td>
			<td class="tdgu4 kaitou">{{item.equipmentName}}</td>
			<td class="tdgu5 kaitou">{{item.equipmentType}}</td>
			<!--<td>{{item.tierType}}</td>-->
			<template v-for="(tableHead, index) in item.dataList">
			<td :style="{background:tableHead.color }">{{tableHead.startRate \| numFilter}}</td>
			<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('kjl') > -1">
			{{tableHead.openRate \| numFilter}}
			</td>
			<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('kjsj') > -1">
			{{tableHead.openLong}}
			</td>
			<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('jgsj') > -1">
			{{tableHead.processLong}}
			</td>
			<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('djsj') > -1">
			{{tableHead.waitLong}}
			</td>
			<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('gjsj') > -1">
			{{tableHead.closeLong}}
			</td>
			</template>
			</tr>
			</tbody>
			</table>
			<!--<div style="width: 530px;position: absolute;top: 0; right:1.5%;">-->
			<!--<table cellpadding="5" cellspacing="1" style="border: 1px solid darkgray;">-->
			<!--<tr>-->
			<!--<td v-for="(item, index) in identifying">{{item.title}}</td>-->
			<!--</tr>-->
			<!--<tr>-->
			<!--<td style="text-align:center;" v-for="(item, index) in identifying">-->
			<!--<div class="identifyingclass" :style="{background: item.color}"></div>-->
			<!--</td>-->
			<!--<!–<td style="text-align:center;"><div style="width: 55px;height: 15px;background-color: #e8ff37;display:inline-block"></div></td>–>-->
			<!--<!–<td style="text-align:center;"><div style="width: 55px;height: 15px;background-color: #99ff4e;display:inline-block"></div></td>–>-->
			<!--</tr>-->
			<!--</table>-->
			<!--</div>-->
			<a-spin :spinning="spinning">
			<div class="container" id="EfficiencyPO" style="margin-top: 20px;" >
			<div class="table2">
			<table class="dataContent table" border="1" cellspacing="0" cellpadding="0" style="white-space: nowrap" v-if="dataList.length>0">
			<thead>
			<tr class="thead fixed equipname">
			<th class="thgu dong1 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;">公司</th>
			<th class="thgu dong2 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;">车间</th>
			<th class="thgu dong3 name" rowspan="2" style="min-width: 50px; max-width: 50px;width: 50px;">工段</th>
			<th class="thgu dong4 name" rowspan="2" style="min-width: 100px; max-width: 100px;width: 100px;">设备编号</th>
			<th class="thgu dong5 name" rowspan="2" style="min-width: 162px; max-width: 162px;width: 162px;">设备名称</th>
			<th class="thgu dong6 name" rowspan="2" style="min-width: 100px; max-width: 100px;width: 100px;">设备类型</th>
			<!--<th rowspan="2">组别</th>-->
			<template v-for="(tableHead, index) in tableHeads">
			<th class="timeth" :colspan="checkedList.length">{{tableHead}}</th>
			</template>
			</tr>
			<tr class="thead notfixed gudingth">
			<template v-for="(tableHead, index) in tableHeads">
			<th>开动率(%)</th>
			<th v-if="checkedList.indexOf('kjl') > -1">开机率(%)</th>
			<th v-if="checkedList.indexOf('kjsj') > -1">开机时间(小时)</th>
			<th v-if="checkedList.indexOf('jgsj') > -1">加工时间(小时)</th>
			<th v-if="checkedList.indexOf('djsj') > -1">待机时间(小时)</th>
			<th v-if="checkedList.indexOf('gjsj') > -1">关机时间(小时)</th>
			</template>
			</tr>
			</thead>
			<tbody>
			<tr class="mathData" v-for="(item, index) in dataList">
			<template v-if="item.level1!=='合计'&&item.level1!=='平均值'">
			<td class="tdgu kaitou" :rowspan="item.level1span" :class="{hidden: item.level1dis,noExl:item.level1dis}" v-show="!item.level1dis">
			<div class="wenzi">
			{{item.level1}}
			</div>
			</td>
			<td class="tdgu1 kaitou" :rowspan="item.level2span" :class="{hidden: item.level2dis,noExl:item.level2dis}" v-show="!item.level2dis">
			<div class="wenzi">
			{{item.level2}}
			</div>
			</td>
			<td class="tdgu2 kaitou" :rowspan="item.level3span" :class="{hidden: item.level3dis,noExl:item.level3dis}" v-show="!item.level3dis">
			<div class="wenzi">
			{{item.level3}}
			</div>
			</td>
			<td class="tdgu3 kaitou">{{item.equipmentId}}</td>
			<td style="min-width: 162px; max-width: 162px;width: 162px;" class="tdgu4 kaitou">{{item.equipmentName}}</td>
			<td class="tdgu5 kaitou">{{item.equipmentType}}</td>
			</template>

			<template v-else>
			<td colspan="6" class="tdgu kaitou">{{item.level1}}</td>
			</template>
			<!--<td>{{item.tierType}}</td>-->
			<template v-for="(tableHead, index) in item.dataList">
			<td :style="{background:tableHead.color }">{{tableHead.startRate \| numFilter}}</td>
			<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('kjl') > -1">
			{{tableHead.openRate \| numFilter}}
			</td>
			<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('kjsj') > -1">
			{{tableHead.openLong \| getFormattedTime}}
			</td>
			<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('jgsj') > -1">
			{{tableHead.processLong \| getFormattedTime}}
			</td>
			<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('djsj') > -1">
			{{tableHead.waitLong \| getFormattedTime}}
			</td>
			<td :style="{background:tableHead.color }" v-if="checkedList.indexOf('gjsj') > -1">
			{{tableHead.closeLong \| getFormattedTime}}
			</td>
			</template>
			</tr>
			</tbody>
			</table>
			</div>
			</div>
			</div>
			</a-card>
			</a-spin>
			</div>
			</div>
			</template>

			@@ -111,6 +202,8 @@
			import $ from 'jquery'
			import '@/components/table2excel/table2excel'
			import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api'
			import api from '@/api/mdc'

			export default {
			name: 'EfficiencyPOList',
			components: {},
			@@ -120,10 +213,12 @@
			typeParent:1,
			typeEquipment:1,
			dates: [],
			selectList:[],
			queryParam: {},
			queryParamEquip:{},
			queryParamPeople:{},
			identifying: [],
			driveTypeList:[],
			efficiencyOptions: [
			{ label: '开动率', value: 'lyl' },
			{ label: '开机率', value: 'kjl' },
			@@ -136,9 +231,11 @@
			dataList: [],
			url: {
			list: '/mdc/efficiencyReport/efficiencyPOList',
			listByType: '/mdc/MdcUtilizationRate/getByType'
			listByType: '/mdc/MdcUtilizationRate/getByType',
			queryEquipmentType: '/mdc/mdcEquipmentType/queryEquipmentType'
			},
			tableHeads: []
			tableHeads: [],
			spinning:false
			}
			},
			props: { nodeTree: '', Type:'',nodePeople: ''},
			@@ -149,6 +246,8 @@
			this.queryParam.endTime = moment(this.dates[1]).format('YYYYMMDD')
			this.queryParam.typeTree = "1"
			this.loadData()
			this.queryGroup()
			this.getDriveTypeByApi()
			},
			watch: {
			Type(valmath){
			@@ -187,7 +286,20 @@
			} else {
			return '0'
			}
			}
			},

			/**
			* 格式化时间
			* @param seconds 秒数
			* @returns '' 格式化后时间字符串
			*/
			getFormattedTime(seconds) {
			if (seconds) {
			return parseFloat((seconds / 3600).toFixed(2))
			} else {
			return '0'
			}
			},
			},
			methods: {
			checkSameData(dataList){
			@@ -329,6 +441,8 @@
			dateParamChange(v1, v2) {
			this.queryParam.startTime = v2[0]
			this.queryParam.endTime = v2[1]
			// 点击时间选择器的清空按钮时会触发此判断(点击重置按钮不会触发)，实现重置列表功能，切实改变列表显示效果
			if(!this.queryParam.startTime&&!this.queryParam.endTime)this.searchReset()
			},
			efficiencyOptionsOnChange(checkedList) {
			let index = checkedList.indexOf('lyl')
			@@ -343,14 +457,21 @@
			this.checkedList = checkedList
			},
			searchQuery() {
			if(this.queryParam.typeTree == "1"){
			this.queryParam.parentId = this.queryParamEquip.parentId
			this.queryParam.equipmentId = this.queryParamEquip.equipmentId
			if(this.dates != ''){
			if(this.queryParam.typeTree == "1"){
			this.queryParam.parentId = this.queryParamEquip.parentId
			this.queryParam.equipmentId = this.queryParamEquip.equipmentId
			}else{
			this.queryParam.parentId = this.queryParamPeople.parentId
			this.queryParam.equipmentId = ""
			}
			this.loadData()
			}else{
			this.queryParam.parentId = this.queryParamPeople.parentId
			this.queryParam.equipmentId = ""
			this.$notification.warning({
			message:'消息',
			description:"请选择时间"
			});
			}
			this.loadData()
			// this.onClearSelected()
			},
			searchReset() {
			@@ -358,10 +479,12 @@
			this.typeParent = this.queryParam.parentId
			this.typeEquipment = this.queryParam.equipmentId
			this.queryParam = {}
			this.dates = []
			this.queryParam.typeTree = this.typeTree
			this.queryParam.parentId = this.typeParent
			this.queryParam.equipmentId = this.typeEquipment
			this.dates = [moment().subtract('days', 8), moment().subtract('days', 1)]
			this.queryParam.startTime = moment(this.dates[0]).format('YYYYMMDD')
			this.queryParam.endTime = moment(this.dates[1]).format('YYYYMMDD')
			// this.ipagination.current = 1
			this.loadData();
			// this.queryParam = {}
			@@ -370,6 +493,7 @@
			// this.onClearSelected()
			},
			loadData() {
			this.spinning=true
			this.tableHeads = []
			this.dataList = []
			getAction(this.url.list, this.queryParam).then(res => {
			@@ -377,14 +501,61 @@
			// console.log(res.result)
			this.tableHeads = res.result.dates
			this.dataList = res.result.mdcEfficiencyList
			if (res.result.mdcEfficiencyList && !res.result.mdcEfficiencyList.length) {
			this.$notification.info({
			message: '消息',
			description: '暂无该设备类型数据'
			})
			}
			this.checkSameData(this.dataList)
			this.checkSameData1(this.dataList)
			this.checkSameData2(this.dataList)
			this.combineCell();
			// this.initDeviceType(this.dataList)
			}
			}).finally(()=>{
			this.spinning=false
			})
			}
			},
			queryGroup() {
			getAction(this.url.queryEquipmentType).then(res => {
			if (res.success) {
			this.selectList = res.result
			// this.selectList = res.result.map((item, index, arr) => {
			// return { label: item.id, value: item.equipmentTypeName + '' }
			// })
			} else {
			// this.$message.warning(res.message)
			this.$notification.warning({
			message: '消息',
			description: res.message
			})
			}
			}).finally(() => {
			this.loading = false
			})
			},

			/**
			* 调用接口获取控制系统类型
			*/
			getDriveTypeByApi(){
			api.getDriveTypeApi().then((res)=>{
			this.driveTypeList=res.result.map(item=>item.value)
			})
			},

			/**
			* 联想输入框筛选功能
			* @param input 输入的内容
			* @param option 配置
			* @returns {boolean} 判断是否筛选
			*/
			filterOption(input, option) {
			return (
			option.componentOptions.children[0].text.toUpperCase().indexOf(input.toUpperCase()) >= 0
			);
			},
			}
			}
			</script>
			@@ -395,12 +566,14 @@
			height: 100%;
			overflow: auto;
			}

			.table2 thead tr th:first-child,
			.table tbody tr .tdgu{
			position: sticky;
			left: 0;
			z-index: 1;
			}

			.table tbody tr .wenzi{
			/writing-mode: vertical-lr;/
			/text-orientation: upright;/
			@@ -408,33 +581,39 @@
			writing-mode: vertical-lr;
			letter-spacing: 2px;
			}

			.table tbody tr .kaitou{
			z-index: 1;
			background-color: white;
			}

			.table tbody tr .tdgu1{
			position: sticky;
			left: 50px;
			z-index: 2;
			}

			.table tbody tr .tdgu2{
			position: sticky;
			left: 100px;
			z-index: 2;
			}

			.table tbody tr .tdgu3{
			position: sticky;
			left: 150px;
			z-index: 2;
			}

			.table tbody tr .tdgu4{
			position: sticky;
			left: 250px;
			z-index: 2;
			}

			.table tbody tr .tdgu5{
			position: sticky;
			left: 400px;
			left: 412px;
			z-index: 2;
			}

			@@ -444,81 +623,91 @@
			top:0;
			z-index: 3;
			}

			.table2 thead .gudingth th{
			position: sticky;
			top: 32px;
			z-index: 2;
			}

			.table2 thead .equipname .name{
			z-index: 3;
			}

			.table2 thead .equipname .dong1{
			z-index: 4;
			left: 0;
			/border: 1px solid #000;/
			}

			.table2 thead .equipname .dong2{
			z-index: 5;
			left: 50px;
			}


			.table2 thead .equipname .dong3{
			z-index: 5;
			left: 100px;
			}

			.table2 thead .equipname .dong4{
			z-index: 5;
			left: 150px;
			}

			.table2 thead .equipname .dong5{
			z-index: 5;
			left: 250px;
			}

			.table2 thead .equipname .dong6{
			z-index: 5;
			left: 400px;
			left: 412px;
			}


			#EfficiencyPO{
			overflow: hidden;
			}

			@media screen and (min-width: 1920px){
			#EfficiencyPO{
			height: 687px!important;
			overflow: scroll;
			}
			}

			@media screen and (min-width: 1680px) and (max-width: 1920px){
			#EfficiencyPO{
			height: 687px!important;
			overflow: scroll;
			}
			}

			@media screen and (min-width: 1400px) and (max-width: 1680px){
			#EfficiencyPO{
			height: 540px!important;
			overflow: scroll;
			}
			}

			@media screen and (min-width: 1280px) and (max-width: 1400px){
			#EfficiencyPO{
			height: 440px!important;
			overflow: scroll;
			}
			}

			@media screen and (max-width: 1280px){
			#EfficiencyPO{
			height: 440px!important;
			overflow: scroll;
			}
			}

			.identifyingclass {
			width: 55px;
			height: 15px;
			display: inline-block
			}

			.dataContent {
			white-space: nowrap;
			/margin: 0;/
			border: none;
			border-collapse: separate;
			border-spacing: 0;
			/table-layout: fixed;/
			@@ -529,10 +718,6 @@
			/overflow: hidden;/
			/overflow-y: auto;/
			text-align: center;
			}

			.dataContent .fixed th {
			width: 50px;
			}

			.dataContent .thead th {
			@@ -546,23 +731,7 @@
			width: auto;
			}

			/.dataContent tr td {/
			/height: 35px;/
			/}/

			.dataContent .mathData td {
			padding: 10px;
			/display: none;/
			}

			.dataContent .mathData .td {
			/background-color: #ff9bd2;/
			display: inline-block;
			padding: 10px;
			}

			.dataContent .mathData .tdd {
			/display: none;/
			}

			</style>