活动编辑增加题目分类选择
This commit is contained in:
parent
c44d2dc281
commit
88faf302e8
@ -1,5 +1,7 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
|
||||
<el-form
|
||||
ref="postForm"
|
||||
:model="postForm"
|
||||
@ -7,6 +9,8 @@
|
||||
label-width="121px"
|
||||
class="form-container"
|
||||
>
|
||||
<el-tabs v-model="activeName">
|
||||
<el-tab-pane label="基本信息" name="first">
|
||||
<el-form-item label="店铺" prop="key">
|
||||
<el-select
|
||||
v-model="postForm.shop"
|
||||
@ -190,7 +194,39 @@
|
||||
required
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="题库设置" name="second">
|
||||
<el-form-item
|
||||
label="题目数量:"
|
||||
prop="qcount"
|
||||
>
|
||||
<el-input
|
||||
v-model="postForm.qcount"
|
||||
placeholder="本次活动题目数量"
|
||||
name="qcount"
|
||||
type="number"
|
||||
required
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
label="题库分类"
|
||||
>
|
||||
<el-tree
|
||||
:data="typeOptions"
|
||||
show-checkbox
|
||||
accordion
|
||||
node-key="id"
|
||||
ref="tree"
|
||||
highlight-current
|
||||
:default-checked-keys="typeSelected"
|
||||
:props="defaultProps">
|
||||
</el-tree>
|
||||
|
||||
</el-form-item>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="奖励设置" name="third">
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
type="primary"
|
||||
@ -203,11 +239,13 @@
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator'
|
||||
import { Component, Vue, Watch } from 'vue-property-decorator'
|
||||
import { AppModule } from '@/store/modules/app'
|
||||
import { ITagView, TagsViewModule } from '@/store/modules/tags-view'
|
||||
import MaterialInput from '@/components/MaterialInput/index.vue'
|
||||
@ -219,6 +257,7 @@ import Tinymce from '@/components/Tinymce/index.vue'
|
||||
import { getShops } from '@/api/shop'
|
||||
import { defaultActivityData, getActivity, saveActivity } from '@/api/activity'
|
||||
import { sec2TimeStr, timeStr2Sec } from '@/utils'
|
||||
import { getAllCategory } from '@/api/question'
|
||||
|
||||
@Component({
|
||||
name: 'ActivityEditor',
|
||||
@ -250,13 +289,14 @@ export default class extends Vue {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
private activeName = 'first'
|
||||
private monthDays = []
|
||||
private repeatTypes = [
|
||||
{ id: 0, label: '指定日期' },
|
||||
{ id: 1, label: '每日' },
|
||||
{ id: 2, label: '每周' },
|
||||
{ id: 3, label: '每月' },
|
||||
{id: 9, label: '随时(一般测试用)'},
|
||||
{ id: 9, label: '随时(一般测试用)' }
|
||||
]
|
||||
private weekDays = [
|
||||
{ id: 0, label: '周日' },
|
||||
@ -265,7 +305,7 @@ export default class extends Vue {
|
||||
{ id: 3, label: '周三' },
|
||||
{ id: 4, label: '周四' },
|
||||
{ id: 5, label: '周五' },
|
||||
{id: 6, label: '周六'},
|
||||
{ id: 6, label: '周六' }
|
||||
]
|
||||
private dataRange: Date[] = []
|
||||
private selectDate: Date[] = []
|
||||
@ -274,12 +314,16 @@ export default class extends Vue {
|
||||
|
||||
private postForm = Object.assign({}, defaultActivityData)
|
||||
private loading = false
|
||||
private querying = false
|
||||
private allDepts = []
|
||||
|
||||
private typeOptions: {id: string, label: string, children?: any[]}[] = []
|
||||
private typeSelected = []
|
||||
private defaultProps = {
|
||||
children: 'children',
|
||||
label: 'label'
|
||||
}
|
||||
|
||||
private rules = {
|
||||
name: [{ validator: this.validateRequire }],
|
||||
name: [{ validator: this.validateRequire }]
|
||||
}
|
||||
|
||||
private tempTagView?: ITagView
|
||||
@ -290,14 +334,15 @@ export default class extends Vue {
|
||||
}
|
||||
|
||||
|
||||
created() {
|
||||
async created() {
|
||||
this.initTimes()
|
||||
const id = this.$route.params?.id
|
||||
await this.getRemoteCategory()
|
||||
await this.getRemoteDeptList()
|
||||
if (id) {
|
||||
this.fetchData(id)
|
||||
await this.fetchData(id)
|
||||
}
|
||||
this.tempTagView = Object.assign({}, this.$route)
|
||||
this.getRemoteDeptList()
|
||||
}
|
||||
|
||||
deactivated() {
|
||||
@ -327,6 +372,7 @@ export default class extends Vue {
|
||||
this.dataRange.push(new Date(data.beginDay))
|
||||
this.dataRange.push(new Date(data.endDay))
|
||||
}
|
||||
|
||||
// Just for test
|
||||
const title = this.lang === 'zh' ? '编辑活动' : 'Edit Activity'
|
||||
// Set tagsview title
|
||||
@ -367,6 +413,7 @@ export default class extends Vue {
|
||||
this.postForm.beginDay = this.dataRange[0].getTime()
|
||||
this.postForm.endDay = this.dataRange[1].getTime()
|
||||
}
|
||||
this.postForm.qtypes = this.$refs.tree.getCheckedKeys()
|
||||
this.loading = true
|
||||
const { data } = await saveActivity(this.postForm)
|
||||
this.postForm = data
|
||||
@ -382,6 +429,7 @@ export default class extends Vue {
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
private async onCancel() {
|
||||
try {
|
||||
await this.$confirm('确认不保存当前活动信息?', 'Warning', {
|
||||
@ -389,18 +437,20 @@ export default class extends Vue {
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
this.$store.dispatch("delView", this.$route)
|
||||
this.$store.dispatch('delView', this.$route)
|
||||
this.$router.go(-1)
|
||||
} catch (e) {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
private async getRemoteDeptList() {
|
||||
const { data } = await getShops({})
|
||||
if (!data.records) return
|
||||
this.allDepts = data.records
|
||||
}
|
||||
|
||||
private dataChange(val: any) {
|
||||
console.log(this.selectDate)
|
||||
}
|
||||
@ -418,6 +468,7 @@ export default class extends Vue {
|
||||
this.monthDays.push({ id: i, label: i })
|
||||
}
|
||||
}
|
||||
|
||||
private timeChange(vals: string[]) {
|
||||
if (vals.length > 0) {
|
||||
let lastVal = this.selectTime[this.selectTime.length - 1]
|
||||
@ -430,6 +481,7 @@ export default class extends Vue {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
private monthDaysChange(days: number[]) {
|
||||
if (days.indexOf(0) >= 0) {
|
||||
this.postForm.monthDays.length = 0
|
||||
@ -439,6 +491,48 @@ export default class extends Vue {
|
||||
}
|
||||
}
|
||||
|
||||
@Watch('postForm.shop')
|
||||
private onShopChange() {
|
||||
if (this.postForm.qtypes?.length > 0) {
|
||||
this.typeSelected = this.postForm.qtypes
|
||||
return
|
||||
}
|
||||
if (this.postForm.shop) {
|
||||
let currentShop
|
||||
for (let p of this.allDepts) {
|
||||
if (p._id == this.postForm.shop) {
|
||||
currentShop = p
|
||||
break
|
||||
}
|
||||
}
|
||||
if (currentShop) {
|
||||
this.typeSelected = currentShop.qtypes
|
||||
} else {
|
||||
this.typeSelected = []
|
||||
}
|
||||
this.$refs.tree.setCheckedKeys(this.typeSelected)
|
||||
}
|
||||
}
|
||||
|
||||
// begin of set puzzle types
|
||||
private async getRemoteCategory() {
|
||||
const { data } = await getAllCategory()
|
||||
for (const cat of data) {
|
||||
const subArr = []
|
||||
for (const s of cat.children) {
|
||||
subArr.push({
|
||||
id: s._id,
|
||||
label: s.name
|
||||
})
|
||||
}
|
||||
this.typeOptions.push({
|
||||
id: cat._id,
|
||||
label: cat.name,
|
||||
children: subArr
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user