| | |
| | | <!-- 工单详情 - 包含待审核、待处理、处理中、已完成 --> |
| | | <template> |
| | | <div class="workDetailContainer"> |
| | | <WebViewPlus v-if="isApp" ref="sWebViewRef" :src="`${viewUrl}`" @webMessage="onPostMessage"/> |
| | | <WebViewPlus ref="sWebViewRef" :src="`${viewUrl}`" @webMessage="onPostMessage"/> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | }); |
| | | } |
| | | } |
| | | const isApp = ref(false) |
| | | onShow(() => { |
| | | isApp.value = true |
| | | }); |
| | | |
| | | onHide(() => { |
| | | isApp.value = false |
| | | }); |
| | | |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .workDetailContainer { |
| | | padding: 0 10px; |
| | | |
| | | .detailTop { |
| | | .image-container { |
| | | position: relative; |
| | | width: 100%; |
| | | height: 200px; |
| | | |
| | | .detailImage { |
| | | width: 100%; |
| | | height: 100%; |
| | | display: block; |
| | | object-fit: cover |
| | | } |
| | | |
| | | .detailTitle { |
| | | position: absolute; |
| | | left: 0; |
| | | bottom: 0; |
| | | width: 100%; |
| | | } |
| | | |
| | | .titleText { |
| | | display: flex; |
| | | width: 100%; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .stepContainer { |
| | | margin-top: 10px; |
| | | display: flex; |
| | | background-color: antiquewhite; |
| | | border-radius: 5px; |
| | | padding: 10px; |
| | | |
| | | .horizontal-step { |
| | | display: flex; |
| | | align-items: center; |
| | | gap: 12px; |
| | | |
| | | .step-title { |
| | | min-width: 60px; |
| | | } |
| | | |
| | | .step-desc { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | gap: 8px; |
| | | // color: #666; |
| | | font-size: 14px; |
| | | } |
| | | } |
| | | |
| | | } |
| | | |
| | | |
| | | .actionButton { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | margin-bottom: 10px; |
| | | |
| | | .btngroups { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | |
| | | .u-button { |
| | | padding: 9px 20px; |
| | | height: 32px; |
| | | |
| | | &:last-child { |
| | | margin-left: 12px; |
| | | margin-right: 12px; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .leftBtn { |
| | | width: 70px; |
| | | height: 32px; |
| | | background-color: #999; |
| | | border-radius: 5px; |
| | | text-align: center; |
| | | line-height: 32px; |
| | | color: #fff; |
| | | cursor: pointer; |
| | | opacity: 0.8; |
| | | } |
| | | |
| | | .disableds { |
| | | background: #999 !important; |
| | | cursor: not-allowed !important; |
| | | pointer-events: none; |
| | | opacity: 0.3 !important; |
| | | } |
| | | } |
| | | |
| | | .workOrderContent { |
| | | margin-top: 15px; |
| | | |
| | | .workOrderContainer { |
| | | div { |
| | | margin-bottom: 10px; |
| | | } |
| | | |
| | | .titketName { |
| | | display: flex; |
| | | align-items: center; |
| | | } |
| | | } |
| | | } |
| | | |
| | | |
| | | } |
| | | </style> |