| | |
| | | <template> |
| | | <GlobalWindow width="960px" title="工单详情" :visible.sync="visible" :confirm-working="isWorking" @close="close" |
| | | @confirm="confirm"> |
| | | <GlobalWindow width="100%" title="工单详情" :withFooter="withFooter" :visible.sync="visible" :confirm-working="isWorking" |
| | | @confirm="confirm" @close="closeView"> |
| | | <div class="main"> |
| | | <div class="title"> |
| | | <span>工单详情</span> |
| | | <div> |
| | | <div class="status primaryColor" v-if="info.dealStatus == 0 || info.dealStatus == null">待指派</div> |
| | | <div class="status green" v-if="info.dealStatus == 1">已指派</div> |
| | | <div class="status gray" v-if="info.dealStatus == 2">已处理</div> |
| | | <div class="title_left"> |
| | | <span>工单详情</span> |
| | | <div> |
| | | <div class="status primaryColor" v-if="info.dealStatus == 0 || info.dealStatus == null">待指派</div> |
| | | <div class="status green" v-if="info.dealStatus == 1">已指派</div> |
| | | <div class="status gray" v-if="info.dealStatus == 2">已处理</div> |
| | | </div> |
| | | </div> |
| | | <el-button v-if="info.origin === 1 && isShow" @click="openWT">查看问题上报</el-button> |
| | | </div> |
| | | <div class="main_content"> |
| | | <div class="list"> |
| | |
| | | <div class="item"> |
| | | <div class="la">工单分类</div> |
| | | <div class="val">{{ info.categoryName }}</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="la">来源</div> |
| | | <div class="val" v-if="info.origin === 0">自建</div> |
| | | <div class="val" v-if="info.origin === 1">问题转工单</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="la">上报人</div> |
| | |
| | | </div> |
| | | </template> |
| | | </el-form> |
| | | <!-- 问题上报详情 --> |
| | | <ProblemReportingDetails ref="problem_Reporting_Details" @close="closeDetails" /> |
| | | </div> |
| | | </GlobalWindow> |
| | | </template> |
| | |
| | | <script> |
| | | import GlobalWindow from '@/components/common/GlobalWindow' |
| | | import BaseOpera from '@/components/base/BaseOpera' |
| | | // import ProblemReportingDetails from './problemReportingDetails' |
| | | // import ProblemReportingDetails from '@/views/workorder/components/problemReportingDetails' |
| | | import { detailById, dispatchOrder, dealOrder } from '@/api/workorder/ywWorkorder' |
| | | import { getByWorkorderId } from '@/api/ywProblem' |
| | | import { getUserList } from '@/api/system/user' |
| | | import { Message, Loading } from 'element-ui' |
| | | import { mapState } from 'vuex' |
| | | import dayjs from 'dayjs' |
| | | export default { |
| | | name: 'detail', |
| | | components: { |
| | | GlobalWindow |
| | | GlobalWindow, |
| | | ProblemReportingDetails: () => import('./problemReportingDetails') |
| | | }, |
| | | extends: BaseOpera, |
| | | data() { |
| | | return { |
| | | id: '', |
| | | visible: false, |
| | | param: { |
| | | dealType: 0 |
| | | }, |
| | |
| | | uploadData: { |
| | | folder: 'YW_WORKORDER_FILE' |
| | | }, |
| | | isShow: true, |
| | | test: false |
| | | } |
| | | }, |
| | | computed: { |
| | | userInfo() { |
| | | return this.$store.state.userInfo |
| | | }, |
| | | withFooter() { |
| | | if (this.info) { |
| | | return this.info.dealStatus === 0 || (this.info.dealStatus === 1 && (this.userInfo.id === this.info.dealUserId)); |
| | | } else { |
| | | return false; |
| | | } |
| | | } |
| | | }, |
| | | created() { |
| | | this.getStaff() |
| | | }, |
| | | methods: { |
| | | closeDetails() { |
| | | console.log('1') |
| | | this.test = false |
| | | }, |
| | | closeView() { |
| | | this.$emit('close') |
| | | this.visible = false |
| | | }, |
| | | open (title, target, show) { |
| | | this.title = title |
| | | this.isShow = show |
| | | this.id = target.workorderId |
| | | this.getDetail() |
| | | }, |
| | | openWT() { |
| | | getByWorkorderId(this.id) |
| | | .then(res => { |
| | | this.test = true |
| | | this.$nextTick(() => { |
| | | this.$refs.problem_Reporting_Details.open('问题上报详情', res, false) |
| | | }) |
| | | }) |
| | | }, |
| | | confirm() { |
| | | this.$refs['form'].validate((valid) => { |
| | | if (valid) { |
| | |
| | | if (this.info.dealStatus == 1) { |
| | | this.$set(this.param, 'getDate', dayjs().format('YYYY-MM-DD HH:mm:ss')) |
| | | } |
| | | this.visible = true |
| | | }) |
| | | }, |
| | | getStaff() { |
| | |
| | | padding-top: 20px; |
| | | |
| | | .title { |
| | | font-weight: 500; |
| | | font-size: 18px; |
| | | color: $primary-color; |
| | | |
| | | margin-bottom: 10px; |
| | | display: flex; |
| | | align-items: center; |
| | | |
| | | .status { |
| | | padding: 0 12px; |
| | | height: 24px; |
| | | line-height: 24px; |
| | | border-radius: 2px; |
| | | border: 1px solid #00BA92; |
| | | color: #00BA92; |
| | | font-weight: 400; |
| | | font-size: 12px; |
| | | margin-left: 10px; |
| | | } |
| | | |
| | | .primaryColor { |
| | | border: 1px solid rgba(63, 126, 239, .2); |
| | | background-color: rgba(63, 126, 239, .2); |
| | | } |
| | | |
| | | .green { |
| | | background-color: rgba(83, 183, 148, .2); |
| | | border: 1px solid rgba(83, 183, 148, .2); |
| | | } |
| | | |
| | | .gray { |
| | | color: #333333; |
| | | background-color: rgba(128, 128, 128, .2); |
| | | border: 1px solid rgba(128, 128, 128, .2); |
| | | justify-content: space-between; |
| | | .title_left { |
| | | display: flex; |
| | | align-items: center; |
| | | font-weight: 500; |
| | | font-size: 18px; |
| | | color: $primary-color; |
| | | .status { |
| | | padding: 0 12px; |
| | | height: 24px; |
| | | line-height: 24px; |
| | | border-radius: 2px; |
| | | border: 1px solid #00BA92; |
| | | color: #00BA92; |
| | | font-weight: 400; |
| | | font-size: 12px; |
| | | margin-left: 10px; |
| | | } |
| | | .primaryColor { |
| | | border: 1px solid rgba(63, 126, 239, .2); |
| | | background-color: rgba(63, 126, 239, .2); |
| | | } |
| | | .green { |
| | | background-color: rgba(83, 183, 148, .2); |
| | | border: 1px solid rgba(83, 183, 148, .2); |
| | | } |
| | | .gray { |
| | | color: #333333; |
| | | background-color: rgba(128, 128, 128, .2); |
| | | border: 1px solid rgba(128, 128, 128, .2); |
| | | } |
| | | } |
| | | } |
| | | |