|
@ -1,22 +1,22 @@ |
|
|
<template> |
|
|
<template> |
|
|
<div> |
|
|
<div> |
|
|
<el-form ref="form" :model="form" label-width="80px"> |
|
|
|
|
|
|
|
|
<el-form :model="form" label-width="80px" ref="form"> |
|
|
<el-form-item label="活动名称"> |
|
|
<el-form-item label="活动名称"> |
|
|
<el-input v-model="form.name"></el-input> |
|
|
<el-input v-model="form.name"></el-input> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item> |
|
|
<el-form-item> |
|
|
<el-select label="活动区域" v-model="form.region" placeholder="请选择活动区域"> |
|
|
|
|
|
|
|
|
<el-select label="活动区域" placeholder="请选择活动区域" v-model="form.region"> |
|
|
<el-option label="上海" value="shanghai"></el-option> |
|
|
<el-option label="上海" value="shanghai"></el-option> |
|
|
<el-option label="北京" value="beijing"></el-option> |
|
|
<el-option label="北京" value="beijing"></el-option> |
|
|
</el-select> |
|
|
</el-select> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item label="活动时间"> |
|
|
<el-form-item label="活动时间"> |
|
|
<el-col :span="11"> |
|
|
<el-col :span="11"> |
|
|
<el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"></el-date-picker> |
|
|
|
|
|
|
|
|
<el-date-picker placeholder="选择日期" style="width: 100%;" type="date" v-model="form.date1"></el-date-picker> |
|
|
</el-col> |
|
|
</el-col> |
|
|
<el-col class="line" style="text-align: center" :span="2">——</el-col> |
|
|
|
|
|
|
|
|
<el-col :span="2" class="line" style="text-align: center">——</el-col> |
|
|
<el-col :span="11"> |
|
|
<el-col :span="11"> |
|
|
<el-time-picker placeholder="选择时间" v-model="form.date2" style="width: 100%;"></el-time-picker> |
|
|
|
|
|
|
|
|
<el-time-picker placeholder="选择时间" style="width: 100%;" v-model="form.date2"></el-time-picker> |
|
|
</el-col> |
|
|
</el-col> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item label="即时配送"> |
|
|
<el-form-item label="即时配送"> |
|
@ -41,15 +41,15 @@ |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item label="穿梭框"> |
|
|
<el-form-item label="穿梭框"> |
|
|
<el-transfer |
|
|
<el-transfer |
|
|
filterable |
|
|
|
|
|
|
|
|
:data="data" |
|
|
:filter-method="filterMethod" |
|
|
:filter-method="filterMethod" |
|
|
filter-placeholder="请输入城市拼音" |
|
|
filter-placeholder="请输入城市拼音" |
|
|
|
|
|
filterable |
|
|
v-model="value" |
|
|
v-model="value" |
|
|
:data="data"> |
|
|
|
|
|
</el-transfer> |
|
|
|
|
|
|
|
|
></el-transfer> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item> |
|
|
<el-form-item> |
|
|
<el-button type="primary" @click="onSubmit">立即创建</el-button> |
|
|
|
|
|
|
|
|
<el-button @click="onSubmit" type="primary">立即创建</el-button> |
|
|
<el-button>取消</el-button> |
|
|
<el-button>取消</el-button> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
</el-form> |
|
|
</el-form> |
|
@ -57,21 +57,28 @@ |
|
|
</template> |
|
|
</template> |
|
|
<script> |
|
|
<script> |
|
|
export default { |
|
|
export default { |
|
|
|
|
|
|
|
|
data() { |
|
|
data() { |
|
|
const generateData = () => { |
|
|
const generateData = () => { |
|
|
const data = []; |
|
|
|
|
|
const cities = ['上海', '北京', '广州', '深圳', '南京', '西安', '成都']; |
|
|
|
|
|
const pinyin = ['shanghai', 'beijing', 'guangzhou', 'shenzhen', 'nanjing', 'xian', 'chengdu']; |
|
|
|
|
|
|
|
|
const data = [] |
|
|
|
|
|
const cities = ['上海', '北京', '广州', '深圳', '南京', '西安', '成都'] |
|
|
|
|
|
const pinyin = [ |
|
|
|
|
|
'shanghai', |
|
|
|
|
|
'beijing', |
|
|
|
|
|
'guangzhou', |
|
|
|
|
|
'shenzhen', |
|
|
|
|
|
'nanjing', |
|
|
|
|
|
'xian', |
|
|
|
|
|
'chengdu' |
|
|
|
|
|
] |
|
|
cities.forEach((city, index) => { |
|
|
cities.forEach((city, index) => { |
|
|
data.push({ |
|
|
data.push({ |
|
|
label: city, |
|
|
label: city, |
|
|
key: index, |
|
|
key: index, |
|
|
pinyin: pinyin[index] |
|
|
pinyin: pinyin[index] |
|
|
}); |
|
|
|
|
|
}); |
|
|
|
|
|
return data; |
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
}) |
|
|
|
|
|
}) |
|
|
|
|
|
return data |
|
|
|
|
|
} |
|
|
return { |
|
|
return { |
|
|
form: { |
|
|
form: { |
|
|
name: '', |
|
|
name: '', |
|
@ -85,19 +92,19 @@ export default { |
|
|
}, |
|
|
}, |
|
|
data: generateData(), |
|
|
data: generateData(), |
|
|
value: [], |
|
|
value: [], |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
methods: { |
|
|
filterMethod(query, item) { |
|
|
filterMethod(query, item) { |
|
|
return item.pinyin.indexOf(query) > -1; |
|
|
|
|
|
|
|
|
return item.pinyin.indexOf(query) > -1 |
|
|
}, |
|
|
}, |
|
|
methods : { |
|
|
|
|
|
onSubmit() { |
|
|
onSubmit() { |
|
|
this.$message({ |
|
|
this.$message({ |
|
|
message: '创建成功', |
|
|
message: '创建成功', |
|
|
type: 'success' |
|
|
type: 'success' |
|
|
}); |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
}) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
</script> |
|
|
</script> |