You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
349 lines
7.1 KiB
349 lines
7.1 KiB
10 months ago
|
<template>
|
||
|
|
<!-- 详情 -->
|
||
|
|
<view class="detail-container">
|
||
|
|
<view class="info">
|
||
|
|
<view class="title">
|
||
|
|
<view>维修工单</view>
|
||
|
|
<view>转班</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec">
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>工单单号</view>
|
||
|
|
<view>WXDH2051351</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>工单主题</view>
|
||
|
|
<view>设备一维修2554</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>工单类型</view>
|
||
|
|
<view>报修工单</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>维修班组</view>
|
||
|
|
<view>维修班组一</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>工程师</view>
|
||
|
|
<view>橙子</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>维修工</view>
|
||
|
|
<view>香蕉</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="info" style="padding-bottom: 130rpx;">
|
||
|
|
<view class="tab">
|
||
|
|
<u-tabs :list="list" :is-scroll="false" bar-height="2" bar-width="250" v-model="current"
|
||
|
|
@change="change"></u-tabs>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view>
|
||
|
|
<view class="title">
|
||
|
|
<view>{{changeItem.name}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec" v-if="current == 0">
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>设备编号</view>
|
||
|
|
<view>WXDH2051351</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>设备名称</view>
|
||
|
|
<view>设备一维修2554</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>规格型号</view>
|
||
|
|
<view>报修工单</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>设备类型</view>
|
||
|
|
<view>维修班组一</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>存放位置</view>
|
||
|
|
<view>橙子</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>使用部门</view>
|
||
|
|
<view>香蕉</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec" v-if="current == 1">
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>设备编号</view>
|
||
|
|
<view>WXDH2051351</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>设备名称</view>
|
||
|
|
<view>设备一维修2554</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>规格型号</view>
|
||
|
|
<view>报修工单</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>设备类型</view>
|
||
|
|
<view>维修班组一</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>存放位置</view>
|
||
|
|
<view>橙子</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec-item">
|
||
|
|
<view>使用部门</view>
|
||
|
|
<view>香蕉</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="dec" v-if="current == 2">
|
||
|
|
<SparePartsCard :subForm='subForm' :data='data' @addSubForm='addSubForm' @delSubFormItem='delSubFormItem'>
|
||
|
|
</SparePartsCard>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="footer">
|
||
|
|
<view class="btns">
|
||
|
|
<u-button type="primary">保存/接单</u-button>
|
||
|
|
<u-button type="primary">完成</u-button>
|
||
|
|
<u-button type="primary">验证完结</u-button>
|
||
|
|
</view>
|
||
|
|
<view style="height: constant(safe-area-inset-bottom); height: env(safe-area-inset-bottom);"></view>
|
||
|
|
</view>
|
||
|
|
<u-popup v-model="isPopupShow" mode="center" border-radius="14">
|
||
|
|
<view class="popup-title">添加记录</view>
|
||
|
|
<view class="popup">
|
||
|
|
<Form :form='subForm' :data='data' ref="form2"></Form>
|
||
|
|
</view>
|
||
|
|
<view class="popup-footer">
|
||
|
|
<view @click="cancle">取消</view>
|
||
|
|
<view class="sure" @click="addSpare">确认</view>
|
||
|
|
</view>
|
||
|
|
</u-popup>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import Form from '@/components/form/index.vue'
|
||
|
|
import SparePartsCard from '@/components/sparePartsCard/index.vue'
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
Form,
|
||
|
|
SparePartsCard
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
list: [{
|
||
|
|
name: '设备信息'
|
||
|
|
}, {
|
||
|
|
name: '报修信息'
|
||
|
|
}, {
|
||
|
|
name: '维修记录'
|
||
|
|
}],
|
||
|
|
current: 0,
|
||
|
|
changeItem: '',
|
||
|
|
data: {
|
||
|
|
name: '',
|
||
|
|
subList: [{
|
||
|
|
name: '备件111111',
|
||
|
|
stork: '1',
|
||
|
|
number: '30',
|
||
|
|
}, {
|
||
|
|
name: '备件111111',
|
||
|
|
stork: '1',
|
||
|
|
number: '30',
|
||
|
|
}]
|
||
|
|
},
|
||
|
|
isPopupShow:false,
|
||
|
|
subForm: {
|
||
|
|
formLabel: '',
|
||
|
|
formField: 'subList',
|
||
|
|
required: true,
|
||
|
|
isShowButton: true,
|
||
|
|
disabled: false,
|
||
|
|
visible: true,
|
||
|
|
loading: false,
|
||
|
|
labelWidth: '180rpx',
|
||
|
|
border: true,
|
||
|
|
errorType: ['toast'],
|
||
|
|
formData: [{
|
||
|
|
type: 'singleColumn',
|
||
|
|
field: 'name',
|
||
|
|
label: '模具',
|
||
|
|
disabled: false,
|
||
|
|
required: true,
|
||
|
|
span: 12,
|
||
|
|
list: [{
|
||
|
|
label: '类型1',
|
||
|
|
value: 1
|
||
|
|
}, {
|
||
|
|
label: '类型2',
|
||
|
|
value: 2
|
||
|
|
}, {
|
||
|
|
label: '类型3',
|
||
|
|
value: 3
|
||
|
|
}]
|
||
|
|
}, {
|
||
|
|
type: 'text',
|
||
|
|
field: 'stork',
|
||
|
|
label: '库存',
|
||
|
|
disabled: false,
|
||
|
|
required: true,
|
||
|
|
isList: true,
|
||
|
|
span: 6
|
||
|
|
}, {
|
||
|
|
type: 'text',
|
||
|
|
field: 'number',
|
||
|
|
label: '数量',
|
||
|
|
disabled: false,
|
||
|
|
required: true,
|
||
|
|
isList: true,
|
||
|
|
span: 6
|
||
|
|
}],
|
||
|
|
},
|
||
|
|
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
change(index) {
|
||
|
|
console.log("index", index);
|
||
|
|
this.current = index
|
||
|
|
this.changeItem = this.list[this.current]
|
||
|
|
},
|
||
|
|
// 添加表格表单
|
||
|
|
addSubForm() {
|
||
|
|
console.log(5)
|
||
|
|
this.isPopupShow = true
|
||
|
|
},
|
||
|
|
// 添加备件
|
||
|
|
addSpare(){
|
||
|
|
// 校验
|
||
|
|
for (let i = 0; i < this.subForm.formData.length; i++) {
|
||
|
|
if (this.subForm.formData[i].required === true) {
|
||
|
|
if (!this.data[this.subForm.formData[i].field]) {
|
||
|
|
let placeholder = '请输入'
|
||
|
|
if (this.subForm.formData[i].type == 'text' || this.subForm.formData[i].type == 'textarea') {
|
||
|
|
placeholder = '请输入'
|
||
|
|
} else {
|
||
|
|
placeholder = '请选择'
|
||
|
|
}
|
||
|
|
this.$modal.showToast(placeholder + this.subForm.formData[i].label)
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 取消添加备件
|
||
|
|
cancle(){
|
||
|
|
this.isPopupShow = false
|
||
|
|
},
|
||
|
|
},
|
||
|
|
onLoad() {
|
||
|
|
this.changeItem = this.list[this.current]
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.info {
|
||
|
|
background: white;
|
||
|
|
margin-bottom: 20rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab {
|
||
|
|
border-bottom: 1px solid #e4e4e4;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.title {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding: 20rpx 30rpx;
|
||
|
|
border-bottom: 1px solid #e4e4e4;
|
||
|
|
|
||
|
|
view {
|
||
|
|
&:nth-child(1) {
|
||
|
|
flex: 1;
|
||
|
|
border-left: 10rpx solid #409eff;
|
||
|
|
padding-left: 20rpx;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.dec {
|
||
|
|
padding: 30rpx;
|
||
|
|
|
||
|
|
.dec-item {
|
||
|
|
padding-bottom: 30rpx;
|
||
|
|
display: flex;
|
||
|
|
|
||
|
|
view {
|
||
|
|
&:nth-child(1) {
|
||
|
|
width: 160rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
&:nth-child(2) {
|
||
|
|
color: #888888;
|
||
|
|
flex: 1;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.popup-title {
|
||
|
|
text-align: center;
|
||
|
|
font-size: 32rpx;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #409eff;
|
||
|
|
padding: 30rpx
|
||
|
|
}
|
||
|
|
|
||
|
|
.popup {
|
||
|
|
width: 600rpx;
|
||
|
|
padding: 0rpx 60rpx 0rpx;
|
||
|
|
|
||
|
|
}
|
||
|
|
.popup-footer{
|
||
|
|
display: flex;
|
||
|
|
border-top: 1px solid #e4e4e4;
|
||
|
|
view{
|
||
|
|
line-height: 100rpx;
|
||
|
|
flex: 1;
|
||
|
|
text-align: center;
|
||
|
|
&.sure{
|
||
|
|
color: #409eff;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.footer {
|
||
|
|
position: fixed;
|
||
|
|
bottom: 0px;
|
||
|
|
left: 0px;
|
||
|
|
width: 100%;
|
||
|
|
background: white;
|
||
|
|
z-index: 22;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btns {
|
||
|
|
display: flex;
|
||
|
|
|
||
|
|
padding: 20rpx;
|
||
|
|
box-shadow: 0px -2rpx 20rpx rgba(0, 0, 0, 0.1);
|
||
|
|
|
||
|
|
|
||
|
|
button {
|
||
|
|
flex: 1;
|
||
|
|
margin: 0px 10rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sure {
|
||
|
|
background: #409eff;
|
||
|
|
color: white;
|
||
|
|
border-radius: 8rpx;
|
||
|
|
|
||
|
|
&::after {
|
||
|
|
border: 1px solid #409eff;
|
||
|
|
border-radius: 0px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|