|
|
@@ -28,7 +28,7 @@
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" @click="handleQuery"> 查询 </el-button>
|
|
|
<el-button style="margin-left: 10px" @click="resetQuery"> 重置 </el-button>
|
|
|
- <el-button style="margin-left: 10px" type="primary" plain @click="handleQuery"> 新增 </el-button>
|
|
|
+ <el-button style="margin-left: 10px" type="primary" plain @click="handleAdd"> 新增 </el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
@@ -50,7 +50,7 @@
|
|
|
content="编辑"
|
|
|
placement="top"
|
|
|
>
|
|
|
- <el-button type="primary" link >
|
|
|
+ <el-button type="primary" link @click="handleUpdate">
|
|
|
<img class="operation-img" src="@/assets/images/edit.png">
|
|
|
</el-button>
|
|
|
</el-tooltip>
|
|
|
@@ -82,6 +82,53 @@
|
|
|
<!-- 分页组件 -->
|
|
|
<Pagination :pageable="pageable" :handle-size-change="handleSizeChange" :handle-current-change="handleCurrentChange" />
|
|
|
</div>
|
|
|
+
|
|
|
+ <!-- 添加或修改岗位对话框 -->
|
|
|
+ <el-dialog :title="dialog.title" v-model="dialog.visible" width="800px" append-to-body>
|
|
|
+ <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
|
|
|
+ <el-form-item label="维护自动站" prop="code">
|
|
|
+ <el-select v-model="form.code" placeholder="请选择" clearable>
|
|
|
+ <el-option label="M1994" value="M1994" />
|
|
|
+ <el-option label="M1995" value="M1995" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="维护类型" prop="type">
|
|
|
+ <el-select v-model="form.type" placeholder="请选择" clearable>
|
|
|
+ <el-option label="检查" value="1" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="维护人" prop="name">
|
|
|
+ <el-input v-model="form.name" placeholder="请输入维护人" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="开始时间" prop="startTime">
|
|
|
+ <el-date-picker
|
|
|
+ style="width: 100%"
|
|
|
+ v-model="form.startTime"
|
|
|
+ type="datetime"
|
|
|
+ placeholder="请选择"
|
|
|
+ format="YYYY-MM-DD HH:mm"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="结束时间" prop="endTime">
|
|
|
+ <el-date-picker
|
|
|
+ style="width: 100%"
|
|
|
+ v-model="form.endTime"
|
|
|
+ type="datetime"
|
|
|
+ placeholder="请选择"
|
|
|
+ format="YYYY-MM-DD HH:mm"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="工作内容" prop="remark">
|
|
|
+ <el-input v-model="form.remark" type="textarea" :rows="8" placeholder="请输入内容" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <div class="dialog-footer">
|
|
|
+ <el-button @click="cancel">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="submitForm">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -158,4 +205,70 @@ const columns = reactive<ColumnProps[]>([
|
|
|
{ prop: "h", label: "维护人", width:100},
|
|
|
{ prop: "operation", label: "操作", width:150,align: 'center' }
|
|
|
]);
|
|
|
+
|
|
|
+const dialog = reactive<any>({
|
|
|
+ visible: false,
|
|
|
+ title: ''
|
|
|
+});
|
|
|
+const formRef = ref<any>();
|
|
|
+const rules = ref<any>(
|
|
|
+ {
|
|
|
+ code: [{ required: true, message: "维护自动站不能为空", trigger: "blur" }],
|
|
|
+ type: [{ required: true, message: "维护类型不能为空", trigger: "blur" }],
|
|
|
+ name: [{ required: true, message: "维护人不能为空", trigger: "blur" }],
|
|
|
+ startTime: [{ required: true, message: "开始时间不能为空", trigger: "blur" }],
|
|
|
+ endTime: [{ required: true, message: "结束时间不能为空", trigger: "blur" }],
|
|
|
+ remark: [{ required: true, message: "工作内容不能为空", trigger: "blur" }],
|
|
|
+ }
|
|
|
+);
|
|
|
+
|
|
|
+
|
|
|
+const initFormData = ref<any>(
|
|
|
+ {
|
|
|
+ code: "",
|
|
|
+ type: "",
|
|
|
+ name: "",
|
|
|
+ startTime:"",
|
|
|
+ endTime:"",
|
|
|
+ remark: ""
|
|
|
+ }
|
|
|
+);
|
|
|
+
|
|
|
+
|
|
|
+const form = ref<any>({...initFormData});
|
|
|
+
|
|
|
+/** 新增按钮操作 */
|
|
|
+const handleAdd = () => {
|
|
|
+ reset();
|
|
|
+ dialog.visible = true;
|
|
|
+ dialog.title = "添加";
|
|
|
+}
|
|
|
+
|
|
|
+/** 修改按钮操作 */
|
|
|
+const handleUpdate = async (row?: any) => {
|
|
|
+ reset();
|
|
|
+ dialog.visible = true;
|
|
|
+ dialog.title = "编辑";
|
|
|
+}
|
|
|
+
|
|
|
+/** 取消按钮 */
|
|
|
+const cancel = () => {
|
|
|
+ reset();
|
|
|
+ dialog.visible = false;
|
|
|
+}
|
|
|
+/** 表单重置 */
|
|
|
+const reset = () => {
|
|
|
+ form.value = { ...initFormData };
|
|
|
+ formRef.value?.resetFields();
|
|
|
+}
|
|
|
+
|
|
|
+/** 提交按钮 */
|
|
|
+const submitForm = () => {
|
|
|
+ formRef.value?.validate(async (valid: boolean) => {
|
|
|
+ if (valid) {
|
|
|
+ dialog.visible = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
</script>
|
cxs
