<template>
|
<view class="she">
|
<u--form labelPosition="left" :model="model" :rules="rules" ref="uForm">
|
<u-form-item label="上报时间" labelWidth="120" prop="submitDate" borderBottom @click="openS" required>
|
<u--input v-model="model.submitDate" border="none" placeholder="请选择上报时间" disabledColor="#ffffff"
|
disabled></u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
<u-form-item label="发现时间" labelWidth="120" prop="happenTime" borderBottom @click="openF" required>
|
<u--input v-model="model.happenTime" border="none" placeholder="请选择发现时间" disabledColor="#ffffff"
|
disabled></u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
<u-form-item label="部门/班组" labelWidth="120" prop="companyName" borderBottom required>
|
<u--input v-model="model.companyName" border="none" placeholder="请选择部门/班组" disabledColor="#ffffff"
|
disabled></u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
<u-form-item label="位置" labelWidth="120" prop="localtionName" borderBottom @click="$refs.pengTree._show()" required>
|
<u--input v-model="model.localtionName" border="none" placeholder="请选择位置" disabledColor="#ffffff"
|
disabled></u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
<u-form-item label="观察主题" labelWidth="120" prop="typeName" borderBottom @click="openG" required>
|
<u--input v-model="model.typeName" border="none" placeholder="请选择观察主题" disabledColor="#ffffff"
|
disabled></u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
<u-form-item label="观察项" labelWidth="120" prop="dcaYesNum" borderBottom @click="jumpSelectType()" required>
|
<view style="width: 100%; display: flex; align-items: center; justify-content: space-between;">
|
<view style="font-size: 28rpx; color: rgba(32,110,238,1);">符合：{{model.dcaYesNum}} 不符合：{{model.dcaNoNum}}</view>
|
<u-icon name="arrow-right"></u-icon>
|
</view>
|
</u-form-item>
|
<u-form-item label="DCA图片" labelWidth="120" prop="multifileList" labelPosition="top" borderBottom>
|
<u-upload
|
:fileList="model.multifileList"
|
@afterRead="afterRead"
|
@delete="deletePic"
|
multiple
|
name="1"
|
style="margin-top: 15rpx;" />
|
</u-form-item>
|
<u-form-item label="通知人" labelWidth="120" prop="notifier" borderBottom required>
|
<u--input v-model="model.notifier" border="none" placeholder="请输入通知人" disabledColor="#ffffff"
|
disabled></u--input>
|
</u-form-item>
|
</u--form>
|
<u-button type="primary" text="提交" @click="submit" style="margin-top: 60rpx;"></u-button>
|
<!-- 上报时间 -->
|
<u-datetime-picker :show="show1" v-model="time" mode="datetime" @cancel="closeS"
|
@confirm="selectTime"></u-datetime-picker>
|
<!-- 发现时间 -->
|
<u-datetime-picker :show="show5" v-model="time1" mode="datetime" @cancel="closeF"
|
@confirm="selectTime1"></u-datetime-picker>
|
<!-- 确定弹窗 -->
|
<u-modal :show="show4" showCancelButton title="提醒" @cancel="closeT" @confirm="report">
|
<view class="slot-content">
|
您本次共提交{{total}}项，<text>{{model.dcaYesNum}}项</text>符合，<text>{{model.dcaNoNum}}项</text>不符合，系统将会根据不符合项形成对应工单。
|
</view>
|
</u-modal>
|
<!-- 位置 -->
|
<peng-tree
|
ref="pengTree"
|
:range="address"
|
idKey="id"
|
:selectParent="false"
|
nameKey="name"
|
:multiple="false"
|
title="选择位置"
|
@confirm="selectAddress"
|
@cancel="$refs.pengTree._hide()">
|
</peng-tree>
|
<!-- 主题 -->
|
<u-picker
|
:show="show2"
|
:columns="theme"
|
keyName="name"
|
@confirm="selectTheme"
|
@cancel="closeG" />
|
<!-- 提交成功 -->
|
<u-modal :show="show6" showCancelButton confirmText="查看详情" cancelText="继续上报" @cancel="next" @confirm="toDesc">
|
<view class="slot-content1">
|
<u-icon name="checkmark-circle-fill" color="#3875C5" size="70"></u-icon>
|
<text>提交成功</text>
|
<text>感谢您的反馈</text>
|
</view>
|
</u-modal>
|
</view>
|
</template>
|
|
<script>
|
import { mapState } from 'vuex'
|
import pengTree from '@/uni_modules/peng-tree/peng-tree/peng-tree.vue'
|
export default {
|
components: { pengTree },
|
computed: {
|
...mapState(['userInfo'])
|
},
|
data() {
|
return {
|
id: null,
|
model: {
|
submitDate: '',
|
happenTime: '',
|
companyName: '',
|
localtionName: '',
|
localtionId: '',
|
typeId: '',
|
typeName: '',
|
notifier: '',
|
dcaYesNum: 0,
|
dcaNoNum: 0,
|
dcaNoProblemDTOList: [],
|
multifileList: [],
|
type: 1
|
},
|
rules: {
|
submitDate: [{
|
type: 'string',
|
required: true,
|
message: '上报时间不能为空',
|
trigger: ['blur', 'change']
|
}],
|
happenTime: [{
|
type: 'string',
|
required: true,
|
message: '发现时间不能为空',
|
trigger: ['blur', 'change']
|
}],
|
companyName: [{
|
type: 'string',
|
required: true,
|
message: '部门/班组不能为空',
|
trigger: ['blur', 'change']
|
}],
|
localtionName: [{
|
type: 'string',
|
required: true,
|
message: '位置不能为空',
|
trigger: ['blur', 'change']
|
}],
|
typeName: [{
|
type: 'string',
|
required: true,
|
message: '观察主题不能为空',
|
trigger: ['blur', 'change']
|
}],
|
notifier: [{
|
type: 'string',
|
required: true,
|
message: '通知人不能为空',
|
trigger: ['blur', 'change']
|
}]
|
},
|
show: false,
|
show1: false,
|
show2: false,
|
show3: false,
|
show4: false,
|
show5: false,
|
show6: false,
|
time: new Date().getTime(),
|
time1: new Date().getTime(),
|
address: [],
|
theme: [],
|
total: 0
|
};
|
},
|
onLoad() {
|
this.model.companyName = this.userInfo.companyName
|
this.getNotifier()
|
this.getLocation()
|
this.getZhuti()
|
// 接收数据
|
uni.$on('update', (data) => {
|
this.total = data.total
|
this.model.dcaYesNum = data.dcaYesNum
|
this.model.dcaNoNum = data.dcaNoNum
|
this.model.dcaNoProblemDTOList = data.dcaNoProblemDTOList
|
})
|
},
|
methods: {
|
openG() {
|
this.stopScroll()
|
this.show2 = true
|
},
|
closeG() {
|
this.canScroll()
|
this.show2 = false
|
},
|
next() {
|
this.model.submitDate = ''
|
this.model.happenTime = ''
|
this.model.companyName = ''
|
this.model.localtionName = ''
|
this.model.localtionId = ''
|
this.model.typeId = ''
|
this.model.typeName = ''
|
this.model.notifier = ''
|
this.model.dcaYesNum = 0
|
this.model.dcaNoNum = 0
|
this.model.dcaNoProblemDTOList = []
|
this.model.multifileList = []
|
this.model.type = 1
|
this.canScroll()
|
this.show6 = false
|
},
|
toDesc() {
|
this.canScroll()
|
this.show6 = false
|
uni.navigateTo({
|
url: `/pages/details_dca/details_dca?id=${this.id}`
|
})
|
},
|
// 提交上报
|
async report() {
|
let res = await this.$u.api.workOrderCreate(this.model)
|
if (res.code === 200) {
|
this.show4 = false
|
this.id = res.data
|
this.show6 = true
|
}
|
},
|
// dac位置
|
async getLocation() {
|
let res = await this.$u.api.categoryTree({ categoryType: 3 })
|
if (res.code === 200) {
|
this.address = res.data
|
}
|
},
|
// dac主题
|
async getZhuti() {
|
let res = await this.$u.api.categoryList({ categoryType: 4, isRoot: 1 })
|
if (res.code === 200) {
|
this.theme = [res.data]
|
}
|
},
|
// 选择主题
|
selectTheme(e) {
|
this.model.typeId = e.value[0].id
|
this.model.typeName = e.value[0].name
|
this.canScroll()
|
this.show2 = false
|
},
|
// 选择位置
|
selectAddress(e) {
|
this.model.localtionId = e[0].id
|
this.model.localtionName = e[0].name
|
this.$refs.pengTree._hide()
|
},
|
// 获取通知人
|
async getNotifier() {
|
let res = await this.$u.api.managersList({ type: 0 })
|
if (res.code === 200) {
|
this.model.notifier = res.data.map(item => item.memberName).join(',')
|
}
|
},
|
jumpSelectType() {
|
if (!this.model.typeId) {
|
uni.showToast({
|
title: '请先选择观察主题',
|
icon: 'none'
|
})
|
return
|
}
|
uni.navigateTo({
|
url: `/pages/type_dca/type_dca?theme=${this.model.typeId}&themeName=${this.model.typeName}`
|
})
|
},
|
// 删除图片
|
deletePic(event) {
|
this.model.multifileList.forEach((item, index) => {
|
if (item.imgaddr === event.file.imgaddr) {
|
this.model.multifileList.splice(index, 1)
|
}
|
})
|
},
|
// 新增图片
|
async afterRead(event) {
|
var that = this
|
uni.showLoading({ title: '上传中...', mask: true })
|
uni.uploadFile({
|
url: this.$baseUrl + '/web/public/uploadBatch',
|
files: event.file.map(e => {
|
return { name: 'files', uri: e.url }
|
}),
|
formData: {
|
folder: "WORKORDER_FILE_PATH",
|
},
|
success(res) {
|
uni.hideLoading();
|
let obj = JSON.parse(res.data)
|
if (obj.code === 200) {
|
console.log(obj.data)
|
obj.data.forEach(item => {
|
item.fileurl = item.imgaddr
|
})
|
that.model.multifileList = [...that.model.multifileList, ...obj.data]
|
}
|
}
|
})
|
// uni.uploadFile({
|
// url: this.$baseUrl + '/web/public/upload',
|
// filePath: event.file.url,
|
// name: "file",
|
// formData: {
|
// folder: "WORKORDER_FILE_PATH"
|
// },
|
// success: (res) => {
|
// let obj = JSON.parse(res.data)
|
// if (obj.code === 200) {
|
// obj.data.fileurl = obj.data.imgaddr
|
// this.model.multifileList.push(obj.data)
|
// }
|
// }
|
// });
|
},
|
submit() {
|
this.$refs.uForm.validate().then(res => {
|
if (this.total === 0) return uni.showToast({
|
title: '请选择观察项',
|
icon: 'none'
|
})
|
this.show4 = true
|
}).catch(errors => {
|
|
})
|
},
|
openF() {
|
this.stopScroll()
|
this.show5 = true
|
},
|
closeF() {
|
this.canScroll()
|
this.show5 = false
|
},
|
openS() {
|
this.stopScroll()
|
this.show1 = true
|
},
|
closeS() {
|
this.canScroll()
|
this.show1 = false
|
},
|
closeT() {
|
this.canScroll()
|
this.show4 = false
|
},
|
// 上报时间
|
selectTime(e) {
|
this.model.submitDate = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
|
this.canScroll()
|
this.show1 = false
|
},
|
// 发现时间
|
selectTime1(e) {
|
this.model.happenTime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
|
this.canScroll()
|
this.show5 = false
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.she {
|
width: 100%;
|
padding: 0 30rpx 30rpx 30rpx;
|
box-sizing: border-box;
|
.slot-content {
|
color: rgba(16,16,16,1);
|
font-size: 28rpx;
|
margin: 30rpx 0;
|
text {
|
color: #206EEE;
|
}
|
}
|
.slot-content1 {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
text {
|
&:nth-child(2) {
|
color: rgba(16,16,16,1);
|
font-size: 28rpx;
|
margin-top: 24rpx;
|
}
|
&:nth-child(3) {
|
color: rgba(190,190,190,1);
|
font-size: 24rpx;
|
margin-top: 34rpx;
|
}
|
}
|
}
|
}
|
</style>
|
