<template>
|
<GlobalWindow :title="param.id ? '编辑套餐' : '新建套餐'" :visible.sync="isShowModal" :confirm-working="isLoading"
|
width="1000px" @close="close" @confirm="confirm">
|
<el-form :model="param" label-width="100px" ref="form" :rules="rules">
|
<div class="form_title">基本信息</div>
|
<el-form-item label="套餐名称" prop="name">
|
<el-input class="w200" v-model="param.name" placeholder="请输入套餐名称" v-trim />
|
</el-form-item>
|
<el-form-item label="类型">
|
<el-select class="w200" :disabled="true" v-model="param.warehouseId">
|
<el-option label="期限卡" :value="0"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="每日骑行限制">
|
<div>
|
<el-radio v-model="param.aa" label="1">不限制</el-radio>
|
<el-radio v-model="param.aa" label="2">限制时长</el-radio>
|
</div>
|
</el-form-item>
|
<el-form-item label="销售价">
|
<el-input class="w200" v-model="param.name" placeholder="请输入价格" v-trim />
|
</el-form-item>
|
<el-form-item label="划线价">
|
<el-input class="w200" v-model="param.name" placeholder="请输入展示的划线价" v-trim />
|
</el-form-item>
|
<el-form-item label="销售渠道">
|
<el-checkbox v-model="param.ada">小程序端</el-checkbox>
|
</el-form-item>
|
<el-form-item label="套餐图片">
|
<div class="df_ac">
|
<UploadAvatarImage :file="{ 'imgurlfull': param.fileFullUrl, 'imgurl': param.fileUrl }"
|
:uploadData="{ folder: 'ywPatrol/' }" @uploadSuccess="uploadAvatarSuccess" @uploadEnd="isUploading = false"
|
@uploadBegin="isUploading = true" />
|
<div class="img_place">
|
<div>上传图片不允许涉及政治敏感与色情;</div>
|
<div>图片格式必须为：png,PNG,jpeg,jpg,JPG；不可大于2M；建议使用</div>
|
<div>ng格式图片，以保持最佳效果；建议图片尺寸为144px*144px</div>
|
</div>
|
</div>
|
</el-form-item>
|
<el-form-item label="套餐简介">
|
<el-input class="w400" v-model="param.name" placeholder="请输入套餐简介" v-trim />
|
</el-form-item>
|
<el-form-item label="套餐描述">
|
<RichEditor :content="{ content: param.content }" @edit="param.content = $event"></RichEditor>
|
</el-form-item>
|
<div class="form_title">
|
<div>适用规则</div>
|
<div class="placeholder9">销售时间、使用时间等设置</div>
|
</div>
|
<el-form-item label="销售时段">
|
<el-date-picker class="w400" v-model="param.value1" value-format="yyyy-MM-dd" type="daterange" range-separator=" ~ " />
|
</el-form-item>
|
<div class="df_ac">
|
<el-form-item label="使用时间" class="mr16">
|
<el-select v-model="param.aaadd" style="width: 140px;">
|
<el-option label="固定日期" :value="0"></el-option>
|
<el-option label="购买后生效" :value="1"></el-option>
|
<el-option label="指定日期生效" :value="1"></el-option>
|
</el-select>
|
</el-form-item>
|
<!-- <el-form-item label-width="80px" label="固定日期">
|
<el-date-picker v-model="param.value1" value-format="yyyy-MM-dd" type="daterange" range-separator=" ~ " />
|
</el-form-item> -->
|
<!-- <el-form-item label-width="60px" label="有效期">
|
<el-input style="width: 130px;" v-model="param.name" placeholder="请输入有效天数" v-trim />
|
</el-form-item> -->
|
<el-form-item label-width="0px">
|
<div class="df_ac">
|
<el-date-picker class="w200" v-model="param.dasdas" value-format="yyyy-MM-dd" type="date" />
|
<span class="ml10 mr10">开始生效，有效期</span>
|
<el-input style="width: 130px;" v-model="param.name" placeholder="请输入有效天数" v-trim />
|
<span class="ml10">天</span>
|
</div>
|
</el-form-item>
|
</div>
|
<el-form-item label="适用范围">
|
<el-checkbox-group v-model="param.checkList">
|
<el-checkbox label="工作日"></el-checkbox>
|
<el-checkbox label="节假日"></el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
<el-form-item label="适用项目">
|
<el-checkbox-group v-model="param.checkList">
|
<el-checkbox label="自行车"></el-checkbox>
|
<el-checkbox label="电动车"></el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
<el-form-item label="总限额">
|
<el-input class="w400" v-model="param.name" placeholder="请输入总发售数量" v-trim />
|
<div class="placeholder9">请输入总发售数量，销量大于该数量后，不再支持销售；为空表示不限制</div>
|
</el-form-item>
|
<el-form-item label="日限额">
|
<el-input class="w400" v-model="param.name" placeholder="请输入单日发售数量" v-trim />
|
<div class="placeholder9">请输入日发售数量，当日销量大于该数量后，不再支持销售；为空表示不限制</div>
|
</el-form-item>
|
|
|
|
</el-form>
|
<!-- -->
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
// import { fetchList as getStoreList } from '@/api/ywWarehouse'
|
// import { ywOutinboundCreate } from '@/api/store/index'
|
import UploadAvatarImage from '@/components/common/UploadAvatarImage'
|
import { StoreTypeOps, rules } from './config'
|
import { Message } from 'element-ui'
|
import RichEditor from '@/components/common/RichEditor'
|
// import dayjs from 'dayjs'
|
export default {
|
name: 'OperaCategoryWindow',
|
components: { GlobalWindow, UploadAvatarImage, RichEditor },
|
data() {
|
return {
|
// 表单数据
|
param: { checkList: [], content: '' },
|
isShowModal: false,
|
isShowSel: false,
|
isLoading: false,
|
isUploading: false,
|
// 验证规则
|
rules,
|
storeList: [],
|
list: [],
|
StoreTypeOps: [],
|
|
dataList: [],
|
}
|
},
|
created() {
|
// this.initData()
|
|
},
|
methods: {
|
confirm() {
|
this.$refs['form'].validate((valid) => {
|
if (valid) {
|
const { param, list } = this
|
if (list.length == 0) return Message.warning('请先选择物料信息')
|
let count = 0 // 入库数量必填
|
list.forEach(item => {
|
if (!item.stock) count++
|
})
|
if (count > 0) return Message.warning('请输入正确的入库数量')
|
this.isLoading = true
|
ywOutinboundCreate({
|
...param,
|
recordList: list
|
}).then(res => {
|
this.isLoading = false
|
Message.success('提交成功')
|
this.$emit('success')
|
this.close()
|
}, () => {
|
this.isLoading = false
|
})
|
}
|
})
|
},
|
initData() {
|
this.$set(this.param, 'doneDate', dayjs().format('YYYY-MM-DD'))
|
getStoreList({ capacity: 9999, page: 1, model: { status: 0 } }).then(res => {
|
this.storeList = res.records || []
|
})
|
},
|
changeSel(val) {
|
const list = val
|
list.forEach(item => {
|
const index = this.list.findIndex(i => i.id == item.id)
|
if (index == -1) {
|
item.materialId = item.id
|
item.multifile = null
|
item.createDate = null
|
this.list.push(item)
|
}
|
})
|
},
|
uploadAvatarSuccess(file) {
|
this.$set(this.param, 'fileUrl', file.imgurl)
|
this.$set(this.param, 'fileFullUrl', file.imgurlfull)
|
},
|
handleOpenMaterial() {
|
this.isShowSel = true
|
this.$nextTick(() => {
|
this.$refs.AssetSelRef.isShowModal = true
|
this.$refs.AssetSelRef.getList()
|
})
|
},
|
close() {
|
this.isShowModal = false
|
this.$emit('close')
|
},
|
getDetail(id) {
|
getInfoById(id).then(res => {
|
this.param = res
|
})
|
},
|
}
|
}
|
</script>
|
<style lang="scss" scoped>
|
@import "@/assets/style/variables.scss";
|
|
.form_title {
|
display: flex;
|
align-items: center;
|
color: $primary-color;
|
margin-bottom: 16px;
|
|
.placeholder9 {
|
color: #999999;
|
font-size: 12px;
|
margin-left: 12px;
|
}
|
}
|
.img_place{
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
margin-left: 12px;
|
color: #999999;
|
font-size: 12px;
|
padding: 8px 0;
|
}
|
</style>
|
