parent
385ae1a154
commit
158dba5e1b
@ -0,0 +1,230 @@
|
|||||||
|
<template>
|
||||||
|
<el-dialog
|
||||||
|
:title="title"
|
||||||
|
:visible.sync="open"
|
||||||
|
append-to-body
|
||||||
|
fullscreen
|
||||||
|
center
|
||||||
|
>
|
||||||
|
<el-form
|
||||||
|
:model="ruleForm"
|
||||||
|
:rules="rules"
|
||||||
|
ref="ruleForm"
|
||||||
|
label-width="170px"
|
||||||
|
label-position="right"
|
||||||
|
:disabled="disabled"
|
||||||
|
>
|
||||||
|
<form-title title="基本信息"></form-title>
|
||||||
|
|
||||||
|
<div class="grid-container">
|
||||||
|
<el-form-item
|
||||||
|
:label="item.label"
|
||||||
|
v-for="(item, index) in list"
|
||||||
|
:key="index"
|
||||||
|
:prop="item.prop"
|
||||||
|
:class="item.type == 'textarea' ? 'full-width' : ''"
|
||||||
|
>
|
||||||
|
<el-select
|
||||||
|
v-if="item.type == 'autocomplete'"
|
||||||
|
v-model="ruleForm[item.key]"
|
||||||
|
filterable
|
||||||
|
remote
|
||||||
|
placeholder="请输入关键词"
|
||||||
|
:remote-method="remoteMethod"
|
||||||
|
:loading="loading"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in options"
|
||||||
|
:key="item.id"
|
||||||
|
:label="item.nickName"
|
||||||
|
:value="item.nickName"
|
||||||
|
>
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
|
||||||
|
<!-- 输入框 -->
|
||||||
|
<el-input
|
||||||
|
v-if="item.type == 'input'"
|
||||||
|
v-model="ruleForm[item.key]"
|
||||||
|
:placeholder="'请输入' + item.label"
|
||||||
|
></el-input>
|
||||||
|
<!-- 选择框 -->
|
||||||
|
<el-select
|
||||||
|
v-if="item.type == 'select'"
|
||||||
|
v-model="ruleForm[item.key]"
|
||||||
|
:placeholder="'请选择' + item.label"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="dict in dict.type[item.dict]"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
<!-- 日期框 -->
|
||||||
|
<el-date-picker
|
||||||
|
v-if="item.type == 'date'"
|
||||||
|
v-model="ruleForm[item.key]"
|
||||||
|
type="date"
|
||||||
|
format="yyyy-MM-dd"
|
||||||
|
value-format="yyyy-MM-dd"
|
||||||
|
placeholder="选择日期"
|
||||||
|
>
|
||||||
|
</el-date-picker>
|
||||||
|
<!-- 多行文本框 -->
|
||||||
|
<el-input
|
||||||
|
v-if="item.type == 'textarea'"
|
||||||
|
type="textarea"
|
||||||
|
resize="none"
|
||||||
|
placeholder="请输入系统简介"
|
||||||
|
:rows="5"
|
||||||
|
v-model="ruleForm[item.key]"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</div>
|
||||||
|
</el-form>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="open = false" size="medium">返 回</el-button>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
size="medium"
|
||||||
|
@click="submit()"
|
||||||
|
v-show="!disabled"
|
||||||
|
>确 定</el-button
|
||||||
|
>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
assetMiniPrograms,
|
||||||
|
miniProgramsInfo,
|
||||||
|
unitAllList,
|
||||||
|
} from "@/api/auditPagesApi/index";
|
||||||
|
import { formData, formRules } from "./programDialog.js";
|
||||||
|
import formTitle from "../formTitle.vue";
|
||||||
|
import { checkRole } from "@/utils/permission"; // 权限判断函数
|
||||||
|
export default {
|
||||||
|
dicts: [
|
||||||
|
"app_xzqh",
|
||||||
|
"app_sshy",
|
||||||
|
"app_zdhy",
|
||||||
|
"gzh_state",
|
||||||
|
"gzh_rzzt",
|
||||||
|
"gzh_rzlx",
|
||||||
|
"email_state",
|
||||||
|
],
|
||||||
|
components: { formTitle },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
loading: false,
|
||||||
|
options: [],
|
||||||
|
list: formData,
|
||||||
|
title: "",
|
||||||
|
open: false,
|
||||||
|
ruleForm: {},
|
||||||
|
rules: formRules,
|
||||||
|
disabled: false,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.remoteMethod();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/** 打开对话框 */
|
||||||
|
openDialog(id, disabled) {
|
||||||
|
if (!id) {
|
||||||
|
this.title = "新增小程序资产";
|
||||||
|
this.open = true;
|
||||||
|
this.resetForm("ruleForm");
|
||||||
|
} else {
|
||||||
|
this.getInfo(id);
|
||||||
|
this.disabled = disabled;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
/**详情 */
|
||||||
|
async getInfo(id) {
|
||||||
|
let res = await miniProgramsInfo(id);
|
||||||
|
this.title = "修改小程序资产";
|
||||||
|
this.open = true;
|
||||||
|
this.resetForm("ruleForm");
|
||||||
|
this.ruleForm = res.data;
|
||||||
|
},
|
||||||
|
|
||||||
|
/**单位名称模糊查询 */
|
||||||
|
async remoteMethod(query) {
|
||||||
|
let res = await unitAllList({ nickName: query });
|
||||||
|
this.options = res.data;
|
||||||
|
if (this.options.length == 0) {
|
||||||
|
this.ruleForm.ssdw = "";
|
||||||
|
this.$message.error("请输入正确的企业");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
/**提交 */
|
||||||
|
submit() {
|
||||||
|
let isUnit = checkRole(["unit"]);
|
||||||
|
const portion = ["ssdw", "xcxmc"];
|
||||||
|
let index = 0;
|
||||||
|
if (isUnit) {
|
||||||
|
// 全部校验
|
||||||
|
this.$refs["ruleForm"].validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
this.submitFu();
|
||||||
|
} else {
|
||||||
|
console.log("error submit!!");
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
//部分校验
|
||||||
|
this.$refs["ruleForm"].validateField(portion, (errors) => {
|
||||||
|
if (errors) {
|
||||||
|
console.log("部分字段验证失败:", errors);
|
||||||
|
} else {
|
||||||
|
index++;
|
||||||
|
if (index == portion.length) {
|
||||||
|
this.submitFu();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async submitFu() {
|
||||||
|
this.loading = true;
|
||||||
|
if (this.ruleForm.id != null) {
|
||||||
|
await assetMiniPrograms("put", this.ruleForm);
|
||||||
|
this.$modal.msgSuccess("修改成功");
|
||||||
|
} else {
|
||||||
|
await assetMiniPrograms("post", this.ruleForm);
|
||||||
|
this.$modal.msgSuccess("新增成功");
|
||||||
|
}
|
||||||
|
this.loading = false;
|
||||||
|
this.open = false;
|
||||||
|
this.$emit("finish");
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.grid-container {
|
||||||
|
display: grid;
|
||||||
|
/* 设置网格布局为一行两列 */
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
/* 定义强制占一行的类样式 */
|
||||||
|
.full-width {
|
||||||
|
/* 让元素跨越两列，从而占满一行 */
|
||||||
|
grid-column: span 2;
|
||||||
|
}
|
||||||
|
::v-deep .el-select,
|
||||||
|
.el-cascader,
|
||||||
|
.el-date-editor,
|
||||||
|
.el-autocomplete {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in new issue