需求省市区
This commit is contained in:
@ -60,37 +60,46 @@
|
||||
>
|
||||
<div class="_l">
|
||||
<el-image
|
||||
style="width: 358px; height: 200px; vertical-align: middle"
|
||||
style="width: 358px; height: 220px; vertical-align: middle"
|
||||
:src="item.image"
|
||||
fit="fill"
|
||||
></el-image>
|
||||
</div>
|
||||
<div class="_r">
|
||||
<div class="_r" style="position: relative">
|
||||
<p class="text_hidden">{{ item.title }}</p>
|
||||
<div class="_time">活动时间：{{ item.beginTime }}</div>
|
||||
<div class="_time">收费金额：{{ item.amount }}</div>
|
||||
<div class="_info" style="visibility: hidden">
|
||||
<!-- <span class="fl"
|
||||
<div class="_time">联系人：{{ item.contact }}</div>
|
||||
<div class="_time">联系方式：{{ item.contactMobile }}</div>
|
||||
<!-- <div class="_info"> -->
|
||||
<!-- <span class="fl"
|
||||
><span class="x_blue">{{ item.user }}</span> 人报名</span
|
||||
> -->
|
||||
<el-button class="fr x_btns" v-if="item.status == 1" disabled
|
||||
<!-- <el-button class="fr x_btns" v-if="item.enrollFlag" disabled
|
||||
>已报名</el-button
|
||||
>
|
||||
<el-button
|
||||
v-else-if="item.status == 2"
|
||||
class="fr x16 x_blue x_border_blue"
|
||||
style="border-radius: 0"
|
||||
> -->
|
||||
<!-- v-else-if="item.status == 2" -->
|
||||
<!-- <el-button
|
||||
class="x16 x_blue x_border_blue"
|
||||
v-else
|
||||
style="
|
||||
border-radius: 0;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 0;
|
||||
"
|
||||
@click="handleClickSignUp(item.id, $event)"
|
||||
>报名</el-button
|
||||
>
|
||||
<el-button
|
||||
> -->
|
||||
<!-- <el-button
|
||||
v-else
|
||||
class="fr x16"
|
||||
style="border-radius: 0"
|
||||
type="info"
|
||||
disabled
|
||||
>已结束</el-button
|
||||
>
|
||||
</div>
|
||||
> -->
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -129,9 +138,23 @@
|
||||
{{ selectedActivity.finishTime }}
|
||||
</p>
|
||||
<p class="_place">活动地点：{{ selectedActivity.address }}</p>
|
||||
<p class="_user" style="display: none">
|
||||
<el-button class="x_btns" disabled>已报名</el-button>
|
||||
<span class="_num"><span class="x_blue">16</span> 人报名</span>
|
||||
<p class="_place">联系人：{{ selectedActivity.contact }}</p>
|
||||
<p class="_place">联系方式：{{ selectedActivity.contactMobile }}</p>
|
||||
<p class="_user">
|
||||
<el-button
|
||||
v-if="selectedActivity.enrollFlag"
|
||||
class="x_btns"
|
||||
disabled
|
||||
>已报名</el-button
|
||||
>
|
||||
<el-button
|
||||
v-else
|
||||
class="fr x16 x_blue x_border_blue"
|
||||
style="border-radius: 0"
|
||||
@click="handleClickSignUp(selectedActivity.id, $event)"
|
||||
>报名</el-button
|
||||
>
|
||||
<!-- <span class="_num"><span class="x_blue">16</span> 人报名</span> -->
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -146,6 +169,60 @@
|
||||
</div>
|
||||
</div>
|
||||
<webFooter></webFooter>
|
||||
|
||||
<el-dialog title="活动报名" v-model="showSignUp">
|
||||
<el-form
|
||||
:model="signUpForm"
|
||||
:rules="signUpRules"
|
||||
ref="signUpFormRef"
|
||||
labelWidth="100px"
|
||||
>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="姓名" prop="name">
|
||||
<el-input
|
||||
placeholder="请输入姓名"
|
||||
v-model="signUpForm.name"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="手机号" prop="phone">
|
||||
<el-input
|
||||
placeholder="请输入手机号"
|
||||
v-model="signUpForm.phone"
|
||||
maxlength="11"
|
||||
oninput="value=value.replace(/[\D]+/,``)"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="年龄" prop="age">
|
||||
<el-input-number
|
||||
placeholder="请输入年龄"
|
||||
v-model="signUpForm.age"
|
||||
></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="性别" prop="gender">
|
||||
<el-radio-group v-model="signUpForm.gender">
|
||||
<el-radio label="1">男</el-radio>
|
||||
<el-radio label="2">女</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-row justify="end">
|
||||
<el-button @click="showSignUp = false">取消</el-button>
|
||||
<el-button @click="submitSignUp" type="primary">报名</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script setup name="Activity">
|
||||
@ -155,8 +232,19 @@ import request from "@/utils/request";
|
||||
import webFooter from "@/components/webFooter/index.vue";
|
||||
import { reactive, toRefs } from "vue";
|
||||
import WebContact from "@/components/webContact";
|
||||
import { activitysList } from "@/api/admin/enterprise";
|
||||
// import { activitysList } from "@/api/admin/enterprise";
|
||||
import webBreadcrumb from "@/components/webBreadcrumb/index.vue";
|
||||
import {
|
||||
signUpActivity,
|
||||
activitysList,
|
||||
activityDetail,
|
||||
} from "@/api/website/activity";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { getToken } from "@/utils/auth";
|
||||
|
||||
// import { omit } from "lodash";
|
||||
// import FieldOptions from "@/views/components/FieldOptions";
|
||||
// import CityOptions from "@/views/components/CityOptions";
|
||||
// import webReleaseActive from "@/components/webReleaseActive/index.vue";
|
||||
|
||||
const dialogVisible = ref(false);
|
||||
@ -165,6 +253,9 @@ const total = ref(1);
|
||||
const state = reactive({
|
||||
banner: "",
|
||||
});
|
||||
// const data = reactive({
|
||||
// activityForm: {},
|
||||
// });
|
||||
|
||||
const queryParams = reactive({});
|
||||
let dataList = ref([]);
|
||||
@ -186,14 +277,17 @@ function getList() {
|
||||
}
|
||||
const data = reactive({
|
||||
selectedActivity: {},
|
||||
activityForm: {},
|
||||
});
|
||||
const { selectedActivity } = toRefs(data);
|
||||
|
||||
function handleDetail(item) {
|
||||
async function handleDetail(item) {
|
||||
breadcrumbTitle.id = item.id;
|
||||
breadcrumbTitle.title = "活动报名";
|
||||
breadcrumbTitle.twoTitle = "活动报名详情";
|
||||
selectedActivity.value = dataList.value.find((el) => el.id == item.id);
|
||||
// selectedActivity.value = dataList.value.find((el) => el.id == item.id);
|
||||
const resp = await activityDetail(item.id);
|
||||
selectedActivity.value = resp.data;
|
||||
isShow.value = !isShow.value;
|
||||
}
|
||||
|
||||
@ -223,6 +317,76 @@ onMounted(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
});
|
||||
|
||||
const showSignUp = ref(false);
|
||||
const signUpForm = reactive({});
|
||||
const signUpFormRef = ref();
|
||||
const signUpRules = reactive({
|
||||
name: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入姓名！",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
age: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入年龄！",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
gender: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择性别！",
|
||||
trigger: "change",
|
||||
},
|
||||
],
|
||||
phone: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入手机号！",
|
||||
trigger: "blur",
|
||||
},
|
||||
{
|
||||
pattern: /^1[3456789]\d{9}$/,
|
||||
message: "手机号格式不正确",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
});
|
||||
const reset = () => {
|
||||
for (const key in signUpForm) {
|
||||
if (Object.hasOwnProperty.call(signUpForm, key)) {
|
||||
// const item = signUpForm[key];
|
||||
delete signUpForm[key];
|
||||
}
|
||||
}
|
||||
if (signUpFormRef.value) {
|
||||
signUpFormRef.value.resetFields();
|
||||
}
|
||||
};
|
||||
|
||||
const handleClickSignUp = (id, e) => {
|
||||
e.stopPropagation();
|
||||
console.log(id, e);
|
||||
if (!getToken()) {
|
||||
return ElMessage.error("您当前未登录");
|
||||
}
|
||||
reset();
|
||||
signUpForm.activityId = id;
|
||||
showSignUp.value = true;
|
||||
};
|
||||
|
||||
const submitSignUp = async () => {
|
||||
await signUpFormRef.value.validate();
|
||||
await signUpActivity(signUpForm);
|
||||
ElMessage.success("报名成功");
|
||||
const resp = await activityDetail(selectedActivity.value.id);
|
||||
selectedActivity.value = resp.data;
|
||||
showSignUp.value = false;
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.activity {
|
||||
@ -242,6 +406,7 @@ onMounted(() => {
|
||||
.el-button {
|
||||
position: absolute;
|
||||
top: 171px;
|
||||
height: 60px;
|
||||
right: 46px;
|
||||
background-color: #ffc600;
|
||||
color: #fff;
|
||||
@ -276,6 +441,7 @@ onMounted(() => {
|
||||
flex: 1;
|
||||
padding: 36px 20px 0 16px;
|
||||
background-color: #fff;
|
||||
height: 220px;
|
||||
p {
|
||||
margin-top: 0;
|
||||
font-size: 16px;
|
||||
|
||||
Reference in New Issue
Block a user