hookehuyr

✨ feat(修改活动): 主办方,活动主题,活动封面,活动详情数据还原显示

......@@ -42,8 +42,8 @@
<script setup>
import { ref, defineProps } from 'vue'
import icon_home1 from '@/images/icon/home01@2x.png'
import Taro from '@tarojs/taro'
import { getCurrentPageParam } from "@/utils/weapp";
const props = defineProps({
// player=参与者,可报名活动。
......@@ -76,8 +76,9 @@ const goTo = (type) => {
url: '../joinList/index'
})
} else if (type === 'edit') { // 修改活动
const id = getCurrentPageParam().id;
Taro.navigateTo({
url: '../createActivity/index?type=edit'
url: '../createActivity/index?id=' + id + '&type=edit'
})
}
}
......
<!--
* @Date: 2022-09-26 21:52:25
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2022-10-18 09:52:24
* @LastEditTime: 2022-10-18 18:43:55
* @FilePath: /swx/src/components/activity-editor.vue
* @Description: 文件描述
-->
......@@ -58,10 +58,10 @@ import Taro from '@tarojs/taro'
import BASE_URL from '@/utils/config';
export default {
props: ['showTabBar', 'placeholder', 'name'],
props: ['showTabBar', 'placeholder', 'name', 'htmlContent'],
data() {
return {
editorCtx: ''
}
},
methods: {
......@@ -69,7 +69,15 @@ export default {
const that = this;
Taro.createSelectorQuery().select('#editor').context(function (res) {
that.editorCtx = res.context
}).exec()
}).exec();
// 如果有传值,还原重新编辑
if (this.htmlContent) {
setTimeout(() => {
this.editorCtx.setContents({
html: this.htmlContent
})
}, 1000);
}
},
//插入图片
_addImage: function (event) {
......
<!--
* @Date: 2022-09-26 14:36:57
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2022-10-18 17:47:13
* @LastEditTime: 2022-10-18 17:59:36
* @FilePath: /swx/src/pages/activityDetail/index.vue
* @Description: 活动详情页
-->
......
<!--
* @Date: 2022-09-21 16:04:10
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2022-10-18 13:15:36
* @LastEditTime: 2022-10-18 18:42:33
* @FilePath: /swx/src/pages/createActivity/index.vue
* @Description: 创建活动页面
-->
......@@ -31,7 +31,7 @@
<view class="divide-line"></view>
<view class="form-item">
<view class="form-item-title border">活动详情</view>
<activity-editor name="editor" :showTabBar="true" placeholder="开始输入活动详情介绍" @on-input="onEditorInput"></activity-editor>
<activity-editor name="editor" :showTabBar="true" placeholder="开始输入活动详情介绍" @on-input="onEditorInput" :htmlContent="html_content"></activity-editor>
</view>
<view class="divide-line"></view>
<view class="form-item">
......@@ -261,7 +261,7 @@
</template>
<script setup>
import { ref, onMounted, nextTick, toRefs } from "vue";
import { ref, onMounted, nextTick, getCurrentInstance } from "vue";
// import icon_home1 from '@/images/icon/home01@2x.png'
import icon_upload from '@/images/icon/upload@2x.png'
import icon_vip from '@/images/icon/vip@2x.png'
......@@ -275,6 +275,7 @@ import BASE_URL from '@/utils/config';
import Toast from '@/components/vant-weapp/toast/toast';
import { randomId } from '@/utils/tools'
import * as dayjs from 'dayjs'
import { activityInfoAPI } from '@/api/Host/index';
const activity_name = ref('');
const onChange = ({ detail }) => {
......@@ -341,12 +342,17 @@ const removeUploadImage = () => {
}
/**********************************/
onMounted(() => {
onMounted(async () => {
if (getCurrentPageParam().type === 'edit') {
// 动态修改标题
wx.setNavigationBarTitle({
title: '修改活动',
})
});
const { code, data } = await activityInfoAPI({ i: getCurrentPageParam().id });
if (code) {
// 更新活动信息
updateActivityInfo(data)
}
}
nextTick(() => {
setTimeout(() => {
......@@ -685,6 +691,28 @@ const onSubmit = async () => {
}
}
}
// 获取活动信息,还原
const html_content = ref('');
const updateActivityInfo = async ({ activity, host }) => {
// 获取主办方列表信息
const { code, data } = await hostListAPI();
if (code) {
const my_hosts = data.my_hosts;
// 主办方
org_type.value = my_hosts.filter(item => item.id === host.id)[0]['name'];
host_id.value = host.id;
// 活动主题
activity_name.value = activity.name;
// 活动封面
if (activity.cover) {
has_image.value = true;
uploader_image.value = activity.cover;
}
// 活动详情
html_content.value = activity.note;
}
}
</script>
<script>
......@@ -710,11 +738,13 @@ export default {
// },
async onShow () {
// 获取主办方列表信息
const { data } = await hostListAPI();
const { code, data } = await hostListAPI();
if (code) {
data.my_hosts.forEach(item => {
item.text = item.name
})
this.org_type_columns = data.my_hosts;
}
}
};
</script>
......