|
@@ -0,0 +1,573 @@
|
|
|
+<template>
|
|
|
+ <div class="detail-info">
|
|
|
+ <div class="eq-top">
|
|
|
+ <img src="/static/img/backIcon.jpg" alt="" @click="back">
|
|
|
+ <span>返回 </span>
|
|
|
+ </div>
|
|
|
+ <div class="detail-content">
|
|
|
+ <div class="content-top">
|
|
|
+ <p>{{eqMaterial.infos.EquipLocalName || '--'}}详情</p>
|
|
|
+ <div><Checkbox v-model="isData" label="只显示有数据的信息" name="type" @on-change="onChange"></Checkbox>只显示有数据的信息</div>
|
|
|
+ </div>
|
|
|
+ <hr>
|
|
|
+ <div class="content-bottom">
|
|
|
+ <div class="content-left">
|
|
|
+ <div>
|
|
|
+ <ul v-for="(list,index1) in mainInfo" :key='index1' :class="{changeStyle:changeColor == index1}"
|
|
|
+ @click="change(index1)"><a :href="`#${list.href}`">{{list.name}}</a>
|
|
|
+ <template v-if="list.list">
|
|
|
+ <li v-for="(item,index2) in list.list" :key="index2" :class="{color:changeColor == index1 && liIndex == index2}" @click="changeLi(index2)"><a :href="`#${item.href}`">{{item.name}}</a></li>
|
|
|
+ </template>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="content-right" @scroll="handleScroll">
|
|
|
+ <section>
|
|
|
+ <p id="baseInfo" class="group1"><span></span>基本信息</p>
|
|
|
+ <ul>
|
|
|
+ <li><span>设备ID</span>{{eqMaterial.infos.EquipID || '--'}}</li>
|
|
|
+ <li><span>设备二维码图片</span><i v-if="eqMaterial.infos.EquipQRCode" @click="lookAt">查看</i></li>
|
|
|
+ <li><span>设备名称</span>{{eqMaterial.infos.EquipName || '--'}}</li>
|
|
|
+ <li><span>BIM模型中编码</span>{{eqMaterial.infos.BIMID || '--'}}</li>
|
|
|
+ <li><span>设备本地编码</span>{{eqMaterial.infos.EquipLocalID || '--'}}</li>
|
|
|
+ <li><span>BIM模型中坐标</span>{{eqMaterial.infos.BIMLocation || '--'}}</li>
|
|
|
+ <li><span>设备本地名称</span>{{eqMaterial.infos.EquipLocalName || '--'}}</li>
|
|
|
+ </ul>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section>
|
|
|
+ <p id="standInfo" class="group1"><span></span>台账信息</p>
|
|
|
+ <p id="001" class="p-title">设备厂家</p>
|
|
|
+ <ul >
|
|
|
+ <li><span>生产厂家</span>{{eqMaterial.infos.Manufacturer || '--'}}</li>
|
|
|
+ <li><span>品牌</span>{{eqMaterial.infos.Brand || '--'}}</li>
|
|
|
+ <li><span>生产日期</span>{{eqMaterial.infos.ProductDate || '--'}}</li>
|
|
|
+ <li><span>设备型号</span>{{eqMaterial.infos.Specification || '--'}}</li>
|
|
|
+ <li><span>出厂编号</span>{{eqMaterial.infos.SerialNum || '--'}}</li>
|
|
|
+ </ul>
|
|
|
+ <p id="002" class="p-title">供应&购买</p>
|
|
|
+ <ul>
|
|
|
+ <li><span>供应商单位名称</span>{{eqMaterial.infos.Supplier || '--'}}</li>
|
|
|
+ <li><span>供应商联系人</span>{{eqMaterial.infos.SupplierContactor || '--'}}</li>
|
|
|
+ <li><span>供应商联系电话</span>{{eqMaterial.infos.SupplierPhone || '--'}}</li>
|
|
|
+ <li><span>供应商电子邮件</span>{{eqMaterial.infos.SupplierEmail || '--'}}</li>
|
|
|
+ <li><span>供应商网址</span>{{eqMaterial.infos.SupplierWeb || '--'}}</li>
|
|
|
+ <li><span>供应商传真</span>{{eqMaterial.infos.SupplierFax || '--'}}</li>
|
|
|
+ <li><span>供应合同编号</span>{{eqMaterial.infos.SupplierContractID || '--'}}</li>
|
|
|
+ <li><span>资产编号</span>{{eqMaterial.infos.AssetID || '--'}}</li>
|
|
|
+ <li><span>采购价格</span>{{eqMaterial.infos.PurchasePrice || '--'}}</li>
|
|
|
+ </ul>
|
|
|
+ <p id="003" class="p-title"> 现场&安装</p>
|
|
|
+ <ul >
|
|
|
+ <li><span>长</span>{{eqMaterial.infos.Length || '--'}} m</li>
|
|
|
+ <li><span>宽</span>{{eqMaterial.infos.Width || '--'}} m</li>
|
|
|
+ <li><span>高</span>{{eqMaterial.infos.Height || '--'}} m</li>
|
|
|
+ <li><span>净重</span>{{eqMaterial.infos.NetWeight || '--'}} kg</li>
|
|
|
+ <li><span>主体材质</span>{{eqMaterial.infos.Material || '--'}}</li>
|
|
|
+ <li><span>所属部门</span>{{eqMaterial.infos.InstallLocation || '--'}}</li>
|
|
|
+ <li><span>安装位置</span>{{eqMaterial.infos.Width || '--'}}</li>
|
|
|
+ </ul>
|
|
|
+ <p id="004" class="p-title"> 运行&维保</p>
|
|
|
+ <ul >
|
|
|
+ <li><span>维保负责人</span>{{eqMaterial.infos.Principal || '--'}}</li>
|
|
|
+ <li><span>投产日期</span>{{eqMaterial.infos.StartDate || '--'}}</li>
|
|
|
+ <li><span>保修期</span>{{eqMaterial.infos.Warranty || '--'}}</li>
|
|
|
+ <li><span>维保合同截止日期</span>{{eqMaterial.infos.MaintainDeadline || '--'}}</li>
|
|
|
+ <li><span>使用寿命</span>{{eqMaterial.infos.ServiceLife || '--'}}</li>
|
|
|
+ <li><span>预计报废日期</span>{{eqMaterial.infos.ExpectScrapDate || '--'}}</li>
|
|
|
+ <li><span>保养周期</span>{{eqMaterial.infos.MaintainPeriod || '--'}}</li>
|
|
|
+ <li><span>维修商单位名称</span>{{eqMaterial.infos.Maintainer || '--'}}</li>
|
|
|
+ <li><span>维修商联系人</span>{{eqMaterial.infos.MaintainerContactor || '--'}}</li>
|
|
|
+ <li><span>维修商联系电话</span>{{eqMaterial.infos.MaintainerPhone || '--'}}</li>
|
|
|
+ <li><span>维修商电子邮件</span>{{eqMaterial.infos.MaintainerEmai || '--'}}</li>
|
|
|
+ <li><span>维修商网址</span>{{eqMaterial.infos.MaintainerWeb || '--'}}</li>
|
|
|
+ <li><span>维修商传真</span>{{eqMaterial.infos.MaintainerFax || '--'}}</li>
|
|
|
+ </ul>
|
|
|
+ <p id="005" class="p-title"> 保险</p>
|
|
|
+ <ul >
|
|
|
+ <li><span>保险公司名称</span>{{eqMaterial.infos.Insurer || '--'}}</li>
|
|
|
+ <li><span>保险公司联系人</span>{{eqMaterial.infos.InsurerContactor || '--'}}</li>
|
|
|
+ <li><span>保险公司联系电话</span>{{eqMaterial.infos.InsurerPhone || '--'}}</li>
|
|
|
+ <li><span>保险公司电子邮件</span>{{eqMaterial.infos.InsurerEmail || '--'}}</li>
|
|
|
+ <li><span>保险公司网址</span>{{eqMaterial.infos.InsurerWeb || '--'}}</li>
|
|
|
+ <li><span>保险公司传真</span>{{eqMaterial.infos.InsurerFax || '--'}}</li>
|
|
|
+ <li><span>保险单号</span>{{eqMaterial.infos.InsuranceNum || '--'}}</li>
|
|
|
+ <li><span>保险文件</span>{{eqMaterial.infos.InsuranceFile || '--'}}</li>
|
|
|
+ </ul>
|
|
|
+ <p id="006" class="p-title">照片&文档</p>
|
|
|
+ <ul>
|
|
|
+ <li v-if="eqMaterial.infos.Nameplate"><span>设备铭牌照片</span>{{eqMaterial.infos.Nameplate[0].key?eqMaterial.infos.Nameplate[0].key:'--'}}</li>
|
|
|
+ </ul>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section>
|
|
|
+ <p id="controlInfo"><span></span>控制参数</p>
|
|
|
+ <ul>
|
|
|
+ <li><span>控制模式</span>{{eqMaterial.infos.CtrlMode || '--'}}</li>
|
|
|
+ </ul>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section>
|
|
|
+ <p id="setInfo"><span></span>设定参数</p>
|
|
|
+ <ul>
|
|
|
+ <li><span>设备开关设定</span>{{eqMaterial.infos.EquipSwitchSet || '--'}}</li>
|
|
|
+ <li><span>设备开设定</span>{{eqMaterial.infos.EquipOnSet || '--'}}</li>
|
|
|
+ <li><span>设备关设定</span>{{eqMaterial.infos.EquipOffSet || '--'}}</li>
|
|
|
+ <li><span>设备频率设定</span>{{eqMaterial.infos.EquipFreqSet || '--'}}</li>
|
|
|
+ <li><span>设备开度设定</span>{{eqMaterial.infos.EquipOpeningSet || '--'}}</li>
|
|
|
+ </ul>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section>
|
|
|
+ <p id="technologyInfo"><span></span>技术参数</p>
|
|
|
+ <ul>
|
|
|
+ <li><span>额定电压</span>{{eqMaterial.infos.RatedU || '--'}} V</li>
|
|
|
+ <li><span>额定电流</span>{{eqMaterial.infos.RatedI || '--'}} A</li>
|
|
|
+ <li><span>额定功率</span>{{eqMaterial.infos.RatedP || '--'}} kW</li>
|
|
|
+ <li><span>额定频率</span>{{eqMaterial.infos.RatedFreq || '--'}} Hz</li>
|
|
|
+ <li><span>累计运行时间</span>{{eqMaterial.infos.AccRunTime || '--'}} h</li>
|
|
|
+ <li><span>水泵类型</span>{{eqMaterial.infos.PumpType || '--'}}</li>
|
|
|
+ <li><span>泵体安装类型</span>{{eqMaterial.infos.InstallType || '--'}}</li>
|
|
|
+ <li><span>输配介质</span>{{eqMaterial.infos.MediumType || '--'}}</li>
|
|
|
+ <li><span>调节类型</span>{{eqMaterial.infos.AdjustType || '--'}}</li>
|
|
|
+ <li><span>管网使用类型</span>{{eqMaterial.infos.NetUseType || '--'}}</li>
|
|
|
+ <li><span>是否为备用泵</span>{{eqMaterial.infos.isBackup || '--'}}</li>
|
|
|
+ <li><span>额定扬程</span>{{eqMaterial.infos.RatedHead || '--'}} m</li>
|
|
|
+ <li><span>额定驱动压力</span>{{eqMaterial.infos.RatedDrivePress || '--'}} MPa</li>
|
|
|
+ <li><span>额定增压比</span>{{eqMaterial.infos.RatedPressRatio || '--'}}</li>
|
|
|
+ <li><span>额定转速</span>{{eqMaterial.infos.RatedRPM || '--'}} rpm</li>
|
|
|
+ </ul>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section>
|
|
|
+ <p id="operationInfo"><span></span>运行参数</p>
|
|
|
+ <p id="101" class="p-title">运行状态</p>
|
|
|
+ <ul>
|
|
|
+ <li><span>运行状态</span>{{eqMaterial.infos.RunStatus || '--'}}</li>
|
|
|
+ <li><span>本地远程状态</span>{{eqMaterial.infos.RemoteStatus || '--'}}</li>
|
|
|
+ <li><span>A相电压</span>{{eqMaterial.infos.APhaseU || '--'}} V</li>
|
|
|
+ <li><span>B相电压</span>{{eqMaterial.infos.BPhaseU || '--'}} V</li>
|
|
|
+ <li><span>C相电压</span>{{eqMaterial.infos.CPhaseU || '--'}} V</li>
|
|
|
+ <li><span>A相电流</span>{{eqMaterial.infos.APhaseI || '--'}} A</li>
|
|
|
+ <li><span>B相电流</span>{{eqMaterial.infos.BPhaseI || '--'}} A</li>
|
|
|
+ <li><span>C相电流</span>{{eqMaterial.infos.CPhaseI || '--'}} A</li>
|
|
|
+ <li><span>耗电功率</span>{{eqMaterial.infos.ElecConsumP || '--'}} kW</li>
|
|
|
+ <li><span>水泵进口压力</span>{{eqMaterial.infos.InPress || '--'}} MPa</li>
|
|
|
+ <li><span>水泵出口压力</span>{{eqMaterial.infos.OutPress || '--'}} MPa</li>
|
|
|
+ <li><span>电机效率</span>{{eqMaterial.infos.MotorEff || '--'}} %</li>
|
|
|
+ <li><span>瞬时增压比</span>{{eqMaterial.infos.PressRatio || '--'}}</li>
|
|
|
+ <li><span>整体效率</span>{{eqMaterial.infos.OverallEff || '--'}} %</li>
|
|
|
+ </ul>
|
|
|
+ <p id="102" class="p-title">累计参数</p>
|
|
|
+ <ul>
|
|
|
+ <li><span>累计流量</span>{{eqMaterial.infos.AccFlow || '--'}} m³</li>
|
|
|
+ <li><span>累计耗电量</span>{{eqMaterial.infos.AccElecConsum || '--'}} kWh</li>
|
|
|
+ <li><span>累计运行时间</span>{{eqMaterial.infos.AccRunTime || '--'}} h</li>
|
|
|
+ <li><span>开启时间计时</span>{{eqMaterial.infos.OpenTimeCount || '--'}} h</li>
|
|
|
+ <li><span>关闭时间计时</span>{{eqMaterial.infos.CloseTimeCount || '--'}} h</li>
|
|
|
+ </ul>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <section style="min-height: 590px">
|
|
|
+ <p id="eneryInfo"><span></span>能耗信息</p>
|
|
|
+ <enery-params v-show="eqMaterial" :roomInfo='eqMaterial' :isShowChange='isShowChange'></enery-params>
|
|
|
+ </section>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="mask-bg"></div>
|
|
|
+ <div class="mask">
|
|
|
+ <message-modal @close='close' :isQR='isQR'></message-modal>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import eneryParams from '../detail/EneryParams'
|
|
|
+import messageModal from '../spread/MessageModal.vue'
|
|
|
+import axios from 'axios'
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ eneryParams,
|
|
|
+ messageModal
|
|
|
+ },
|
|
|
+
|
|
|
+ mixins: [],
|
|
|
+
|
|
|
+ props: {
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ isData: false,
|
|
|
+ isShowChange: false,
|
|
|
+ eqMaterial: {
|
|
|
+ infos: {
|
|
|
+ EquipLocalName: "--",
|
|
|
+ EquipName: "--",
|
|
|
+ EquipID: "--",
|
|
|
+ EquipLocalID: "--",
|
|
|
+ EquipQRCode: "--",
|
|
|
+ Manufacturer: "--",
|
|
|
+ ProductDate: "--",
|
|
|
+ Specification: "--",
|
|
|
+ SerialNum: "--",
|
|
|
+ BIMID: "--",
|
|
|
+ Supplier: "--",
|
|
|
+ PurchasePrice: "--",
|
|
|
+ InstallLocation: "--",
|
|
|
+ StartDate: "--",
|
|
|
+ SupplierContactor: "--",
|
|
|
+ InsuranceNum: "--",
|
|
|
+ MaintainerPhone: "--",
|
|
|
+ Insurer: "--",
|
|
|
+ Maintainer: "--",
|
|
|
+ InsurerContactor: "--",
|
|
|
+ InsurerPhone: "--",
|
|
|
+ Principal: "--",
|
|
|
+ Nameplate: [{key: "--"}]
|
|
|
+ },
|
|
|
+ location: {
|
|
|
+ building: "--",
|
|
|
+ floor: "--"
|
|
|
+ }
|
|
|
+ },
|
|
|
+ isQR: "",
|
|
|
+ changeColor: 0,
|
|
|
+ liIndex: -1,
|
|
|
+ mainInfo: [
|
|
|
+ {name: "基本信息", href: "baseInfo"},
|
|
|
+ {
|
|
|
+ name: "台账信息",
|
|
|
+ href: "standInfo",
|
|
|
+ list: [
|
|
|
+ {name: "设备厂家", href: "001"},
|
|
|
+ {name: "供应&购买", href: "002"},
|
|
|
+ {name: "现场&安装", href: "003"},
|
|
|
+ {name: "运行&维保", href: "004"},
|
|
|
+ {name: "保险", href: "005"},
|
|
|
+ {name: "照片&文档", href: "006"}
|
|
|
+ ]},
|
|
|
+ {name: "控制参数", href: "controlInfo"},
|
|
|
+ {name: "设定参数", href: "setInfo"},
|
|
|
+ {name: "技术参数", href: "technologyInfo"},
|
|
|
+ {
|
|
|
+ name: "运行参数",
|
|
|
+ href: "operationInfo",
|
|
|
+ list: [
|
|
|
+ {name: "运行状态", href: "101"},
|
|
|
+ {name: "累计参数", href: "102"}
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {name: "能耗信息", href: "eneryInfo"}
|
|
|
+ ],
|
|
|
+ groups: [],
|
|
|
+ box: null
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ computed: {
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ mounted () {
|
|
|
+ this.getObjInfo()
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.box = document.querySelector(".content-right")
|
|
|
+ this.groups = document.querySelectorAll(".content-right>section")
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ getCurrentData () {
|
|
|
+ let params = {
|
|
|
+ criterias: [
|
|
|
+ {
|
|
|
+ id: this.eqMaterial.id,
|
|
|
+ code: "ElecConsumP"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: this.eqMaterial.id,
|
|
|
+ code: "AccElecConsum"
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ axios.post(`/data-platform-3/data-platform-3/parameter/batch_query_param?projectId=${this.$store.state.projId}&secret=`, params).then(res => {
|
|
|
+ let data = res.data
|
|
|
+ if (data.Result == 'success') {
|
|
|
+ let content = data.Content
|
|
|
+ content.forEach(el => {
|
|
|
+ if (el.code == 'ElecConsumP') {
|
|
|
+ this.ElecConsumPData = el.data
|
|
|
+ }
|
|
|
+ if (el.code == 'AccElecConsum') {
|
|
|
+ this.AccElecConsumData = el.data
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ change (index) {
|
|
|
+ this.changeColor = index
|
|
|
+ },
|
|
|
+ changeLi (index2) {
|
|
|
+ this.liIndex = index2
|
|
|
+ },
|
|
|
+ // 路由传参得到Info
|
|
|
+ getObjInfo () {
|
|
|
+ this.eqMaterial = JSON.parse(this.$route.query.obj)
|
|
|
+ this.getCurrentData()
|
|
|
+ },
|
|
|
+ back () {
|
|
|
+ history.go(-1)
|
|
|
+ },
|
|
|
+ // 下载弹框
|
|
|
+ lookAt () {
|
|
|
+ this.isQR = this.eqMaterial.infos.EquipQRCode
|
|
|
+ document.querySelector('body').style.overflow = 'hidden'
|
|
|
+ document.querySelector('.mask-bg').style.display = 'block'
|
|
|
+ document.querySelector('.mask').style.display = 'block'
|
|
|
+ },
|
|
|
+ close () {
|
|
|
+ document.querySelector('body').style.overflow = 'auto'
|
|
|
+ document.querySelector('.mask-bg').style.display = 'none'
|
|
|
+ document.querySelector('.mask').style.display = 'none'
|
|
|
+ },
|
|
|
+ onChange (val) {
|
|
|
+ if (val) {
|
|
|
+ this.hiddenNoData()
|
|
|
+ } else {
|
|
|
+ this.showAllData()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ hiddenNoData () {
|
|
|
+ this.isShowChange = true
|
|
|
+ let arr = document.querySelectorAll('.content-right li')
|
|
|
+ arr.forEach(i => {
|
|
|
+ if (i.innerHTML.includes('--')) {
|
|
|
+ i.style.display = 'none'
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 只显示有数据的
|
|
|
+ showAllData () {
|
|
|
+ this.isShowChange = false
|
|
|
+ let arr = document.querySelectorAll('.content-right li')
|
|
|
+ arr.forEach(i => {
|
|
|
+ i.style.display = 'block'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 滚动触发事件
|
|
|
+ handleScroll () {
|
|
|
+ let top = this.box.scrollTop
|
|
|
+ let i = this.groups.length - 1
|
|
|
+ for (; i >= 0; i--) {
|
|
|
+ if (this.groups[i].offsetTop <= top) {
|
|
|
+ this.changeColor = i
|
|
|
+ let pTitles = this.groups[i].querySelectorAll('.p-title')
|
|
|
+ let j = pTitles ? pTitles.length - 1 : 0
|
|
|
+ for (; j >= 0; j--) {
|
|
|
+ if (pTitles[j].offsetTop <= top) {
|
|
|
+ this.liIndex = j
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="less" >
|
|
|
+.detail-info {
|
|
|
+ .eq-top {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ margin-left: 20px;
|
|
|
+ font-size: 7px;
|
|
|
+ color: #212830;
|
|
|
+ >img {
|
|
|
+ //vertical-align: middle;
|
|
|
+ cursor: pointer;
|
|
|
+ border: 1px solid #CACACA;
|
|
|
+ border-radius: 2px;
|
|
|
+ }
|
|
|
+ >span {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #212830;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .detail-content {
|
|
|
+ box-shadow: 0 2px 10px 0 rgba(44,48,62,0.06);
|
|
|
+ border-radius: 2px;
|
|
|
+ background: #fff;
|
|
|
+ padding-left:20px;
|
|
|
+ .content-top {
|
|
|
+ width: 100%;
|
|
|
+ padding-top: 10px;
|
|
|
+ p {
|
|
|
+ font-size: 18px;
|
|
|
+ color: #212830;
|
|
|
+ font-weight: bold;
|
|
|
+ padding: 24px 0 20px 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ hr {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+ .content-bottom {
|
|
|
+ display: flex;
|
|
|
+ .content-left {
|
|
|
+ width: 264px;
|
|
|
+ border-radius: 2px;
|
|
|
+ padding-top: 10px;
|
|
|
+ margin-right: 60px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ background: #FAFAFA;
|
|
|
+ div {
|
|
|
+ .p-title{
|
|
|
+ margin-left: 24px ;
|
|
|
+ margin-bottom: 12px;
|
|
|
+ border-bottom:1px dashed #cecece;
|
|
|
+ }
|
|
|
+ .p-title{
|
|
|
+ padding: 20px;
|
|
|
+ }
|
|
|
+ .group1{
|
|
|
+ margin-bottom:20px;
|
|
|
+ }
|
|
|
+ ul{
|
|
|
+ font-size: 16px;
|
|
|
+ padding:5px 0 5px 40px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ a {
|
|
|
+ color: #212830;
|
|
|
+ &:hover,&:active {
|
|
|
+ color:#6682E6;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ li {
|
|
|
+ font-size: 16px;
|
|
|
+ padding:18px 0 0 40px;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ a{
|
|
|
+ color: #6D747C;
|
|
|
+ }
|
|
|
+ &:first-child {
|
|
|
+ padding-top: 15px;
|
|
|
+ }
|
|
|
+ &:last-child {
|
|
|
+ padding-bottom: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .content-right {
|
|
|
+ width: 1450px;
|
|
|
+ height: 700px;
|
|
|
+ overflow-y:scroll;
|
|
|
+ padding: 10px;
|
|
|
+ position: relative;
|
|
|
+ section{
|
|
|
+ p {
|
|
|
+ height: 40px;
|
|
|
+ span {
|
|
|
+ display: inline-block;
|
|
|
+ width: 4px;
|
|
|
+ height: 16px;
|
|
|
+ background: #728DEE;
|
|
|
+ margin-right: 10px;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ul {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ margin-left: 10px;
|
|
|
+ li {
|
|
|
+ width: 50%;
|
|
|
+ padding-bottom: 15px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ span {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #6D747C;
|
|
|
+ display: inline-block;
|
|
|
+ width: 98px;
|
|
|
+ margin-right: 20px;
|
|
|
+ }
|
|
|
+ i{
|
|
|
+ color:#6682E6;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .mask-bg{
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ z-index: 99;
|
|
|
+ background:rgba(0, 0, 0, .6);
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .mask {
|
|
|
+ width: 860px;
|
|
|
+ height: 458px;
|
|
|
+ background: #fff;
|
|
|
+ position: fixed;
|
|
|
+ z-index: 999;
|
|
|
+ top: 120px;
|
|
|
+ left: 30%;
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .changeStyle{
|
|
|
+ color: #6682E6!important;
|
|
|
+ background: #fff;
|
|
|
+ >a{
|
|
|
+ color: #6682E6!important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .color{
|
|
|
+ >a{
|
|
|
+ color: #6682E6!important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style lang="less">
|
|
|
+.detail-info {
|
|
|
+ .ivu-table-wrapper {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ .ivu-table td,
|
|
|
+ .ivu-table th {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ .ivu-table:before{
|
|
|
+ height: 0;
|
|
|
+ }
|
|
|
+ .ivu-table:after{
|
|
|
+ width:0;
|
|
|
+ }
|
|
|
+ .ivu-table-row .description-td>.ivu-table-cell>span{
|
|
|
+ // overflow: hidden;
|
|
|
+ // text-overflow: ellipsis;
|
|
|
+ // white-space: nowrap;
|
|
|
+ max-height: 100px;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|