|
@@ -4,22 +4,41 @@
|
|
|
<el-form-item label="排班表名称" prop="scheduleName">
|
|
|
<el-input v-model="dataForm.scheduleName" placeholder="排班表名称"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="排班周期开始日期" prop="periodStart">
|
|
|
- <el-input v-model="dataForm.periodStart" placeholder="排班周期开始日期"></el-input>
|
|
|
+ <el-form-item label="排班开始日期" prop="periodStart">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="dataForm.periodStart"
|
|
|
+ type="date"
|
|
|
+ placeholder="选择开始日期"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ style="width: 100%;"
|
|
|
+ ></el-date-picker>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="排班周期结束日期" prop="periodEnd">
|
|
|
- <el-input v-model="dataForm.periodEnd" placeholder="排班周期结束日期"></el-input>
|
|
|
+ <el-form-item label="排班结束日期" prop="periodEnd">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="dataForm.periodEnd"
|
|
|
+ type="date"
|
|
|
+ placeholder="选择开始日期"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ style="width: 100%;"
|
|
|
+ ></el-date-picker>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="用户上传的文件路径" prop="filePath">
|
|
|
- <el-input v-model="dataForm.filePath" placeholder="用户上传的文件路径"></el-input>
|
|
|
+ <el-form-item label="上传文件" prop="filePath">
|
|
|
+ <el-upload
|
|
|
+ class="avatar-uploader"
|
|
|
+ :action="action"
|
|
|
+ :headers="headers"
|
|
|
+ :show-file-list="false"
|
|
|
+ :on-success="handleAvatarSuccess"
|
|
|
+ :before-upload="beforeAvatarUpload"
|
|
|
+ >
|
|
|
+ <img v-if="imageUrl" :src="imageUrl" class="avatar" />
|
|
|
+ <el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
|
|
|
+ </el-upload>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="是否确认" prop="status">
|
|
|
- <!-- <el-input v-model="dataForm.status" placeholder="0-待确认 1-已确认"></el-input> -->
|
|
|
- <el-radio-group v-model="dataForm.status">
|
|
|
- <el-radio label="0">待确认</el-radio>
|
|
|
- <el-radio label="1">已确认</el-radio>
|
|
|
- </el-radio-group>
|
|
|
-
|
|
|
+ <el-select v-model="dataForm.status" placeholder="是否确认">
|
|
|
+ <el-option :label="item.dictLabel" :value="item.dictValue" v-for="item in state.getDictByKey('scheduleStatus')"></el-option>
|
|
|
+ </el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="备注" prop="remark">
|
|
|
<el-input v-model="dataForm.remark" placeholder="备注"></el-input>
|
|
@@ -33,11 +52,20 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
+import app from "@/constants/app";
|
|
|
+import { getToken } from "@/utils/cache";
|
|
|
import { reactive, ref } from "vue";
|
|
|
import baseService from "@/service/baseService";
|
|
|
import { ElMessage } from "element-plus";
|
|
|
+import { Plus } from '@element-plus/icons-vue'
|
|
|
+import { parseTime } from '@/utils/ruoyi'
|
|
|
+import type { UploadProps } from 'element-plus'
|
|
|
const emit = defineEmits(["refreshDataList"]);
|
|
|
-
|
|
|
+import useView from "@/hooks/useView";
|
|
|
+const state = reactive({ ...useView({}) });
|
|
|
+const action = `${app.api}/sys/oss/upload`;
|
|
|
+const headers = {token: getToken() }
|
|
|
+const imageUrl = ref('');
|
|
|
const visible = ref(false);
|
|
|
const dataFormRef = ref();
|
|
|
|
|
@@ -53,15 +81,9 @@ const rules = ref({
|
|
|
],
|
|
|
periodEnd: [
|
|
|
{ required: true, message: '必填项不能为空', trigger: 'blur' }
|
|
|
- ],
|
|
|
- filePath: [
|
|
|
- { required: true, message: '必填项不能为空', trigger: 'blur' }
|
|
|
],
|
|
|
status: [
|
|
|
{ required: true, message: '必填项不能为空', trigger: 'blur' }
|
|
|
- ],
|
|
|
- remark: [
|
|
|
- { required: true, message: '必填项不能为空', trigger: 'blur' }
|
|
|
]
|
|
|
});
|
|
|
|
|
@@ -72,6 +94,7 @@ const init = (id?: number) => {
|
|
|
// 重置表单数据
|
|
|
if (dataFormRef.value) {
|
|
|
dataFormRef.value.resetFields();
|
|
|
+ imageUrl.value = '';
|
|
|
}
|
|
|
|
|
|
if (id) {
|
|
@@ -79,10 +102,31 @@ const init = (id?: number) => {
|
|
|
}
|
|
|
};
|
|
|
|
|
|
+const handleAvatarSuccess: UploadProps['onSuccess'] = (
|
|
|
+ response,
|
|
|
+ uploadFile
|
|
|
+) => {
|
|
|
+ if(response.code!==0) return ElMessage.error(response.msg);
|
|
|
+ imageUrl.value = response?.data?.src;
|
|
|
+}
|
|
|
+
|
|
|
+const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
|
|
|
+ if (!['image/jpeg','image/png','image/jpp'].includes(rawFile.type)) {
|
|
|
+ ElMessage.error('请上传jpg/png格式的图片!')
|
|
|
+ return false
|
|
|
+ } else if (rawFile.size / 1024 / 1024 > 10) {
|
|
|
+ ElMessage.error('图片大小不能超过10MB!')
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ return true
|
|
|
+}
|
|
|
+
|
|
|
// 获取信息
|
|
|
const getInfo = (id: number) => {
|
|
|
baseService.get("/emergency/schedule/" + id).then((res) => {
|
|
|
Object.assign(dataForm, res.data);
|
|
|
+ dataForm.status = dataForm.status + '';
|
|
|
+ imageUrl.value = dataForm.filePath;
|
|
|
});
|
|
|
};
|
|
|
|
|
@@ -92,6 +136,10 @@ const dataFormSubmitHandle = () => {
|
|
|
if (!valid) {
|
|
|
return false;
|
|
|
}
|
|
|
+ if(!imageUrl.value) return ElMessage.error('请上传图片');
|
|
|
+ dataForm.periodStart = dataForm.periodStart ? parseTime(new Date(dataForm.periodStart), '{yy}-{mm}-{dd}') : null;
|
|
|
+ dataForm.periodEnd = dataForm.periodEnd ? parseTime(new Date(dataForm.periodEnd), '{yy}-{mm}-{dd} ') : null;
|
|
|
+ dataForm.filePath = imageUrl.value;
|
|
|
(!dataForm.id ? baseService.post : baseService.put)("/emergency/schedule", dataForm).then((res) => {
|
|
|
ElMessage.success({
|
|
|
message: '成功',
|
|
@@ -109,3 +157,33 @@ defineExpose({
|
|
|
init
|
|
|
});
|
|
|
</script>
|
|
|
+<style scoped>
|
|
|
+.avatar-uploader .avatar {
|
|
|
+ width: 178px;
|
|
|
+ height: 178px;
|
|
|
+ display: block;
|
|
|
+}
|
|
|
+</style>
|
|
|
+
|
|
|
+<style>
|
|
|
+.avatar-uploader .el-upload {
|
|
|
+ border: 1px dashed var(--el-border-color);
|
|
|
+ border-radius: 6px;
|
|
|
+ cursor: pointer;
|
|
|
+ position: relative;
|
|
|
+ overflow: hidden;
|
|
|
+ transition: var(--el-transition-duration-fast);
|
|
|
+}
|
|
|
+
|
|
|
+.avatar-uploader .el-upload:hover {
|
|
|
+ border-color: var(--el-color-primary);
|
|
|
+}
|
|
|
+
|
|
|
+.el-icon.avatar-uploader-icon {
|
|
|
+ font-size: 28px;
|
|
|
+ color: #8c939d;
|
|
|
+ width: 178px;
|
|
|
+ height: 178px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+</style>
|