This commit is contained in:
王创世 2024-05-14 18:12:37 +08:00
parent 60c7f9d84d
commit aa2248b80e
3 changed files with 279 additions and 17 deletions

View File

@ -2,6 +2,12 @@
<t-card :bordered="false">
<div class="form-step-container">
<t-button @click="add">新增</t-button>
<t-tabs v-model="tabIndex" @change="tabIndexChange">
<t-tab-panel value="1" label="线下活动" :destroyOnHide="false"></t-tab-panel>
<t-tab-panel value="2" label="调查问卷" :destroyOnHide="false"></t-tab-panel>
<t-tab-panel value="3" label="公益捐赠" :destroyOnHide="false"></t-tab-panel>
<t-tab-panel value="4" label="学习培训" :destroyOnHide="false"></t-tab-panel>
</t-tabs>
<t-table
rowKey="index"
:data="list"
@ -14,13 +20,27 @@
cellEmptyContent="-"
:pagination="pagination"
>
<template #activity_image="{ row }">
<div style="text-align: center;">
<t-image
:src="$store.state.user.apiUrl+row.activity_image"
fit="contain"
:style="{ width: '120px',margin:'0 auto'}"
/>
<!-- <template #activity_image="{ row }">-->
<!-- <div style="text-align: center;">-->
<!-- <t-image-->
<!-- :src="$store.state.user.apiUrl+row.activity_image"-->
<!-- fit="contain"-->
<!-- :style="{ width: '120px',margin:'0 auto'}"-->
<!-- />-->
<!-- </div>-->
<!-- </template>-->
<template #money="{ row }">
<div v-if="row.activity_type==4">
<div v-if="row.money>0">
<span></span>
<span>{{row.money}}</span>
</div>
<div v-if="row.money==0">
<span>免费</span>
</div>
</div>
<div v-if="row.activity_type!=4">
-
</div>
</template>
<template #activity_type="{ row }">
@ -33,7 +53,12 @@
</template>
<template #select="{ row }">
<t-space size="24px">
<t-button @click="openInfo(row)">报名详情</t-button>
<t-button v-if="row.activity_type==1" @click="openInfo(row)">报名详情</t-button>
<t-button v-if="row.activity_type==2" theme="default" @click="openQuestionnairefind(row)">新增题目</t-button>
<t-button v-if="row.activity_type==2" theme="primary" @click="openQuestionnaireUpdate(row)">编辑题目</t-button>
<t-button v-if="row.activity_type==2" theme="success">查看调查</t-button>
<t-button v-if="row.activity_type==3" @click="openInfo(row)">捐赠详情</t-button>
<t-button v-if="row.activity_type==4" @click="openInfo(row)">付费详情</t-button>
<t-button theme="warning" @click="edit(row)">编辑</t-button>
<t-popconfirm content="确认删除吗" @confirm="del(row)">
<t-button theme="danger">删除</t-button>
@ -95,6 +120,9 @@
<t-option key="4" label="学习培训" value="4"/>
</t-select>
</t-form-item>
<t-form-item v-if="addForm.activity_type==4" label="付费金额" name="money">
<t-input placeholder="请输入付费金额0为免费" v-model="addForm.money"/>
</t-form-item>
<t-form-item label="活动简介" name="activity_desc">
<div style="border: 1px solid #ccc;">
<!-- 工具栏 -->
@ -136,6 +164,84 @@
</t-form-item>
</t-form>
</t-dialog>
<t-dialog header="新增题目" :visible="questionnaireMode" :onClose="onCloseMy" @confirm="onSubmitQuestionnaire"
width="45%" top="20px">
<div style="height: 600px;overflow-y: scroll;">
<t-form>
<t-card v-for="(item,index) in questionnaireData" style="margin-bottom: 10px">
<template >
<t-form-item label="类型">
<t-radio-group v-model="item.type">
<t-radio :value="1">单选题</t-radio>
<t-radio :value="2">多选题</t-radio>
<t-radio :value="3">问答题</t-radio>
</t-radio-group>
</t-form-item>
<t-form-item label="排序">
<t-input v-model="item.wight" type="number" placeholder="请输入排序"></t-input>
</t-form-item>
<t-form-item label="题目">
<t-input v-model="item.title" placeholder="请输入题目"></t-input>
</t-form-item>
<t-form-item :label="op.name" v-for="(op,opi) in item.option" v-if="item.type!=3">
<t-input v-model="op.val" placeholder="请输入选项答案"></t-input>
<t-button @click="delOptionItem(index,opi)" theme="danger" size="small" variant="base" style="margin-left: 20px">X</t-button>
</t-form-item>
<div style="text-align: center" v-if="item.type!=3">
<t-button @click="addOption(index)" theme="primary" variant="base">添加一个选项</t-button>
</div>
<div style="position:absolute;right: 20px;top: 20px">
<t-button @click="delOptionTop(index)" theme="danger" size="small" variant="base" style="margin-left: 20px">删除题目</t-button>
</div>
</template>
</t-card>
<div style="text-align: center;margin-top: 30px">
<t-button @click="addQuestionnaire()" theme="warning" variant="base">添加一个题目</t-button>
</div>
</t-form>
</div>
</t-dialog>
<t-dialog header="编辑题目" :visible="questionnaireUpdateMode" :confirmBtn="null" :onClose="onCloseMy" @confirm="onCloseMy"
width="45%" top="20px">
<div style="height: 600px;overflow-y: scroll;">
<t-form>
<t-card v-for="(item,index) in questionnaire" style="margin-bottom: 10px">
<template >
<t-form-item label="类型">
<t-radio-group v-model="item.type">
<t-radio :value="1">单选题</t-radio>
<t-radio :value="2">多选题</t-radio>
<t-radio :value="3">问答题</t-radio>
</t-radio-group>
</t-form-item>
<t-form-item label="排序">
<t-input v-model="item.wight" placeholder="请输入排序"></t-input>
</t-form-item>
<t-form-item label="题目">
<t-input v-model="item.title" placeholder="请输入题目"></t-input>
</t-form-item>
<t-form-item v-for="(op,opi) in item.option" :label="op.name" v-if="item.type!=3">
<t-input v-model="op.val" placeholder="请输入选项答案"></t-input>
<t-button @click="delUpdateOptionItem(index,opi)" theme="danger" size="small" variant="base" style="margin-left: 20px">X</t-button>
</t-form-item>
<div style="text-align: center" v-if="item.type!=3">
<t-button @click="addOption(index)" theme="primary" variant="base">添加一个选项</t-button>
</div>
<div style="position:absolute;right: 20px;top: 20px">
<t-popconfirm content="确认删除吗" @confirm="delUpdateOptionTop(index,item)">
<t-button theme="danger" size="small" variant="base" style="margin-left: 20px">删除题目</t-button>
</t-popconfirm>
</div>
<div style="text-align: center;margin-top: 20px">
<t-button theme="success" @click="updateOption(item)" variant="base">保存</t-button>
</div>
</template>
</t-card>
</t-form>
</div>
</t-dialog>
</t-card>
</template>
@ -147,9 +253,14 @@ export default {
components: {Editor, Toolbar},
data() {
return {
questionnaireData: [{
type: 1, title: '', wight:0,option: [{name: 'A', val: ""}, {name: 'B', val: ""}]
}],
tabIndex: '1',
visible: false,
infoMode: false,
addForm: {
money:'0',
activity_name: '',
activity_desc: '',
activity_image_show: [],
@ -179,10 +290,9 @@ export default {
},
list: [],
columns: [
{colKey: 'activity_name', title: '活动标题', align: 'center'},
{colKey: 'activity_type', title: '活动类别', align: 'center'},
{colKey: 'activity_desc', title: '活动简介', align: 'center'},
{colKey: 'activity_image', title: '活动图片', align: 'center'},
{colKey: 'activity_name', title: '活动标题', align: 'center',width: 200,},
{colKey: 'activity_type', title: '活动类别', width: 200, align: 'center'},
{colKey: 'money', title: '付费金额', align: 'center'},
{colKey: 'activity_start_time', title: '活动开始时间', align: 'center'},
{colKey: 'activity_end_time', title: '活动结束时间', align: 'center'},
{colKey: 'activity_location', title: '活动地点', align: 'center'},
@ -225,6 +335,10 @@ export default {
}
}
},
questionnaireMode: false,//
questionnaire: [],//
questionnaireId:0,
questionnaireUpdateMode:false,
}
},
beforeDestroy() {
@ -233,10 +347,143 @@ export default {
editor.destroy() //
},
mounted() {
//this.member_id=this.$route.query.id;
this.getList();
},
methods: {
//
delUpdateOptionTop(index,item){
console.log(item);
if(this.questionnaire.length<=1){
this.$message.error('至少保留一个题目');
return;
}
this.questionnaire.splice(index, 1);
this.$request
.post("/questionnaire/topicDel", {
id: item.id,
})
.then((res) => {
console.log(res);
if(res.code==1){
//
this.$message.success('删除成功');
}else{
this.$message.error(res.msg);
}
this.openQuestionnaireUpdate({id:item.activity_id});
})
.catch((e) => {
console.log(e);
});
},
delOptionTop(index){
if(this.questionnaireData.length<=1){
this.$message.error('至少保留一个题目');
return;
}
this.questionnaireData.splice(index, 1);
},
delUpdateOptionItem(index,opIndex){
if( this.questionnaire[index].option.length<=2){
this.$message.error('至少保留两个选项');
return;
}
this.questionnaire[index].option.splice(opIndex, 1);
this.questionnaire[index].option.forEach((item, index) => {
item.name = String.fromCharCode(65 + index);
});
},
delOptionItem(index,opIndex){
if( this.questionnaireData[index].option.length<=2){
this.$message.error('至少保留两个选项');
return;
}
this.questionnaireData[index].option.splice(opIndex, 1);
this.questionnaireData[index].option.forEach((item, index) => {
item.name = String.fromCharCode(65 + index);
});
},
updateOption(d){
var option = d.option;
console.log(option);
const transformedArray = [];
for (const key in option) {
transformedArray.push({
name: key,
val: option[key].name, // `key`1111
});
}
let jsonString = d;
this.$request
.post("/questionnaire/topicEdit", {
topic: JSON.stringify(jsonString),
id:d.id,
})
.then((res) => {
console.log(res);
if(res.code==1){
this.$message.success('保存成功');
}else{
this.$message.error(res.msg);
}
this.openQuestionnaireUpdate({id:d.activity_id});
})
.catch((e) => {
console.log(e);
});
},
addQuestionnaire() {
var newItem = {
type: 1, title: '',wight:0, option: [{name: 'A', val: ""}, {name: 'B', val: ""}]
};
this.questionnaireData.push(newItem);
},
addOption(index) {
const newItem = {
name: String.fromCharCode(65 + this.questionnaireData[index].option.length),
val: ""
};
this.questionnaireData[index].option.push(newItem);
},
onSubmitQuestionnaire(){
let jsonString = JSON.stringify(this.questionnaireData);
console.log(jsonString);
this.$request
.post("/questionnaire/topicAdd", {
activity_id: this.questionnaireId,
topic:jsonString
})
.then((res) => {
console.log(res);
if(res.code==1){
this.$message.success('添加成功');
}else{
this.$message.error(res.msg);
}
this.onCloseMy();
})
.catch((e) => {
console.log(e);
});
},
openQuestionnaireUpdate(d){
this.$request
.post("/questionnaire/questionnairefind", {
activity_id: d.id,
})
.then((res) => {
console.log(res);
this.questionnaire = res.data;
this.questionnaireUpdateMode = true;
})
.catch((e) => {
console.log(e);
});
},
openQuestionnairefind(d) {
this.questionnaireId=d.id;
this.questionnaireMode = true;
},
onCurrentChangeInfo(d) {
this.info_pagination.page = d;
this.openInfo();
@ -295,6 +542,7 @@ export default {
this.addMode = true;
this.isEdit = false;
this.addForm = {
money:0,
activity_name: '',
activity_desc: '',
activity_image_show: [],
@ -318,12 +566,18 @@ export default {
this.addForm.activity_location = d.activity_location;
this.addForm.activity_content = d.activity_content;
this.addForm.activity_type = d.activity_type;
this.addForm.money = d.money;
this.addMode = true;
this.isEdit = true;
},
tabIndexChange(d) {
console.log(d);
this.pagination.page = 1;
this.getList();
},
getList() {
this.$request
.post("/activity", {page: this.pagination.page, size: this.pagination.size})
.post("/activity", {page: this.pagination.page, size: this.pagination.size, activity_type: this.tabIndex})
.then((res) => {
console.log(res);
if (res.code == 1) {
@ -391,11 +645,19 @@ export default {
console.log(e);
});
},
onCloseMy() {
this.addMode = false;
this.infoMode = false;
}
this.questionnaireMode = false;
this.questionnaireUpdateMode=false;
},
}
}
</script>
<style>
::-webkit-scrollbar {
display: none;
}
</style>
<style src="@wangeditor/editor/dist/css/style.css"></style>

View File

@ -35,7 +35,7 @@
</template>
</t-table>
</div>
<t-dialog :header="isEdit?'编辑新闻':'新增新闻'" :visible="addMode" :onClose="onCloseMy" @confirm="onSubmit"
<t-dialog :header="isEdit?'编辑':'新增'" :visible="addMode" :onClose="onCloseMy" @confirm="onSubmit"
width="45%" top="20px">
<t-form>
<t-form-item label="轮播类型" name="type">

View File

@ -70,7 +70,7 @@ export default {
return {
formData: {
zhanghu: '',
password: '',
password: 'qinze731344.',
},
FORM_RULES: {
zhanghu: [{required: true, message: '账号必填', type: 'error'}],