dl_vue/src/views/busi/notice/component/EditForm.vue

296 lines
11 KiB
Vue
Raw Normal View History

2025-03-21 14:54:16 +08:00
<template>
<el-form ref="form" :model="form" :rules="rules" label-width="150px">
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="标题" prop="title">
<el-input v-model="form.title" placeholder="请输入标题" :disabled="isDetail" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="平台" prop="platformCode">
<el-select v-model="form.platformCode" placeholder="请选择平台" clearable :disabled="isDetail">
<el-option
v-for="data in platformList"
:key="data.code"
:label="data.title"
:value="data.code"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="截止日期" prop="endDate">
<el-date-picker clearable
v-model="form.endDate"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择截止日期"
:disabled="isDetail">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="稿费下限" prop="feeDown">
<el-input-number :precision="2" min="0" v-model="form.feeDown" placeholder="请输入稿费下限" :disabled="isDetail" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="稿费上限" prop="feeUp">
<el-input-number :precision="2" min="0" v-model="form.feeUp" placeholder="请输入稿费上限" :disabled="isDetail" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="是否需自报价" prop="isSelfPrice">
<el-select v-model="form.isSelfPrice" placeholder="请选择是否需自报价" :disabled="isDetail">
<el-option
v-for="dict in dict.type.true_or_false"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="赠品价值(元)" prop="giftPrice">
<el-input-number :precision="2" min="0" v-model="form.giftPrice" placeholder="请输入赠品价值(元)" :disabled="isDetail" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="赠品明细" prop="giftDetail">
<el-input v-model="form.giftDetail" type="textarea" placeholder="请输入内容" :disabled="isDetail" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="招募名额" prop="needNum">
<el-input-number :precision="0" :min="0" v-model="form.needNum" placeholder="请输入招募名额" :disabled="isDetail" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="是否公开品牌" prop="isShowBrand">
<el-select v-model="form.isShowBrand" placeholder="请选择是否公开品牌" :disabled="isDetail">
<el-option
v-for="dict in dict.type.true_or_false"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="品牌" prop="brand">
<el-input v-model="form.brand" placeholder="请输入品牌" :disabled="isDetail" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="地区要求" prop="region">
<el-select v-model="form.province" @change="provinceChange" placeholder="请选择省份" :disabled="isDetail">
<el-option
v-for="item in provinceList"
:key="item.name"
:label="item.name"
:value="item.name"
></el-option>
</el-select>
<el-select style="margin-top: 5px" v-model="form.city" placeholder="请选择城市" :disabled="isDetail">
<el-option
v-for="item in cityList"
:key="item.name"
:label="item.name"
:value="item.name"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="粉丝要求下限" prop="fansDown">
<el-input-number :precision="0" min="0" v-model="form.fansDown" placeholder="请输入粉丝要求下限" :disabled="isDetail" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="粉丝要求上限" prop="fansUp">
<el-input-number :precision="0" min="0" v-model="form.fansUp" placeholder="请输入粉丝要求上限" :disabled="isDetail" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="报名需符合粉丝要求" prop="isEligible">
<el-select v-model="form.isEligible" placeholder="报名是否需符合粉丝要求" :disabled="isDetail">
<el-option
v-for="dict in dict.type.true_or_false"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="内容形式" prop="pic">
<el-select v-model="form.pic" placeholder="请选择内容形式" :disabled="isDetail">
<el-option
v-for="dict in dict.type.notice_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="展示要求" prop="collect">
<el-select v-model="form.collect" placeholder="请选择展示要求" :disabled="isDetail">
<el-option
v-for="dict in dict.type.notice_collect"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="是否使用通告券" prop="isUseCoupon">
<el-select v-model="form.isUseCoupon" placeholder="请选择是否使用通告券" :disabled="isDetail">
<el-option
v-for="dict in dict.type.true_or_false"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="博主类型" prop="bloggerTypes">
<el-input v-model="form.bloggerTypes" type="textarea" placeholder="请输入内容" :disabled="isDetail" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="是否公开联系方式" prop="isShowTel">
<el-select v-model="form.isShowTel" placeholder="请选择是否公开联系方式" :disabled="isDetail">
<el-option
v-for="dict in dict.type.true_or_false"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="微信号" prop="wechat">
<el-input v-model="form.wechat" placeholder="请输入微信号" :disabled="isDetail" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="电话" prop="tel">
<el-input v-model="form.tel" placeholder="请输入电话" :disabled="isDetail" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="微信群码图片" prop="groupImage">
<image-upload :limit="1" v-model="form.groupImage" :disabled="isDetail" />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="产品图" prop="images">
<image-upload :limit="9" v-model="form.images" :disabled="isDetail" />
</el-form-item>
<el-form-item label="通告明细" prop="detail">
<Editor v-model="form.detail" style="height: 300px" placeholder="请输入内容" :read-only="isDetail" />
</el-form-item>
</el-form>
</template>
<script>
import {getRegion} from "@/api/base/util";
import {listByCode} from "@/api/base/category";
import log from "@/views/monitor/job/log.vue";
export default {
name: "Notice",
props: ['isDetail'],
dicts: ['notice_type', 'notice_collect', 'dl_approval_status', 'true_or_false'],
data() {
return {
// 表单参数
form: {},
platformList:[],
provinceList:[],
cityList:[],
// 表单校验
rules: {
title: [
{ required: true, message: "标题不能为空", trigger: "blur" }
],
platformCode: [
{ required: true, message: "平台code不能为空", trigger: "change" }
],
feeDown: [
{ required: true, message: "稿费下限不能为空", trigger: "blur" }
],
isSelfPrice: [
{ required: true, message: "是否需自报价不能为空", trigger: "change" }
],
endDate: [
{ required: true, message: "截止日期不能为空", trigger: "blur" }
],
pic: [
{ required: true, message: "图文/视频/不限不能为空", trigger: "change" }
],
collect: [
{ required: true, message: "单品/合集/不限不能为空", trigger: "change" }
],
detail: [
{ required: true, message: "通告明细不能为空", trigger: "blur" }
]
},
}
},
mounted() {
this.getPlatform()
this.getProvince()
},
methods: {
provinceChange(e){
console.log(e,276)
//在provicenList 中过滤出来 name 等于 e的
let provinceId = this.provinceList.filter(item=>{
return item.name == e
})[0].cityId
this.getCity(provinceId)
},
getProvince(){
getRegion(0).then(res=>{
this.provinceList = res.data
})
},
getCity(provinceId){
getRegion(provinceId).then(res=>{
this.cityList = res.data
})
},
getPlatform(){
listByCode({code:'dl_platform'}).then(res=>{
this.platformList = res.data
})
},
}
}
</script>