patientInspectLogDetail.vue 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769
  1. <template>
  2. <view class="incidentDetail">
  3. <view class="head">
  4. <view class="tab" :class="{active: tab.value === dataInfo.tabActiveValue}" v-for="tab in dataInfo.tabs" :key="tab.id" @click="clickTab(tab.value)">
  5. {{tab.name}}<text v-if="tab.num !== ''">({{tab.num}})</text>
  6. </view>
  7. </view>
  8. <scroll-view scroll-y class="body">
  9. <!-- 基本信息 -->
  10. <template v-if="dataInfo.tabActiveValue === '1'">
  11. <view class="detail_head">
  12. <text class="title">基本信息</text>
  13. <view class="other">
  14. <view class="status">{{dataInfo.patientInspectLogData.state ? dataInfo.patientInspectLogData.state.name : ''}}</view>
  15. </view>
  16. </view>
  17. <view class="detail_item_wrap">
  18. <view class="deital_item">
  19. <text class="name">患者科室:</text>
  20. <text class="value">{{dataInfo.patientInspectLogData.deptName}}</text>
  21. </view>
  22. <view class="deital_item">
  23. <text class="name">患者姓名:</text>
  24. <text class="value">{{dataInfo.patientInspectLogData.patientName}}</text>
  25. <text class="value text_value">年龄:<text v-if="dataInfo.patientInspectLogData.age !== undefined">{{dataInfo.patientInspectLogData.age }}岁</text></text>
  26. </view>
  27. <view class="deital_item">
  28. <text class="name">住院号:</text>
  29. <text class="value">{{dataInfo.patientInspectLogData.patientCode}}</text>
  30. <text class="value text_value">床号:{{dataInfo.patientInspectLogData.bedNum }}</text>
  31. </view>
  32. <view class="deital_item">
  33. <text class="name">护理等级:</text>
  34. <text class="value">{{dataInfo.patientInspectLogData.careLevel ? dataInfo.patientInspectLogData.careLevel.name : ''}}</text>
  35. <text class="value text_value">危重等级:{{dataInfo.patientInspectLogData.illnessState ? dataInfo.patientInspectLogData.illnessState.name : ''}}</text>
  36. </view>
  37. </view>
  38. <view class="detail_head">
  39. <text class="title">陪检信息</text>
  40. </view>
  41. <view class="detail_item_wrap">
  42. <view class="deital_item">
  43. <text class="name">陪检方式:</text>
  44. <text class="value">{{dataInfo.patientInspectLogData.tripTypeDTO ? dataInfo.patientInspectLogData.tripTypeDTO.inspectMode : ''}}</text>
  45. </view>
  46. <view class="deital_item">
  47. <text class="name">携带设备:</text>
  48. <text class="value">{{dataInfo.patientInspectLogData.goodsNames}}</text>
  49. </view>
  50. <view class="deital_item">
  51. <text class="name">出科时间:</text>
  52. <text class="value">{{dataInfo.patientInspectLogData.outDeptTime | formatDate('yyyy-MM-dd hh:mm')}}</text>
  53. </view>
  54. <view class="deital_item">
  55. <text class="name">出科人:</text>
  56. <text class="value">{{dataInfo.patientInspectLogData.backDeptUserDTO ? dataInfo.patientInspectLogData.backDeptUserDTO.name : ''}}</text>
  57. </view>
  58. </view>
  59. <view class="detail_head">
  60. <text class="title">最新操作</text>
  61. </view>
  62. <view class="detail_item_wrap">
  63. <view class="deital_item">
  64. <text class="name">签到时间:</text>
  65. <text class="value">{{dataInfo.patientInspectLogData.signTime | formatDate('yyyy-MM-dd hh:mm')}}</text>
  66. </view>
  67. <view class="deital_item">
  68. <text class="name">签到人:</text>
  69. <text class="value">{{dataInfo.patientInspectLogData.signUserDTO ? dataInfo.patientInspectLogData.signUserDTO.name : ''}}</text>
  70. </view>
  71. <view class="deital_item">
  72. <text class="name">签到科室:</text>
  73. <text class="value">{{dataInfo.patientInspectLogData.signDeptDTO ? dataInfo.patientInspectLogData.signDeptDTO.dept : ''}}</text>
  74. </view>
  75. </view>
  76. <view class="detail_head">
  77. <text class="title">回科信息</text>
  78. </view>
  79. <view class="detail_item_wrap">
  80. <view class="deital_item">
  81. <text class="name">回科时间:</text>
  82. <text class="value">{{dataInfo.patientInspectLogData.backDeptTime | formatDate('yyyy-MM-dd hh:mm')}}</text>
  83. </view>
  84. <view class="deital_item">
  85. <text class="name">回科人:</text>
  86. <text class="value">{{dataInfo.patientInspectLogData.backDeptUserDTO ? dataInfo.patientInspectLogData.backDeptUserDTO.name : ''}}</text>
  87. </view>
  88. </view>
  89. </template>
  90. <!-- 检查信息 -->
  91. <template v-if="dataInfo.tabActiveValue === '2'">
  92. <view class="info">
  93. <view v-for="item in dataInfo.valueList" :key="item.id" class="infoItem">
  94. <view class="name">检查项目:<text class="fwb">{{item.inspectName}}</text></view>
  95. <view class="name">检查单号:<text>{{item.inspectCode}}</text></view>
  96. <view class="name">状态:<text>{{item.inspectState ? item.inspectState.name : ''}}</text></view>
  97. <view class="name">检查地点:<text>{{item.execDept ? item.execDept.dept : ''}}</text></view>
  98. </view>
  99. </view>
  100. </template>
  101. <!-- 流程图 -->
  102. <template v-if="dataInfo.tabActiveValue === '3'">
  103. <view class="process_item_wrap">
  104. <view class="process_item" v-for="item in dataInfo.logList" :key="item.id">
  105. <view class="process_item_top">
  106. <view class="name">{{item.operationType ? item.operationType.name : '' }}</view>
  107. <view class="value" v-if="item.remark">({{item.remark}})</view>
  108. </view>
  109. <view class="process_item_bottom">
  110. <text class="name">{{item.operationTime | formatDate('yyyy-MM-dd hh:mm')}}</text>
  111. <text class="value" v-if="item.username">{{item.username}}</text>
  112. </view>
  113. </view>
  114. </view>
  115. </template>
  116. </scroll-view>
  117. <view class="foot_common_btns">
  118. <button @click="toList()" type="default" class="primaryButton btn">返回</button>
  119. <button v-if="dataInfo.patientInspectLogData.state.value === '4'" @click="tagClick(dataInfo.patientInspectLogData)" type="default" class="primaryButton btn">标记回科</button>
  120. </view>
  121. <!-- 弹窗 -->
  122. <showModel :title="models.title" :icon="models.icon" :disjunctor="models.disjunctor" :content="models.content" @ok="ok" @cancel="cancel" @know="know" :operate="models.operate"></showModel>
  123. </view>
  124. </template>
  125. <script>
  126. import { get, post, SM, deleteIt, webHandle } from "../../http/http.js";
  127. export default {
  128. data(){
  129. return {
  130. selectData: {},
  131. // 弹窗model
  132. models: {
  133. disjunctor: false,
  134. },
  135. dataInfo: {
  136. tabs: [
  137. {id: 1, name: '基本信息', value: '1', num: ''},
  138. {id: 2, name: '检查信息', value: '2', num: ''},
  139. {id: 3, name: '流程信息', value: '3', num: ''},
  140. ],
  141. tabActiveValue: 1,//当前选择的tab
  142. patientInspectLogId: undefined,//闭环ID
  143. patientInspectLogData: {},//闭环对象
  144. valueList: [],//检查信息
  145. logList: [],//流程图
  146. }
  147. }
  148. },
  149. methods: {
  150. // 标记回科
  151. tagClick(data){
  152. this.selectData = data;
  153. this.models = {
  154. disjunctor: true,
  155. title: "提示",
  156. content: `您确认${data.patientName}患者已回科吗?`,
  157. icon: "warn",
  158. operate: {
  159. ok: "确定",
  160. cancel: "取消",
  161. },
  162. };
  163. },
  164. //确定
  165. ok() {
  166. this.models.disjunctor = false;
  167. uni.showLoading({
  168. title: "加载中",
  169. mask: true,
  170. });
  171. post("/nurse/patientInspect/setPatientInspectBackDept", {
  172. pilId: this.selectData.id,
  173. }).then((res) => {
  174. uni.hideLoading();
  175. let _this = this;
  176. if (res.state == 200) {
  177. uni.showToast({
  178. icon: "none",
  179. mask: true,
  180. title: "操作成功!",
  181. });
  182. setTimeout(() => {
  183. _this.toList();
  184. },300)
  185. } else {
  186. uni.showToast({
  187. icon: 'none',
  188. title: res.msg || '请求数据失败!'
  189. });
  190. }
  191. })
  192. },
  193. //取消
  194. cancel() {
  195. this.models.disjunctor = false;
  196. },
  197. // 点击tab
  198. clickTab(tabValue){
  199. if(this.dataInfo.tabActiveValue == tabValue){
  200. return;
  201. }
  202. this.dataInfo.tabActiveValue = tabValue;
  203. this.initData()
  204. },
  205. // tab业务数据接口
  206. initData(){
  207. if(this.dataInfo.tabActiveValue === '1'){
  208. }else if(this.dataInfo.tabActiveValue === '2'){
  209. this.getValue();
  210. }else if(this.dataInfo.tabActiveValue === '3'){
  211. this.getLog();
  212. }
  213. },
  214. // 获取检查信息
  215. getValue(){
  216. uni.showLoading({
  217. title: "加载中",
  218. mask: true,
  219. });
  220. let postData = {
  221. pilId: this.dataInfo.patientInspectLogId,
  222. };
  223. post(`/nurse/patientInspect/getPatientInspectList`, postData).then(res => {
  224. uni.hideLoading();
  225. if(res.status == 200){
  226. this.dataInfo.valueList = res.list || [];
  227. }else{
  228. uni.showToast({
  229. icon: 'none',
  230. title: res.msg || '请求数据失败!'
  231. });
  232. }
  233. })
  234. },
  235. // 获取流程信息
  236. getLog(){
  237. uni.showLoading({
  238. title: "加载中",
  239. mask: true,
  240. });
  241. let postData = {
  242. "idx": 0,
  243. "sum": 9999,
  244. "patientInspectLogLog": {
  245. "pilId": this.dataInfo.patientInspectLogId
  246. }
  247. };
  248. post(`/simple/data/fetchDataList/patientInspectLogLog`, postData).then(res => {
  249. uni.hideLoading();
  250. if(res.status == 200){
  251. this.dataInfo.logList = res.list || [];
  252. }else{
  253. uni.showToast({
  254. icon: 'none',
  255. title: res.msg || '请求数据失败!'
  256. });
  257. }
  258. })
  259. },
  260. // 获取详情
  261. getDetail(){
  262. uni.showLoading({
  263. title: "加载中",
  264. mask: true,
  265. });
  266. get(`/simple/data/fetchData/patientInspectLog/${this.dataInfo.patientInspectLogId}`).then(res => {
  267. uni.hideLoading();
  268. if(res.status == 200){
  269. this.dataInfo.patientInspectLogData = res.data || {};
  270. this.dataInfo.logList = this.dataInfo.patientInspectLogData.logList || [];
  271. this.dataInfo.tabActiveValue = this.dataInfo.tabs[0].value;
  272. console.log(this.dataInfo.tabActiveValue)
  273. this.initData()
  274. }else{
  275. uni.showToast({
  276. icon: 'none',
  277. title: res.msg || '请求数据失败!'
  278. });
  279. }
  280. })
  281. },
  282. // 返回列表
  283. toList(){
  284. uni.reLaunch({
  285. url: `/pages/patientInspectLog/patientInspectLogList`
  286. })
  287. }
  288. },
  289. onLoad(options){
  290. this.dataInfo.patientInspectLogId = options.patientInspectLogId;
  291. this.getDetail();
  292. }
  293. }
  294. // import chunk from 'lodash-es/chunk'
  295. // import { ref, reactive } from 'vue'
  296. // import { onLoad } from '@dcloudio/uni-app'
  297. // import { api_listAttachment, api_inspectionTaskDetail, api_inspectionFormValues } from "@/http/api.js"
  298. // import { defaultColor } from '@/static/js/theme.js'
  299. // import { useSetTitle } from '@/share/useSetTitle.js'
  300. // import { filterFormatDate } from '@/filters/filterFormatDate.js'
  301. // useSetTitle();
  302. // const { formatDate } = filterFormatDate();
  303. // // 主题颜色
  304. // const primaryColor = ref(defaultColor)
  305. // // 数据
  306. // const dataInfo = reactive({
  307. // tabs: [
  308. // {id: 1, name: '基础信息', value: '1', num: ''},
  309. // // {id: 2, name: '巡检信息', value: '2', num: ''},
  310. // {id: 3, name: '流程图', value: '3', num: ''},
  311. // ],
  312. // tabActiveValue: 0,//当前选择的tab
  313. // patientInspectLogId: undefined,//巡检执行ID
  314. // patientInspectLogData: {},//巡检执行对象
  315. // inspectionTaskImgs: [],//巡检图片
  316. // valueList: [],//巡检信息
  317. // logList: [],//流程图
  318. // })
  319. // function getValuex(value){
  320. // return value.formItemConfigList ? value.formItemConfigList.map(v => v.valuex).toString() : value.valuex;
  321. // }
  322. // // 获取巡检信息
  323. // function getValue(){
  324. // uni.showLoading({
  325. // title: "加载中",
  326. // mask: true,
  327. // });
  328. // let postData = {
  329. // "idx": 0,
  330. // "sum": 9999,
  331. // "inspectionFormValues": {
  332. // taskId: dataInfo.patientInspectLogId,
  333. // }
  334. // };
  335. // api_inspectionFormValues(postData).then(res => {
  336. // uni.hideLoading();
  337. // if(res.status == 200){
  338. // let valueList = res.list || [];
  339. // let imgFlag = valueList.some(v => v.inspectionFormItemDTO.type.value == 7);
  340. // if(imgFlag){
  341. // valueList.forEach(v => {
  342. // if(v.inspectionFormItemDTO.type.value == 7){
  343. // v.valuex = [];
  344. // }
  345. // })
  346. // }
  347. // dataInfo.valueList = chunk(valueList, 3);
  348. // if(imgFlag){
  349. // getInspectionImgs();
  350. // }
  351. // }else{
  352. // uni.showToast({
  353. // icon: 'none',
  354. // title: res.msg || '请求数据失败!'
  355. // });
  356. // }
  357. // })
  358. // }
  359. // // 预览图片
  360. // function previewImg(index, type, imgList){
  361. // uni.previewImage({
  362. // current: index,
  363. // urls: imgList.map(v => v.previewUrl),
  364. // longPressActions: {
  365. // itemList: ['发送给朋友', '保存图片', '收藏'],
  366. // success: function(data) {
  367. // console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
  368. // },
  369. // fail: function(err) {
  370. // console.log(err.errMsg);
  371. // }
  372. // }
  373. // });
  374. // }
  375. // // 初始化表单
  376. // function initData(){
  377. // if(dataInfo.tabActiveValue === '1'){
  378. // }else if(dataInfo.tabActiveValue === '2'){
  379. // getValue();
  380. // }else if(dataInfo.tabActiveValue === '3'){
  381. // }
  382. // }
  383. // // 点击tab
  384. // function clickTab(tabValue){
  385. // if(dataInfo.tabActiveValue == tabValue){
  386. // return;
  387. // }
  388. // dataInfo.tabActiveValue = tabValue;
  389. // initData()
  390. // }
  391. // // 获取巡检执行详情
  392. // function getDetail(){
  393. // uni.showLoading({
  394. // title: "加载中",
  395. // mask: true,
  396. // });
  397. // api_inspectionTaskDetail(dataInfo.patientInspectLogId).then(res => {
  398. // uni.hideLoading();
  399. // if(res.status == 200){
  400. // dataInfo.patientInspectLogData = res.data || {};
  401. // dataInfo.logList = dataInfo.patientInspectLogData.logList || [];
  402. // // 巡检信息
  403. // if(dataInfo.patientInspectLogData.status.value === '2'){
  404. // let flag = dataInfo.tabs.some(v => v.value === '2');
  405. // !flag && dataInfo.tabs.splice(1, 0, {id: 2, name: '巡检信息', value: '2', num: ''});
  406. // }
  407. // dataInfo.tabActiveValue = dataInfo.tabs[0].value;
  408. // initData()
  409. // }else{
  410. // uni.showToast({
  411. // icon: 'none',
  412. // title: res.msg || '请求数据失败!'
  413. // });
  414. // }
  415. // })
  416. // }
  417. // // 获取巡检图片
  418. // function getInspectionImgs(){
  419. // uni.showLoading({
  420. // title: "加载中",
  421. // mask: true,
  422. // });
  423. // api_listAttachment('inspection', dataInfo.patientInspectLogId).then(res => {
  424. // uni.hideLoading();
  425. // res.data = res.data || [];
  426. // res.data.forEach(v => {
  427. // v.previewUrl = location.origin + "/file" + v.relativeFilePath;
  428. // v.thumbFilePath = location.origin + "/file" + v.thumbFilePath;
  429. // })
  430. // let imgList = res.data || [];
  431. // dataInfo.valueList.forEach(v => {
  432. // v.forEach(vv => {
  433. // imgList.forEach(item => {
  434. // if(vv.itemId == item.recordId){
  435. // if(vv.valuex && vv.valuex.length){
  436. // vv.valuex.push(item)
  437. // }else{
  438. // vv.valuex = [item];
  439. // }
  440. // }
  441. // })
  442. // })
  443. // })
  444. // })
  445. // }
  446. // // 返回巡检列表
  447. // function toList(){
  448. // uni.reLaunch({
  449. // url: `/pages/inspection/inspectionExecute/inspectionExecute`
  450. // })
  451. // }
  452. // // 查看故障单
  453. // function viewIncidentDetail(incidentId){
  454. // uni.navigateTo({
  455. // url: `/pages/incidentDetail/incidentDetail?incidentId=${incidentId}`
  456. // })
  457. // }
  458. // onLoad((option) => {
  459. // dataInfo.patientInspectLogId = option.patientInspectLogId;
  460. // getDetail();
  461. // })
  462. </script>
  463. <style lang="scss" scoped>
  464. .popup-content{
  465. padding: 40rpx;
  466. }
  467. .incidentDetail{
  468. height: 100vh;
  469. display: flex;
  470. flex-direction: column;
  471. justify-content: space-between;
  472. background-color: #EBEBEB;
  473. .head{
  474. height: 88rpx;
  475. display: flex;
  476. position: fixed;
  477. z-index: 99;
  478. width: 100%;
  479. background-color: #fff;
  480. font-size: 30rpx;
  481. .tab{
  482. flex: 1;
  483. display: flex;
  484. justify-content: center;
  485. align-items: center;
  486. border-bottom: 4rpx solid transparent;
  487. position: relative;
  488. &:last-of-type{
  489. &:after{
  490. display: none;
  491. }
  492. }
  493. // &:after{
  494. // content: '';
  495. // position: absolute;
  496. // right: 0;
  497. // top: 50%;
  498. // transform: translateY(-50%);
  499. // width: 1rpx;
  500. // height: 44rpx;
  501. // background-color: #515151;
  502. // }
  503. &.active{
  504. color: #49B856;
  505. border-color: #49B856;
  506. }
  507. }
  508. }
  509. .body{
  510. margin-top: 88rpx;
  511. box-sizing: border-box;
  512. flex: 1;
  513. min-height: 0;
  514. border-top: 7rpx solid #EBEBEB;
  515. .phone-filled{
  516. margin-left: 5rpx;
  517. }
  518. .mic-filled{
  519. margin-right: 100rpx;
  520. }
  521. .detail_item_wrap{
  522. padding-bottom: 24rpx;
  523. }
  524. .detail_head{
  525. padding: 24rpx;
  526. border-top: 8rpx solid #D2D2D2;
  527. border-bottom: 1rpx solid #D2D2D2;
  528. display: flex;
  529. justify-content: space-between;
  530. align-items: center;
  531. &:first-of-type{
  532. border-top: none;
  533. }
  534. .title{
  535. font-size: 26rpx;
  536. color: #49B856;
  537. padding-left: 18rpx;
  538. position: relative;
  539. &:before{
  540. content: '';
  541. width: 8rpx;
  542. height: 25rpx;
  543. background-color: #49B856;
  544. position: absolute;
  545. left: 0;
  546. top: 50%;
  547. transform: translateY(-50%);
  548. }
  549. }
  550. .other{
  551. display: flex;
  552. align-items: center;
  553. .priority{
  554. font-size: 26rpx;
  555. margin-right: 15rpx;
  556. }
  557. .status{
  558. font-size: 26rpx;
  559. }
  560. }
  561. }
  562. .deital_item{
  563. font-size: 26rpx;
  564. color: #555;
  565. padding: 24rpx 24rpx 0;
  566. display: flex;
  567. align-items: center;
  568. .name{
  569. width: 5em;
  570. margin-right: 24rpx;
  571. }
  572. .value{
  573. flex: 2;
  574. word-break: break-all;
  575. &.text_value{
  576. flex: 1;
  577. }
  578. &.img{
  579. display: flex;
  580. .imgItem{
  581. width: 82rpx;
  582. height: 82rpx;
  583. margin-right: 24rpx;
  584. &:last-of-type{
  585. margin-right: 0;
  586. }
  587. }
  588. .resourceItem{
  589. width: 100rpx;
  590. height: 100rpx;
  591. margin-right: 24rpx;
  592. &:last-of-type{
  593. margin-right: 0;
  594. }
  595. }
  596. .resourceItem-audio{
  597. width: 300rpx;
  598. height: 60rpx;
  599. }
  600. }
  601. }
  602. }
  603. .summaryItem_bodyItem{
  604. padding: 24rpx 24rpx 0;
  605. font-size: 26rpx;
  606. .summaryItem_bodyItem_top{
  607. display: flex;
  608. justify-content: space-between;
  609. align-items: center;
  610. .value{
  611. padding-left: 48rpx;
  612. flex-shrink: 0;
  613. }
  614. }
  615. .summaryItem_bodyItem_bottom{
  616. margin-top: 24rpx;
  617. display: flex;
  618. justify-content: space-between;
  619. align-items: center;
  620. .name{
  621. text-align: right;
  622. flex: 1;
  623. }
  624. .value{
  625. width: 220rpx;
  626. text-align: right;
  627. flex-shrink: 0;
  628. }
  629. }
  630. }
  631. .summaryItem_bodyItem_total{
  632. text-align: right;
  633. padding: 24rpx;
  634. font-size: 26rpx;
  635. }
  636. .summaryItem_total{
  637. text-align: center;
  638. padding-top: 24rpx;
  639. font-size: 32rpx;
  640. font-weight: bold;
  641. color: #49B856;
  642. border-top: 1rpx solid #D2D2D2;
  643. }
  644. .info{
  645. .infoItem{
  646. padding: 24rpx;
  647. background-color: #fff;
  648. border-top: 8rpx solid #D2D2D2;
  649. font-size: 24rpx;
  650. &:first-of-type{
  651. border-top: none;
  652. }
  653. .name{
  654. margin-top: 24rpx;
  655. &:first-of-type{
  656. margin-top: 0;
  657. }
  658. }
  659. }
  660. }
  661. .process_item_wrap{
  662. padding: 38rpx;
  663. .process_item{
  664. &:last-of-type{
  665. .process_item_bottom{
  666. border-left: none;
  667. }
  668. }
  669. .process_item_top{
  670. padding-left: 30rpx;
  671. display: flex;
  672. align-items: center;
  673. position: relative;
  674. &:before{
  675. content: '';
  676. position: absolute;
  677. left: -13rpx;
  678. top: 50%;
  679. width: 26rpx;
  680. height: 26rpx;
  681. border-radius: 50%;
  682. background-color: #49B856;
  683. transform: translateY(-50%);
  684. }
  685. .name{
  686. font-size: 30rpx;
  687. }
  688. .value{
  689. margin-left: 20rpx;
  690. font-size: 22rpx;
  691. color: #A1A1A1;
  692. flex: 1;
  693. }
  694. }
  695. .process_item_bottom{
  696. min-height: 82rpx;
  697. border-left: 1rpx solid #B7BDC6;
  698. margin-top: 5rpx;
  699. padding-left: 30rpx;
  700. display: flex;
  701. font-size: 24rpx;
  702. color: #A1A1A1;
  703. .value{
  704. margin-left: 20rpx;
  705. }
  706. }
  707. }
  708. }
  709. .appraise_detail{
  710. padding: 24rpx 24rpx 24rpx 40rpx;
  711. .appraise_detail_top{
  712. display: flex;
  713. align-items: center;
  714. justify-content: space-between;
  715. font-size: 26rpx;
  716. .name{
  717. color: #A1A1A1;
  718. }
  719. .value{}
  720. }
  721. .appraise_detail_bottom{
  722. font-size: 30rpx;
  723. margin-top: 24rpx;
  724. word-break: break-all;
  725. }
  726. }
  727. }
  728. }
  729. </style>