|
@@ -5,377 +5,267 @@
|
|
|
<p class="page-top-title-out-p" @click="backPage">返回</p>
|
|
|
</div>
|
|
|
<div class="content-box">
|
|
|
- <div class="content-box-left scrollbar-box">
|
|
|
- <li class="chemical-name">{{newData.data1}}<p class="chemical-state">{{newData.data2}}</p></li>
|
|
|
- <li>{{newData.data3}}</li>
|
|
|
- <li>类别:{{newData.data4}}<p class="control-state">{{newData.data5}}</p></li>
|
|
|
- <li>编码:{{newData.data6}}</li>
|
|
|
- <li>RFID标签:{{newData.data7}}</li>
|
|
|
- <li>规格:{{newData.data8}}</li>
|
|
|
- <li>实时库存:{{newData.data9}}</li>
|
|
|
- <li>过期时间:{{newData.data10}} | {{newData.data11}}天前提醒</li>
|
|
|
- <li>领用时效:{{newData.data12}}小时</li>
|
|
|
- <li>实验室:{{newData.data13}}</li>
|
|
|
- <li>安全员:{{newData.data14}}</li>
|
|
|
- <li>位置:{{newData.data15}}</li>
|
|
|
- <li>归属人:{{newData.data16}}</li>
|
|
|
- </div>
|
|
|
- <div class="lines"></div>
|
|
|
- <div class="content-box-right scrollbar-box">
|
|
|
- <div class="record" v-for="(item,index) in newData.dataList">
|
|
|
- <div class="record-li">
|
|
|
- <div class="record-li-t">
|
|
|
- <div class="record-li-t-l">{{item.itemData1}}</div>
|
|
|
- <div class="record-li-t-r">
|
|
|
- <p v-if="item.itemData2" @click="lookVideo(item.videoA)">操作视频</p>
|
|
|
- <p v-if="item.itemData3" @click="lookVideo(item.videoB)">开门视频</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="record-li-m">
|
|
|
- <p>操作时间</p>
|
|
|
- <p>领用量</p>
|
|
|
- <p>使用量</p>
|
|
|
- <p>是否整瓶领用</p>
|
|
|
- <p>称重方式</p>
|
|
|
- <p>双人认证</p>
|
|
|
- <p>操作人</p>
|
|
|
- </div>
|
|
|
- <div class="record-li-b">
|
|
|
- <p>{{item.itemData4}}</p>
|
|
|
- <p>{{item.itemData5}}</p>
|
|
|
- <p>{{item.itemData6}}</p>
|
|
|
- <p>{{item.itemData7}}</p>
|
|
|
- <p>{{item.itemData8}}</p>
|
|
|
- <p>{{item.itemData9}}</p>
|
|
|
- <p>{{item.itemData10}}</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="record-li">
|
|
|
- <div class="record-li-t">
|
|
|
- <div class="record-li-t-l">{{item.itemData11}}</div>
|
|
|
- <div class="record-li-t-r">
|
|
|
- <p v-if="item.itemData12" @click="lookVideo(item.videoC)">操作视频</p>
|
|
|
- <p v-if="item.itemData12" @click="lookVideo(item.videoD)">开门视频</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="record-li-m">
|
|
|
- <p>操作时间</p>
|
|
|
- <p>领用量</p>
|
|
|
- <p>使用量</p>
|
|
|
- <p>是否整瓶领用</p>
|
|
|
- <p>称重方式</p>
|
|
|
- <p>双人认证</p>
|
|
|
- <p>操作人</p>
|
|
|
- </div>
|
|
|
- <div class="record-li-b">
|
|
|
- <p>{{item.itemData14}}</p>
|
|
|
- <p>{{item.itemData15}}</p>
|
|
|
- <p>{{item.itemData16}}</p>
|
|
|
- <p>{{item.itemData17}}</p>
|
|
|
- <p>{{item.itemData18}}</p>
|
|
|
- <p>{{item.itemData19}}</p>
|
|
|
- <p>{{item.itemData20}}</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <div class="content-box-left scrollbar-box">
|
|
|
+ <li class="chemical-name">{{newData.stock.chemicalName}}<p class="chemical-state">{{newData.stock.status==1?'未出库':'出库'}}</p></li>
|
|
|
+ <li>{{newData.data3}}</li>
|
|
|
+ <li>类别:{{newData.stock.chemicalCategory}}<p class="control-state">{{newData.stock.chemicalLevel?'管控':'非管控'}}</p></li>
|
|
|
+ <li>编码:{{newData.stock.tagCode}}</li>
|
|
|
+ <li>RFID标签:{{newData.stock.rfidCode}}</li>
|
|
|
+ <li>规格:{{newData.stock.specNum}}{{newData.stock.specUnit}}{{newData.stock.packUnit}}</li>
|
|
|
+ <li>实时库存:{{newData.stock.surplus}}{{newData.stock.specUnit}}</li>
|
|
|
+ <li>过期时间:{{newData.stock.expireTime}} | {{newData.stock.anotherName}}天前提醒</li>
|
|
|
+ <li>领用时效:{{newData.stock.usageDuration}}小时</li>
|
|
|
+ <li>实验室:{{newData.stock.subName}}({{newData.stock.subRoom}})</li>
|
|
|
+ <li>安全员:{{newData.stock.safeUser}}</li>
|
|
|
+ <li>位置:{{newData.stock.cabinetName}}-{{newData.stock.doorName}}-{{newData.stock.layers}}</li>
|
|
|
+ <li>归属人:{{newData.stock.belongName}}</li>
|
|
|
+ </div>
|
|
|
+ <div class="lines"></div>
|
|
|
+ <div class="content-box-right scrollbar-box">
|
|
|
+ <div class="record" v-for="(item,index) in newData.userecordList">
|
|
|
+ <div class="record-li">
|
|
|
+ <div class="record-li-t">
|
|
|
+ <div class="record-li-t-l">{{item.statusStr}}</div>
|
|
|
+ </div>
|
|
|
+ <div class="record-li-m">
|
|
|
+ <p>操作时间</p>
|
|
|
+ <p v-if="item.useStatus==1 || item.useStatus==2 || item.useStatus==3|| item.useStatus==4|| item.useStatus==5">领用量</p>
|
|
|
+ <p v-if="item.useStatus==0 || item.useStatus==3 || item.useStatus==4|| item.useStatus==5">使用量</p>
|
|
|
+ <p v-if="item.useStatus==0">余量</p>
|
|
|
+ <p v-if="item.useStatus==1 || item.useStatus==2|| item.useStatus==3">是否整瓶领用</p>
|
|
|
+ <p>称重方式</p>
|
|
|
+ <p>双人认证</p>
|
|
|
+ <p>操作人</p>
|
|
|
+ </div>
|
|
|
+ <!-- useStatus 0已归还,1使用中,2超时未归还,3用结出库,4作废出库,5整瓶领用-->
|
|
|
+ <div class="record-li-b">
|
|
|
+ <!--操作时间-->
|
|
|
+ <p v-if="item.useStatus==1 || item.useStatus==2 || item.useStatus==3 || item.useStatus==4 || item.useStatus==5">{{parseTime(item.collectTime)}}</p>
|
|
|
+ <p v-if="item.useStatus==0">{{parseTime(item.returnTime)}}</p>
|
|
|
+ <!--领用量-->
|
|
|
+ <p v-if="item.useStatus==1 || item.useStatus==2 || item.useStatus==3 || item.useStatus==4|| item.useStatus==5">{{item.collectNowNum}}</p>
|
|
|
+ <!--使用量-->
|
|
|
+ <p v-if="item.useStatus==0 || item.useStatus==3 || item.useStatus==4|| item.useStatus==5">{{item.useAmount}}</p>
|
|
|
+ <!--余量-->
|
|
|
+ <p v-if="item.useStatus==0">{{item.returnStockNum}}</p>
|
|
|
+ <!--是否整瓶领用-->
|
|
|
+ <p v-if="item.useStatus==1 || item.useStatus==2 || item.useStatus==3">{{item.isBottle?'是':'否'}}</p>
|
|
|
+ <!--称重方式-->
|
|
|
+ <p>{{item.outType==1?'自动称重':'手动称重'}}</p>
|
|
|
+ <!--双人认证-->
|
|
|
+ <p v-if="item.useStatus==1 || item.useStatus==2 || item.useStatus==3 || item.useStatus==4 || item.useStatus==5">{{item.outOneUserName}} {{item.outTwoUserName}}</p>
|
|
|
+ <p v-if="item.useStatus==0">{{item.backOneUserName}} {{item.backTwoUserName}}</p>
|
|
|
+ <!--操作人-->
|
|
|
+ <p v-if="item.useStatus==1 || item.useStatus==2 || item.useStatus==3 || item.useStatus==4 || item.useStatus==5">{{item.createByName}}</p>
|
|
|
+ <p v-if="item.useStatus==0">{{item.backUser}}</p>
|
|
|
</div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
- <full-screen-mpegts-video ref="fullScreenMpegtsVideo" :videoProps="videoProps"></full-screen-mpegts-video>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import fullScreenMpegtsVideo from '@/components/fullScreenMpegtsVideo/fullScreenMpegtsVideo.vue'
|
|
|
- export default {
|
|
|
- name: 'infoPage',
|
|
|
- components: {
|
|
|
- fullScreenMpegtsVideo,
|
|
|
- },
|
|
|
- props:{
|
|
|
- propsData:{},
|
|
|
- },
|
|
|
- data(){
|
|
|
- return{
|
|
|
- //视频配置
|
|
|
- videoProps:{
|
|
|
- id:50, //(ID:非必传-默认随机生成)
|
|
|
- type:'mp4', //(视频类型:非必传-默认'flv')
|
|
|
- isLive:true, //(是否直播流:非必传-默认true)
|
|
|
- url:"" //(视频地址:必传)
|
|
|
- },
|
|
|
- videoType:false,
|
|
|
- //数据
|
|
|
- newData:{
|
|
|
- data1:'化学品名称',
|
|
|
- data2:'已出库',
|
|
|
- data3:'形态/纯度/CAS12-34-56',
|
|
|
- data4:'易制毒',
|
|
|
- data5:'管控',
|
|
|
- data6:'123456789',
|
|
|
- data7:'123456789',
|
|
|
- data8:'500ml/瓶',
|
|
|
- data9:'500ml',
|
|
|
- data10:'2023-10-29',
|
|
|
- data11:'30',
|
|
|
- data12:'1',
|
|
|
- data13:'实验室名称(房间号)',
|
|
|
- data14:'曹秀康-13227872222',
|
|
|
- data15:'化学品柜-柜门-层',
|
|
|
- data16:'李砖头',
|
|
|
- dataList:[
|
|
|
- {
|
|
|
- itemData1:'空瓶出库',
|
|
|
- itemData2:false,
|
|
|
- itemData3:false,
|
|
|
- itemData4:'2023/09/15 16:39',
|
|
|
- itemData5:'400ml',
|
|
|
- itemData6:'400ml',
|
|
|
- itemData7:'是',
|
|
|
- itemData8:'手工录入',
|
|
|
- itemData9:'张漂亮、李砖头',
|
|
|
- itemData10:'李砖头',
|
|
|
- itemData11:'空瓶出库',
|
|
|
- itemData12:true,
|
|
|
- itemData13:true,
|
|
|
- itemData14:'2023/09/15 16:39',
|
|
|
- itemData15:'400ml',
|
|
|
- itemData16:'400ml',
|
|
|
- itemData17:'是',
|
|
|
- itemData18:'手工录入',
|
|
|
- itemData19:'张漂亮、李砖头',
|
|
|
- itemData20:'李砖头',
|
|
|
- videoA:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- videoB:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- videoC:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- videoD:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- },
|
|
|
- {
|
|
|
- itemData1:'空瓶出库',
|
|
|
- itemData2:false,
|
|
|
- itemData3:false,
|
|
|
- itemData4:'2023/09/15 16:39',
|
|
|
- itemData5:'400ml',
|
|
|
- itemData6:'400ml',
|
|
|
- itemData7:'是',
|
|
|
- itemData8:'手工录入',
|
|
|
- itemData9:'张漂亮、李砖头',
|
|
|
- itemData10:'李砖头',
|
|
|
- itemData11:'空瓶出库',
|
|
|
- itemData12:true,
|
|
|
- itemData13:true,
|
|
|
- itemData14:'2023/09/15 16:39',
|
|
|
- itemData15:'400ml',
|
|
|
- itemData16:'400ml',
|
|
|
- itemData17:'是',
|
|
|
- itemData18:'手工录入',
|
|
|
- itemData19:'张漂亮、李砖头',
|
|
|
- itemData20:'李砖头',
|
|
|
- videoA:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- videoB:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- videoC:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- videoD:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- },
|
|
|
- {
|
|
|
- itemData1:'空瓶出库',
|
|
|
- itemData2:false,
|
|
|
- itemData3:false,
|
|
|
- itemData4:'2023/09/15 16:39',
|
|
|
- itemData5:'400ml',
|
|
|
- itemData6:'400ml',
|
|
|
- itemData7:'是',
|
|
|
- itemData8:'手工录入',
|
|
|
- itemData9:'张漂亮、李砖头',
|
|
|
- itemData10:'李砖头',
|
|
|
- itemData11:'空瓶出库',
|
|
|
- itemData12:true,
|
|
|
- itemData13:true,
|
|
|
- itemData14:'2023/09/15 16:39',
|
|
|
- itemData15:'400ml',
|
|
|
- itemData16:'400ml',
|
|
|
- itemData17:'是',
|
|
|
- itemData18:'手工录入',
|
|
|
- itemData19:'张漂亮、李砖头',
|
|
|
- itemData20:'李砖头',
|
|
|
- videoA:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- videoB:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- videoC:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- videoD:'http://192.168.1.43/labSystem/admin/statics/bigFile/2023051914/2dc29572-bac3-444c-bde9-b5b75988cc6b.mp4',
|
|
|
- },
|
|
|
- ],
|
|
|
- },
|
|
|
- }
|
|
|
- },
|
|
|
- created(){
|
|
|
-
|
|
|
- },
|
|
|
- mounted(){
|
|
|
+export default {
|
|
|
+ name: 'infoPage',
|
|
|
+ components: {
|
|
|
|
|
|
- },
|
|
|
- methods:{
|
|
|
- // 返回按钮
|
|
|
- backPage(){
|
|
|
- this.$parent.tableButton('1');
|
|
|
+ },
|
|
|
+ props:{
|
|
|
+ propsData:{},
|
|
|
+ },
|
|
|
+ data(){
|
|
|
+ return{
|
|
|
+ //视频配置
|
|
|
+ videoProps:{
|
|
|
+ id:50, //(ID:非必传-默认随机生成)
|
|
|
+ type:'mp4', //(视频类型:非必传-默认'flv')
|
|
|
+ isLive:true, //(是否直播流:非必传-默认true)
|
|
|
+ url:"" //(视频地址:必传)
|
|
|
},
|
|
|
- //浏览视频
|
|
|
- lookVideo(url){
|
|
|
- this.$set(this.videoProps,'url',url);
|
|
|
- this.$refs.fullScreenMpegtsVideo.openVideo()
|
|
|
+ videoType:false,
|
|
|
+ //数据
|
|
|
+ newData:{
|
|
|
+ stock:{},
|
|
|
+ userecordList:[],
|
|
|
},
|
|
|
}
|
|
|
+ },
|
|
|
+ created(){
|
|
|
+ let self=this;
|
|
|
+ this.newData=this.propsData;
|
|
|
+ },
|
|
|
+ mounted(){
|
|
|
+
|
|
|
+ console.log(111111)
|
|
|
+ console.log(this.newData)
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ // 返回按钮
|
|
|
+ backPage(){
|
|
|
+ this.$parent.tableButton('out','');
|
|
|
+ },
|
|
|
+ //浏览视频
|
|
|
+ lookVideo(url){
|
|
|
+ this.$set(this.videoProps,'url',url);
|
|
|
+ this.$refs.fullScreenMpegtsVideo.openVideo()
|
|
|
+ },
|
|
|
}
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
- .infoPage{
|
|
|
- .content-box{
|
|
|
- flex:1;
|
|
|
- display: flex;
|
|
|
- padding:20px;
|
|
|
- overflow: hidden;
|
|
|
- .content-box-left{
|
|
|
- width: 412px;
|
|
|
- padding: 10px 28px 0 60px;
|
|
|
- box-sizing: border-box;
|
|
|
- >li{
|
|
|
- list-style-type: none;
|
|
|
+.infoPage{
|
|
|
+ .content-box{
|
|
|
+ flex:1;
|
|
|
+ display: flex;
|
|
|
+ padding:20px;
|
|
|
+ overflow: hidden;
|
|
|
+ .content-box-left{
|
|
|
+ width: 412px;
|
|
|
+ padding: 10px 28px 0 60px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ >li{
|
|
|
+ list-style-type: none;
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #333333;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ .chemical-name{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ .chemical-state{
|
|
|
+ width: 80px;
|
|
|
+ height: 30px;
|
|
|
+ background: #0183FA;
|
|
|
+ border-radius: 6px 6px 6px 6px;
|
|
|
font-size: 16px;
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
font-weight: 400;
|
|
|
- color: #333333;
|
|
|
- margin-bottom: 20px;
|
|
|
- display: flex;
|
|
|
- }
|
|
|
- .chemical-name{
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- .chemical-state{
|
|
|
- width: 80px;
|
|
|
- height: 30px;
|
|
|
- background: #0183FA;
|
|
|
- border-radius: 6px 6px 6px 6px;
|
|
|
- font-size: 16px;
|
|
|
- font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
- font-weight: 400;
|
|
|
- color: #FFFFFF;
|
|
|
- line-height: 30px;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .control-state{
|
|
|
- width: 50px;
|
|
|
- height: 24px;
|
|
|
- border-radius: 4px 4px 4px 4px;
|
|
|
- opacity: 1;
|
|
|
- border: 1px solid #FC7F1A;
|
|
|
- font-size: 12px;
|
|
|
- font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
- font-weight: 400;
|
|
|
- color: #FC7F1A;
|
|
|
- line-height: 22px;
|
|
|
+ color: #FFFFFF;
|
|
|
+ line-height: 30px;
|
|
|
text-align: center;
|
|
|
- margin-left:10px;
|
|
|
- float: right;
|
|
|
}
|
|
|
}
|
|
|
- .lines{
|
|
|
- width:1px ;
|
|
|
- height: 760px;
|
|
|
+
|
|
|
+ .control-state{
|
|
|
+ width: 50px;
|
|
|
+ height: 24px;
|
|
|
+ border-radius: 4px 4px 4px 4px;
|
|
|
opacity: 1;
|
|
|
- border: 1px dashed #D8D8D8;
|
|
|
+ border: 1px solid #FC7F1A;
|
|
|
+ font-size: 12px;
|
|
|
+ font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #FC7F1A;
|
|
|
+ line-height: 22px;
|
|
|
+ text-align: center;
|
|
|
+ margin-left:10px;
|
|
|
+ float: right;
|
|
|
}
|
|
|
- .content-box-right{
|
|
|
- flex:1;
|
|
|
- margin-left:56px ;
|
|
|
- padding-top:10px;
|
|
|
- .record:nth-child(1){
|
|
|
- padding-top:0;
|
|
|
- border-top:none;
|
|
|
- }
|
|
|
- .record{
|
|
|
- width: 1028px;
|
|
|
- height:auto;
|
|
|
- opacity: 1;
|
|
|
- border-top: 1px dashed #D8D8D8;
|
|
|
- margin:0 0 10px;
|
|
|
- overflow: hidden;
|
|
|
- padding-top:30px;
|
|
|
- .record-li{
|
|
|
- margin-bottom: 20px;
|
|
|
- .record-li-t{
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- .record-li-t-l{
|
|
|
- width: 150px;
|
|
|
- height: 40px;
|
|
|
- background: #0183FA;
|
|
|
- border-radius: 8px 8px 0px 0px;
|
|
|
- font-size: 16px;
|
|
|
- font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
- font-weight: 400;
|
|
|
- color: #FFFFFF;
|
|
|
- line-height: 40px;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .record-li-t-r{
|
|
|
- display: flex;
|
|
|
- >p{
|
|
|
- width: 100px;
|
|
|
- height: 30px;
|
|
|
- border-radius: 6px 6px 6px 6px;
|
|
|
- opacity: 1;
|
|
|
- border: 1px solid #0183FA;
|
|
|
- font-size: 16px;
|
|
|
- font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
- font-weight: 400;
|
|
|
- color: #0183FA;
|
|
|
- line-height: 28px;
|
|
|
- text-align: center;
|
|
|
- margin-left:10px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- }
|
|
|
+ }
|
|
|
+ .lines{
|
|
|
+ width:1px ;
|
|
|
+ height: 760px;
|
|
|
+ opacity: 1;
|
|
|
+ border: 1px dashed #D8D8D8;
|
|
|
+ }
|
|
|
+ .content-box-right{
|
|
|
+ flex:1;
|
|
|
+ margin-left:56px ;
|
|
|
+ padding-top:10px;
|
|
|
+ .record:nth-child(1){
|
|
|
+ padding-top:0;
|
|
|
+ border-top:none;
|
|
|
+ }
|
|
|
+ .record{
|
|
|
+ width: 1028px;
|
|
|
+ height:auto;
|
|
|
+ opacity: 1;
|
|
|
+ border-top: 1px dashed #D8D8D8;
|
|
|
+ margin:0 0 10px;
|
|
|
+ overflow: hidden;
|
|
|
+ padding-top:30px;
|
|
|
+ .record-li{
|
|
|
+ margin-bottom: 20px;
|
|
|
+ .record-li-t{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ .record-li-t-l{
|
|
|
+ width: 150px;
|
|
|
+ height: 40px;
|
|
|
+ background: #0183FA;
|
|
|
+ border-radius: 8px 8px 0px 0px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #FFFFFF;
|
|
|
+ line-height: 40px;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
- .record-li-m{
|
|
|
+ .record-li-t-r{
|
|
|
display: flex;
|
|
|
- justify-content: flex-start;
|
|
|
- border: 1px solid #E0E0E0;
|
|
|
>p{
|
|
|
- font-weight:700;
|
|
|
- flex: 1;
|
|
|
- height: 40px;
|
|
|
- background: #F5F5F5;
|
|
|
+ width: 100px;
|
|
|
+ height: 30px;
|
|
|
+ border-radius: 6px 6px 6px 6px;
|
|
|
+ opacity: 1;
|
|
|
+ border: 1px solid #0183FA;
|
|
|
font-size: 16px;
|
|
|
font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
- color: #333333;
|
|
|
- line-height: 40px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #0183FA;
|
|
|
+ line-height: 28px;
|
|
|
text-align: center;
|
|
|
- border-right: 1px solid #E0E0E0;
|
|
|
+ margin-left:10px;
|
|
|
+ cursor: pointer;
|
|
|
}
|
|
|
}
|
|
|
- .record-li-b{
|
|
|
- display: flex;
|
|
|
- justify-content: flex-start;
|
|
|
- border-bottom: 1px solid #E0E0E0;
|
|
|
- border-left: 1px solid #E0E0E0;
|
|
|
+ }
|
|
|
+ .record-li-m{
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ border: 1px solid #E0E0E0;
|
|
|
+ >p{
|
|
|
+ font-weight:700;
|
|
|
+ flex: 1;
|
|
|
+ height: 40px;
|
|
|
+ background: #F5F5F5;
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 40px;
|
|
|
+ text-align: center;
|
|
|
+ border-right: 1px solid #E0E0E0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .record-li-b{
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ border-bottom: 1px solid #E0E0E0;
|
|
|
+ border-left: 1px solid #E0E0E0;
|
|
|
+ border-right: 1px solid #E0E0E0;
|
|
|
+ >p{
|
|
|
+ flex: 1;
|
|
|
+ height: 40px;
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 40px;
|
|
|
+ text-align: center;
|
|
|
border-right: 1px solid #E0E0E0;
|
|
|
- >p{
|
|
|
- flex: 1;
|
|
|
- height: 40px;
|
|
|
- font-size: 14px;
|
|
|
- font-family: Microsoft YaHei, Microsoft YaHei;
|
|
|
- font-weight: 400;
|
|
|
- color: #333333;
|
|
|
- line-height: 40px;
|
|
|
- text-align: center;
|
|
|
- border-right: 1px solid #E0E0E0;
|
|
|
- }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</style>
|