|
|
@@ -0,0 +1,282 @@
|
|
|
+<!--
|
|
|
+ * @Author: wanglj wanglijie@dashoo.cn
|
|
|
+ * @Date: 2025-03-18 20:02:42
|
|
|
+ * @LastEditors: wanglj wanglijie@dashoo.cn
|
|
|
+ * @LastEditTime: 2025-03-21 09:46:32
|
|
|
+ * @FilePath: \labsop_h5\src\view\training\enroll.vue
|
|
|
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
|
|
+-->
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <van-form ref="formRef" @submit="onSubmit" class="mt10" required="auto">
|
|
|
+ <h4 class="mb8 mt8">巡检信息</h4>
|
|
|
+ <van-field v-model="state.form.taskTitle" label="任务名称" placeholder="任务名称" :rules="[{ required: true, message: '请输入任务名称' }]" />
|
|
|
+ <van-cell-group>
|
|
|
+ <van-field
|
|
|
+ v-model="state.form.labName"
|
|
|
+ label="实验室"
|
|
|
+ placeholder="实验室"
|
|
|
+ readonly
|
|
|
+ @click="state.shwoLab = true"
|
|
|
+ :rules="[{ required: true, message: '请选择实验室' }]"
|
|
|
+ />
|
|
|
+ <van-field
|
|
|
+ v-model="state.form.frcnPmName"
|
|
|
+ label="负责人"
|
|
|
+ placeholder="负责人"
|
|
|
+ readonly
|
|
|
+ @click="state.shwoUser = true"
|
|
|
+ :rules="[{ required: true, message: '请选择负责人' }]"
|
|
|
+ />
|
|
|
+ <van-field
|
|
|
+ v-model="state.form.date"
|
|
|
+ label="限定整改时间"
|
|
|
+ placeholder="限定整改时间"
|
|
|
+ :rules="[{ required: true, message: '限定整改时间' }]"
|
|
|
+ @click="showAddDatePicker = true"
|
|
|
+ readonly
|
|
|
+ />
|
|
|
+ <van-field
|
|
|
+ v-model="state.form.troubleDesc"
|
|
|
+ rows="3"
|
|
|
+ autosize
|
|
|
+ type="textarea"
|
|
|
+ maxlength="200"
|
|
|
+ show-word-limit
|
|
|
+ label="隐患说明"
|
|
|
+ placeholder="隐患说明"
|
|
|
+ :rules="[{ required: true, message: '请输入隐患说明' }]"
|
|
|
+ />
|
|
|
+ <van-field name="uploader" label="隐患照片" :rules="[{ required: true, message: '请上传隐患照片' }]">
|
|
|
+ <template #input>
|
|
|
+ <van-uploader v-model="state.form.photos" :after-read="afterRead" preview-size="60" :preview-full-image="true" :max-count="6" />
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ </van-cell-group>
|
|
|
+ <van-action-bar placeholder>
|
|
|
+ <van-action-bar-icon icon="wap-home-o" text="首页" @click="router.push('/home')" />
|
|
|
+ <van-action-bar-icon icon="revoke" text="返回" @click="router.push('/lab/inspection/home')" />
|
|
|
+ <van-action-bar-button type="primary" text="立即提交" :loading="loading" native-type="submit" />
|
|
|
+ </van-action-bar>
|
|
|
+ </van-form>
|
|
|
+ </div>
|
|
|
+ <!-- 实验室 -->
|
|
|
+ <van-popup v-model:show="state.shwoLab" position="bottom">
|
|
|
+ <van-picker :columns="labList" :columns-field-names="{ text: 'labName', value: 'id' }" @confirm="pickLab" @cancel="state.shwoLab = false" />
|
|
|
+ </van-popup>
|
|
|
+ <!-- 负责人 -->
|
|
|
+ <van-popup v-model:show="state.shwoUser" position="bottom">
|
|
|
+ <van-picker :columns="userList" :columns-field-names="{ text: 'name', value: 'id' }" @confirm="pickUser" @cancel="state.shwoUser = false" />
|
|
|
+ </van-popup>
|
|
|
+ <!-- 所在时间 -->
|
|
|
+ <van-popup v-model:show="showAddDatePicker" position="bottom">
|
|
|
+ <van-calendar v-model:show="showAddDatePicker" @confirm="onConfirmDate" @cancel="showAddDatePicker = false" type="range" />
|
|
|
+ </van-popup>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script name="repairReportConfirm" lang="ts" setup>
|
|
|
+ import to from 'await-to-js'
|
|
|
+ import { onMounted, reactive, ref } from 'vue'
|
|
|
+ import { storeToRefs } from 'pinia'
|
|
|
+ import { useUserInfo } from '/@/stores/userInfo'
|
|
|
+ import { showNotify } from 'vant'
|
|
|
+ import { formatDate } from '/@/utils/formatTime'
|
|
|
+ import { useRouter } from 'vue-router'
|
|
|
+ import { handleUpload } from '/@/utils/upload'
|
|
|
+ import { useRectificationNewApi } from '/@/api/laboratory/rectification/indexNew'
|
|
|
+ import { useLabApi } from '/@/api/laboratory/lab'
|
|
|
+ import { useSystemApi } from '/@/api/laboratory/system'
|
|
|
+
|
|
|
+ const LabApi = useLabApi()
|
|
|
+ const rectificationApi = useRectificationNewApi()
|
|
|
+ const systemApi = useSystemApi()
|
|
|
+
|
|
|
+ const labList = ref([])
|
|
|
+ const userList = ref([])
|
|
|
+
|
|
|
+ const storesUseUserInfo = useUserInfo()
|
|
|
+ const router = useRouter()
|
|
|
+
|
|
|
+ const { userInfos } = storeToRefs(storesUseUserInfo)
|
|
|
+
|
|
|
+ const formRef = ref()
|
|
|
+ const state = reactive({
|
|
|
+ form: {
|
|
|
+ taskTitle: '',
|
|
|
+ labId: null,
|
|
|
+ frcnPmId: null,
|
|
|
+ date: '',
|
|
|
+ photos: [] as any,
|
|
|
+ frcnStartDate: '',
|
|
|
+ frcnEndDate: '',
|
|
|
+ labName: '',
|
|
|
+ troubleDesc: '',
|
|
|
+ frcnPmName: ''
|
|
|
+ },
|
|
|
+ shwoLab: false,
|
|
|
+ shwoUser: false
|
|
|
+ })
|
|
|
+ const loading = ref(false) // 加载状态
|
|
|
+
|
|
|
+ const initForm = async () => {
|
|
|
+ state.form = {
|
|
|
+ taskTitle: '',
|
|
|
+ labId: null,
|
|
|
+ frcnPmId: null,
|
|
|
+ date: '',
|
|
|
+ photos: [] as any,
|
|
|
+ frcnStartDate: '',
|
|
|
+ frcnEndDate: '',
|
|
|
+ labName: '',
|
|
|
+ troubleDesc: '',
|
|
|
+ frcnPmName: ''
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ const date = ref([]) // 选择的日期
|
|
|
+ const maxDate = ref(new Date()) // 最大日期
|
|
|
+
|
|
|
+ const showAddDatePicker = ref(false) // 是否显示选择日期的弹窗
|
|
|
+
|
|
|
+ const getLabList = async () => {
|
|
|
+ const [err, res]: ToResponse = await to(LabApi.getList())
|
|
|
+ if (err) return
|
|
|
+ labList.value = res?.data.list
|
|
|
+ }
|
|
|
+
|
|
|
+ const getUserList = async () => {
|
|
|
+ systemApi.getInstUserList({ roleCode: 'laboratory_manager' }).then((user) => {
|
|
|
+ userList.value = user.data.map((item: any) => ({ id: item.id, name: item.nickName }))
|
|
|
+ })
|
|
|
+ }
|
|
|
+ const onSubmit = async () => {
|
|
|
+ console.log('提交表单')
|
|
|
+ const [errValid] = await to(formRef.value.validate())
|
|
|
+ if (errValid) return
|
|
|
+ let params = JSON.parse(JSON.stringify(state.form))
|
|
|
+ console.log(params)
|
|
|
+ const files = params.photos.map((item: any) => {
|
|
|
+ return {
|
|
|
+ name: item.name,
|
|
|
+ url: item.url
|
|
|
+ }
|
|
|
+ })
|
|
|
+ loading.value = true
|
|
|
+ const [err, res]: ToResponse = await to(rectificationApi.onCreate(params))
|
|
|
+ loading.value = false
|
|
|
+ if (err) return
|
|
|
+ showNotify({
|
|
|
+ type: 'success',
|
|
|
+ message: '巡检隐患信息已提交,请耐心等待处理'
|
|
|
+ })
|
|
|
+ setTimeout(() => {
|
|
|
+ router.push('/lab/inspection/home')
|
|
|
+ }, 1000)
|
|
|
+ }
|
|
|
+
|
|
|
+ const onConfirmDate = (values) => {
|
|
|
+ const [start, end] = values
|
|
|
+ showAddDatePicker.value = false
|
|
|
+ state.form.frcnStartDate = formatDate(new Date(start), 'YYYY-mm-dd')
|
|
|
+ state.form.frcnEndDate = formatDate(new Date(end), 'YYYY-mm-dd')
|
|
|
+ state.form.date = state.form.frcnStartDate + '-' + state.form.frcnEndDate
|
|
|
+ }
|
|
|
+
|
|
|
+ const pickLab = ({ selectedOptions }: { selectedOptions: any[] }) => {
|
|
|
+ state.shwoLab = false
|
|
|
+ state.form.labId = selectedOptions[selectedOptions.length - 1].id
|
|
|
+ state.form.labName = selectedOptions[selectedOptions.length - 1].labName
|
|
|
+ }
|
|
|
+
|
|
|
+ const pickUser = ({ selectedOptions }: { selectedOptions: any[] }) => {
|
|
|
+ state.shwoUser = false
|
|
|
+ state.form.frcnPmId = selectedOptions[selectedOptions.length - 1].id
|
|
|
+ state.form.frcnPmName = selectedOptions[selectedOptions.length - 1].name
|
|
|
+ }
|
|
|
+
|
|
|
+ const afterRead = async (files: any) => {
|
|
|
+ if (files.length) {
|
|
|
+ for (const file of files) {
|
|
|
+ file.status = 'uploading'
|
|
|
+ const [err, res]: ToResponse = await to(handleUpload(file.file))
|
|
|
+ if (err) {
|
|
|
+ file.status = 'failed'
|
|
|
+ return
|
|
|
+ }
|
|
|
+ file.status = 'success'
|
|
|
+ file.url = res
|
|
|
+ file.name = file.file.name
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ const file = files
|
|
|
+ file.status = 'uploading'
|
|
|
+ const [err, res]: ToResponse = await to(handleUpload(file.file))
|
|
|
+ if (err) {
|
|
|
+ file.status = 'failed'
|
|
|
+ return
|
|
|
+ }
|
|
|
+ file.status = 'success'
|
|
|
+ file.url = res
|
|
|
+ file.name = file.file.name
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ onMounted(async () => {
|
|
|
+ getLabList()
|
|
|
+ getUserList()
|
|
|
+ initForm()
|
|
|
+ })
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .app-container {
|
|
|
+ header {
|
|
|
+ padding: 14px;
|
|
|
+ background-color: #f9ffff;
|
|
|
+ border-radius: 4px;
|
|
|
+ margin-top: 10px;
|
|
|
+ }
|
|
|
+ h4 {
|
|
|
+ margin: 10px 0;
|
|
|
+ height: 20px;
|
|
|
+ line-height: 20px;
|
|
|
+ &::before {
|
|
|
+ display: inline-block;
|
|
|
+ content: '';
|
|
|
+ background-color: #3c78e3;
|
|
|
+ width: 4px;
|
|
|
+ height: 20px;
|
|
|
+ margin-right: 4px;
|
|
|
+ vertical-align: top;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ :deep(.flow-cell) {
|
|
|
+ margin-left: 22px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ck-editor {
|
|
|
+ height: calc(100vh - 100px);
|
|
|
+ overflow-y: auto;
|
|
|
+ padding: 0 10px;
|
|
|
+ }
|
|
|
+ .need-to-know {
|
|
|
+ height: calc(100% - 20px);
|
|
|
+ overflow: hidden;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ padding: 10px 20px;
|
|
|
+ white-space: pre-wrap;
|
|
|
+ p {
|
|
|
+ flex: 1;
|
|
|
+ overflow-y: auto;
|
|
|
+ }
|
|
|
+ footer {
|
|
|
+ flex: 0 0 45px;
|
|
|
+ margin-top: 4px;
|
|
|
+ border-top: 1px solid #f7f8fa;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|