|  |  |  | 
|---|
|  |  |  | <div class="modal_wrap"> | 
|---|
|  |  |  | <div class="modal_content"> | 
|---|
|  |  |  | <div class="header"> | 
|---|
|  |  |  | <img v-if="info.status == '3'" class="head_bg" | 
|---|
|  |  |  | src="@/assets/task/bg_shenhe_fail@2x.png" alt=""> | 
|---|
|  |  |  | <img v-else-if="info.status == '4'" class="head_bg" | 
|---|
|  |  |  | <!--          <img v-if="info.status == '0'" class="head_bg" | 
|---|
|  |  |  | src="@/assets/task/bg_shenhe_fail@2x.png" alt="">--> | 
|---|
|  |  |  | <img v-if="info.status == '4' || info.status == '3'||info.status == '5'||info.status == '6'" class="head_bg" | 
|---|
|  |  |  | src="@/assets/task/bg_shenhe_pass@2x.png" alt=""> | 
|---|
|  |  |  | <img v-else class="head_bg" src="@/assets/task/bg_shenhe@2x.png" alt=""> | 
|---|
|  |  |  | <div class="left"> | 
|---|
|  |  |  | <div class="h1">不符合项:{{ info.problemTitle }}</div> | 
|---|
|  |  |  | <div class="time">提交时间:{{ info.createDate }}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="right"  :class="{ scs: info.status == '3' || info.status == '4' || info.status == '5',  msg: info.status == '6' }">{{statusMap[info.status] }}</div> | 
|---|
|  |  |  | <div class="right"  style="text-align:center;min-width: 90px" :class="{ scs: info.status == '3' || info.status == '4' || info.status == '5',  msg: info.status == '6' }">{{statusMap[info.status] }}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="info"> | 
|---|
|  |  |  | <div class="title">工单信息</div> | 
|---|
|  |  |  | <div class="list"> | 
|---|
|  |  |  | <div class="item"> | 
|---|
|  |  |  | <div class="label">观察主题</div> | 
|---|
|  |  |  | <div class="value">{{ info.typeName }} / {{info.categoryName}}</div> | 
|---|
|  |  |  | <div class="value">{{ info.typeName }}/{{info.categoryName}}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="item"> | 
|---|
|  |  |  | <div class="label">员工姓名</div> | 
|---|
|  |  |  | 
|---|
|  |  |  | <div class="value">{{ info.submitDate }}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="item"> | 
|---|
|  |  |  | <div class="label">发生时间</div> | 
|---|
|  |  |  | <div class="label">发现时间</div> | 
|---|
|  |  |  | <div class="value">{{ info.happenTime}}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="item"> | 
|---|
|  |  |  | <div class="item" style="width: 100%"> | 
|---|
|  |  |  | <div class="label">通知人</div> | 
|---|
|  |  |  | <div class="value">{{ info.memberNames }}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="side" > | 
|---|
|  |  |  | <div class="side_title">处理流程</div> | 
|---|
|  |  |  | <div class="list" v-if=" info.logList != null && info.logList.length != 0 | 
|---|
|  |  |  | "> | 
|---|
|  |  |  | <div class="list" v-if=" info.logList != null && info.logList.length != 0 "> | 
|---|
|  |  |  | <div class="item" v-for="(item, index) in info.logList" :key="item.id"> | 
|---|
|  |  |  | <div class="separate" v-if="index < info.logList.length - 1"></div> | 
|---|
|  |  |  | <div class="info"> | 
|---|
|  |  |  | 
|---|
|  |  |  | info: {}, | 
|---|
|  |  |  | statusMap: { | 
|---|
|  |  |  | 0: '待分配WTS', | 
|---|
|  |  |  | 1: '待分配任务', | 
|---|
|  |  |  | 2: '待处理', | 
|---|
|  |  |  | 3: '已解决', | 
|---|
|  |  |  | 4: '已解决', | 
|---|
|  |  |  | 5: '已解决' | 
|---|
|  |  |  | 1: '待分配工程师', | 
|---|
|  |  |  | 2: '待分配任务', | 
|---|
|  |  |  | 3: 'SHE关闭', | 
|---|
|  |  |  | 4: 'WTS关闭', | 
|---|
|  |  |  | 5: '工程师关闭' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | cateList: { | 
|---|
|  |  |  | 0: 'SHE事件工单', | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .modal_wrap { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | height: 100%; | 
|---|
|  |  |  | height: auto; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | overflow: hidden; | 
|---|
|  |  |  | .modal_content { | 
|---|
|  |  |  | flex: 1; | 
|---|
|  |  |  | padding: 0px 30px; | 
|---|
|  |  |  | border-radius: 8px; | 
|---|
|  |  |  | overflow: hidden; | 
|---|
|  |  |  | overflow: auto; | 
|---|
|  |  |  | height: 100%; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .title { | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .item { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | width: 40%; | 
|---|
|  |  |  | width: 50%; | 
|---|
|  |  |  | font-size: 14px; | 
|---|
|  |  |  | margin-bottom: 20px; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | &:nth-of-type(2n) { | 
|---|
|  |  |  | width: 60%; | 
|---|
|  |  |  | width: 50%; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .label { | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .value { | 
|---|
|  |  |  | width: calc(100% - 100px); | 
|---|
|  |  |  | color: #111111; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .scs { | 
|---|
|  |  |  | //min-width: 90px; | 
|---|
|  |  |  | background-color: #00BA67; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|