<!-- 保存页面 -->
<template>
<el-dialog title="轮播_图片信息表信息" :visible.sync="visiable" width="70%">
<el-form ref="form" :rules="rules" :model="formData" label-width="100px" label-position="right">
<el-form-item label="轮播分类:" prop="sliderType">
<el-input placeholder="轮播分类" v-model="formData.sliderType"></el-input>
</el-form-item>
<el-form-item label="图片名称:" prop="picName">
<el-input placeholder="图片名称" v-model="formData.picName"></el-input>
</el-form-item>
<el-form-item label="图片地址:" prop="picAddress">
<el-input placeholder="图片地址" v-model="formData.picAddress"></el-input>
</el-form-item>
<el-form-item label="图片简述:" prop="picAbstract">
<el-input placeholder="图片简述" v-model="formData.picAbstract"></el-input>
</el-form-item>
<el-form-item label="图片顺序:" prop="picOrder">
<el-input placeholder="图片顺序" v-model="formData.picOrder"></el-input>
</el-form-item>
<el-form-item label="是否链接:" prop="whetherLink">
<el-select v-model="formData.whetherLink" placeholder="请选择活动区域">
<el-option label="是" value="是"></el-option>
<el-option label="否" value="否"></el-option>
</el-select>
</el-form-item>
<el-form-item label="链接地址:" prop="linkAddress">
<el-input placeholder="链接地址" v-model="formData.linkAddress"></el-input>
</el-form-item>
<el-form-item label="创建人ID:" prop="createUserId">
<el-input placeholder="创建人ID" v-model="formData.createUserId"></el-input>
</el-form-item>
<el-form-item label="创建人:" prop="createUserName">
<el-input placeholder="创建人" v-model="formData.createUserName"></el-input>
</el-form-item>
<el-form-item label="创建时间:" prop="createTime">
<div class="block">
<span class="demonstration">默认</span>
<el-date-picker v-model="formData.createTime" type="datetime" placeholder="选择日期时间"></el-date-picker>
</div>
</el-form-item>
<el-form-item prop="picState">
<el-input v-model="formData.picState"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button round @click="visiable = false">取消</el-button>
<el-button round type="primary" @click="saveInfo('form')">保存</el-button>
</span>
</el-dialog>
</template>
<script>
import fetch from "@/utils/fetch.js";
import { Message } from "element-ui";
export default {
data() {
return {
rules: {
picName: [
{ required: true, message: "请输入图片名称", trigger: "blur" },
{ min: 1, max: 12, message: "长度在 1 到 12 个字符", trigger: "blur" }
],
picAddress: [
{ required: true, message: "请输入图片地址", trigger: "blur" },
{ min: 1, max: 20, message: "长度在 1 到 20 个字符", trigger: "blur" }
],
picAbstract: [
{ required: true, message: "请输入图片简述", trigger: "blur" },
{ min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" }
],
picOrder: [
{ required: true, message: "请设置图片顺序", trigger: "blur" },
{ min: 1, max: 10, message: "长度在 1 到 10 个字符", trigger: "blur" }
],
createUserId: [
{ required: true, message: "请输入创建人ID", trigger: "blur" },
{ min: 1, max: 11, message: "长度在 1 到 11 个字符", trigger: "blur" }
],
createUserName: [
{ required: true, message: "请输入创建人名字", trigger: "blur" },
{ min: 1, max: 20, message: "长度在 1 到 20 个字符", trigger: "blur" }
],
createTime: [
{ required: true, message: "请选择创建时间", trigger: "blur" },
{ min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" }
]
},
pickerOptions: {
shortcuts: [
{
text: "今天",
onClick(picker) {
picker.$emit("pick", new Date());
}
},
{
text: "昨天",
onClick(picker) {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24);
picker.$emit("pick", date);
}
},
{
text: "一周前",
onClick(picker) {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
picker.$emit("pick", date);
}
}
]
},
picState: "",
sliderType: "",
picName: "",
picAddress: "",
picState: "1",
picAbstract: "",
picOrder: "",
whetherLink: "",
linkAddress: "",
createUserId: "",
createUserName: "",
createTime: "",
visiable: false,
formData: {},
rules: {}
};
},
methods: {
// 初始化
init() {
this.visiable = !this.visiable;
if (r != null) {
// 编辑
this.formData = JSON.parse(JSON.stringify(r));
} else {
// 新增
if (JSON.stringify(this.formData) != "{}") {
this.formData = {};
this.$refs.form.resetFields();
}
}
},
// 保存信息
saveInfo(formName) {
this.formData.picState = 1;
this.$refs[formName].validate(valid => {
if (valid) {
fetch
.post("/api/assliderinfo/save", this.formData)
.then(res => {
if (res.code == "0") {
Message({
message: res.msg,
type: "success",
duration: 3 * 1000
});
this.$refs[formName].resetFields();
this.formData = {};
this.visiable = false;
this.$emit("loadData");
} else {
Message({
message: res.msg,
type: "error",
duration: 3 * 1000
});
}
})
.catch(error => {
console.log(error);
});
}
});
}
}
};
</script>
<style scoped>
</style>
