279 lines
6.9 KiB
Vue
279 lines
6.9 KiB
Vue
<template>
|
|
<!-- 勤务作息编辑新增 -->
|
|
<div class="dialog" v-if="isShowDialog">
|
|
<div class="head_box">
|
|
<span class="title">{{ isAdd ? "新增" : "修改" }}</span>
|
|
<div>
|
|
<el-button
|
|
type="primary"
|
|
size="small"
|
|
@click="onSave"
|
|
:loading="buttonLoading"
|
|
>保存</el-button
|
|
>
|
|
<el-button size="small" @click="closeDialog">关闭</el-button>
|
|
</div>
|
|
</div>
|
|
<div class="form-content">
|
|
<el-form
|
|
ref="formRef"
|
|
:label-width="140"
|
|
:model="formData"
|
|
:rules="rules"
|
|
inline
|
|
>
|
|
<div class="content">
|
|
<el-form-item
|
|
v-if="isAdd"
|
|
style="width: 48%"
|
|
class="form-item"
|
|
prop="dqwd"
|
|
label="地球经度"
|
|
>
|
|
<el-input
|
|
type="number"
|
|
v-model="formData.dqwd"
|
|
:disabled="isDetail"
|
|
placeholder="请输入地球经度"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item
|
|
v-if="isAdd"
|
|
style="width: 48%"
|
|
class="form-item"
|
|
prop="dqjd"
|
|
label="地球纬度"
|
|
>
|
|
<el-input
|
|
type="number"
|
|
v-model="formData.dqjd"
|
|
:disabled="isDetail"
|
|
placeholder="请输入地球纬度"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item
|
|
style="width: 48%"
|
|
class="form-item"
|
|
prop="qzDd"
|
|
label="签注地点"
|
|
>
|
|
<el-input
|
|
v-model="formData.qzDd"
|
|
:disabled="!isAdd"
|
|
placeholder="请输入签注地点"
|
|
></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item
|
|
style="width: 48%"
|
|
class="form-item"
|
|
prop="qzSm"
|
|
label="签注说明"
|
|
>
|
|
<el-input
|
|
v-model="formData.qzSm"
|
|
:disabled="isDetail"
|
|
placeholder="请输入签注说明"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item
|
|
v-if="isDetail"
|
|
style="width: 48%"
|
|
class="form-item"
|
|
prop="qzrSfzh"
|
|
label="签注人身份证号"
|
|
>
|
|
<el-input
|
|
v-model="formData.qzrSfzh"
|
|
disabled
|
|
placeholder="请输入"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item
|
|
v-if="isDetail"
|
|
style="width: 48%"
|
|
class="form-item"
|
|
prop="qzrXm"
|
|
label="签注人姓名"
|
|
>
|
|
<el-input
|
|
v-model="formData.qzrXm"
|
|
disabled
|
|
placeholder="请输入"
|
|
></el-input>
|
|
</el-form-item>
|
|
</div>
|
|
</el-form>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { serviceGet, servicePost } from "@/api/serviceApi.js";
|
|
import { reactive, ref, getCurrentInstance, defineEmits } from "vue";
|
|
import * as MOSTY from "@/components/MyComponents/index";
|
|
import * as rule from "@/utils/rules.js";
|
|
// import Department from "./department.vue";
|
|
|
|
const { proxy } = getCurrentInstance();
|
|
// const { D_BZ_SF} = proxy.$dict("D_BZ_SF");
|
|
const props = defineProps({
|
|
// dic: Object
|
|
});
|
|
|
|
const emits = defineEmits(["updateList"]);
|
|
const loading = ref(false); // 加载
|
|
const formRef = ref(); // 表单验证
|
|
const formDataDefault = ref({});
|
|
const formData = ref({});
|
|
|
|
const isAdd = ref(false); // 是否是新增状态
|
|
const isShowDialog = ref(false); //弹窗
|
|
const dialogType = ref(0); // add 新增 edit编辑 detail详情
|
|
const isDetail = ref(false);
|
|
const rules = reactive({
|
|
dqjd: [{ required: false, message: "请填写地球纬度", trigger: "blur" }],
|
|
dqwd: [{ required: false, message: "请填写地球经度", trigger: "blur" }],
|
|
|
|
qzDd: [{ required: true, message: "请输入签注地点", trigger: "blur" }],
|
|
qzSm: [{ message: "请输入签注说明", trigger: "blur" }]
|
|
|
|
// qzrSfzh: [{ required: true, message: "请输入签注人身份证号", trigger: "blur" }],
|
|
// qzrXm: [{ required: true, message: "请输入签注人姓名", trigger: "blur" }]
|
|
});
|
|
/**部门id对照对象 */
|
|
let departmentIdObj = {};
|
|
const init = (type, row) => {
|
|
isShowDialog.value = true; // 显示新增编辑dialog框
|
|
isAdd.value = type == "add" ? true : false;
|
|
dialogType.value = type;
|
|
isDetail.value = type === "detail";
|
|
// 是否有填充数据
|
|
departmentIdObj = {};
|
|
if (row) {
|
|
|
|
let {
|
|
id,
|
|
dqjd,
|
|
dqwd,
|
|
qzDd,
|
|
|
|
qzSm,
|
|
qzrSfzh,
|
|
qzrXm
|
|
} = row;
|
|
// 新增从本地取
|
|
if (type == "add") {
|
|
qzrSfzh = localStorage.getItem("idEntityCard"); // 身份证
|
|
qzrXm = localStorage.getItem("USERNAME"); //姓名
|
|
}
|
|
formData.value = {
|
|
id,
|
|
dqwd,
|
|
dqjd,
|
|
qzDd,
|
|
|
|
qzSm,
|
|
qzrSfzh,
|
|
qzrXm
|
|
};
|
|
// 新增
|
|
} else {
|
|
}
|
|
};
|
|
|
|
// 重置表单
|
|
const reserForm = () => {
|
|
formData.value = JSON.parse(JSON.stringify(formDataDefault.value));
|
|
};
|
|
// 关闭弹窗
|
|
const closeDialog = () => {
|
|
isShowDialog.value = false;
|
|
loading.value = false;
|
|
formData.value = JSON.parse(JSON.stringify(formDataDefault.value));
|
|
};
|
|
// 保存
|
|
const onSave = () => {
|
|
formRef.value.validate((valid) => {
|
|
if (!valid) return;
|
|
loading.value = true;
|
|
let params = { ...formData.value };
|
|
params.qzrSfzh = localStorage.getItem("idEntityCard"); // 身份证
|
|
params.qzrXm = localStorage.getItem("USERNAME"); // 姓名
|
|
if (params.dqjd) params.dqjd = Number(params.dqjd);
|
|
if (params.dqwd) params.dqwd = Number(params.dqwd);
|
|
|
|
let url = isAdd.value ? "/tbQwglZxqz/save" : "/tbQwglZxqz/update";
|
|
let text = isAdd.value ? "新增成功" : "编辑成功";
|
|
servicePost(params, `/mosty-qwzx${url}`)
|
|
.then((res) => {
|
|
closeDialog();
|
|
proxy.$message.success(text);
|
|
emits("updateList", {});
|
|
})
|
|
.catch(() => {
|
|
loading.value = false;
|
|
});
|
|
});
|
|
};
|
|
defineExpose({ init });
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "~@/assets/css/layout.scss";
|
|
@import "~@/assets/css/element-plus.scss";
|
|
|
|
.form-content {
|
|
margin-top: 20px;
|
|
}
|
|
.bblxItem {
|
|
line-height: 40px;
|
|
min-height: 40px;
|
|
// display: flex;
|
|
.btItem {
|
|
width: 180px;
|
|
padding: 7px 0;
|
|
background: #e9e9e9;
|
|
color: #000;
|
|
margin-top: 1px;
|
|
text-align: center;
|
|
}
|
|
.info {
|
|
flex: 1;
|
|
background: #f2f2f2;
|
|
margin-top: 1px;
|
|
padding: 10px;
|
|
box-sizing: border-box;
|
|
}
|
|
.subBtn {
|
|
padding-left: 100px;
|
|
box-sizing: border-box;
|
|
}
|
|
}
|
|
.content {
|
|
padding: 10px 40px;
|
|
}
|
|
.dialog {
|
|
&::v-deep .el-form--inline {
|
|
padding: 0 !important;
|
|
}
|
|
&::v-deep .el-input__inner {
|
|
border: 1px solid #d5d2d2;
|
|
}
|
|
|
|
}
|
|
.dialog .el-form-item--default.form-item {
|
|
width: calc(50% - 100px);
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.department-list {
|
|
padding: 10px 20px;
|
|
}
|
|
.department-item {
|
|
color: #000;
|
|
margin-left: 20px;
|
|
height: 35px;
|
|
line-height: 35px;
|
|
}
|
|
</style> |