| 
					
				 | 
			
			
				@@ -0,0 +1,163 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  <Dialog :title="dialogTitle" v-model="dialogVisible" class="!w-50%"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    <el-form 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      ref="formRef" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      :model="formData" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      :rules="formRules" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      label-width="150px" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      v-loading="formLoading" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      :validate-on-rule-change="false" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <el-form-item label="活动名称" prop="activityTitle"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <el-input v-model="formData.activityTitle" placeholder="请输入活动名称" class="!w-240px"/> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </el-form-item> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<el-form-item label="举办机构" prop="activityOrganizer"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <el-input v-model="formData.activityOrganizer" placeholder="请输入举办机构名称" class="!w-240px"/> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </el-form-item> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <el-form-item label="开始时间" prop="activityStartDate"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <el-date-picker v-model="formData.activityStartDate" :disabledDate="disabledDates" value-format="x" type="date" placeholder="请选择活动开始时间" class="!w-240px" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </el-form-item> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<el-form-item label="结束时间" prop="activityEndDate"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <el-date-picker v-model="formData.activityEndDate" :disabledDate="disabledDates" value-format="x" type="date" placeholder="请选择活动结束时间" class="!w-240px" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </el-form-item> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<el-form-item label="投票频率" prop="votingRule.dateType"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				<el-radio-group v-model="formData.votingRule.dateType"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					<el-radio value="day">每天</el-radio> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					<el-radio value="month">每月</el-radio> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					<el-radio value="year">每年</el-radio> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				</el-radio-group> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			</el-form-item> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<el-form-item label="指定频率内可投票数" prop="votingRule.num"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				<el-input-number v-model="formData.votingRule.num" :min="1" :step="1" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			</el-form-item> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<el-form-item label="活动图片" prop="headImg"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <UploadImg v-model="formData.headImg" height="150px" width="150px" :fileSize="20" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </el-form-item> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<el-form-item label="活动背景图" prop="activityContent.backgroundImg"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <UploadImg v-model="formData.activityContent.backgroundImg" height="150px" width="150px" :fileSize="20" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </el-form-item> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <el-form-item label="活动内容" prop="activityContent.content"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <Editor v-model="formData.activityContent.content" height="150px" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </el-form-item> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    </el-form> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    <template #footer> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <el-button @click="dialogVisible = false">取 消</el-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  </Dialog> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<script setup lang="ts"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import { VotingActivityApi } from '@/api/menduner/system/vote' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+defineOptions({ name: 'VotingActivityForm' }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+defineProps({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  area: Array, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  position: Array 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const { t } = useI18n() // 国际化 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const message = useMessage() // 消息弹窗 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const dialogVisible = ref(false) // 弹窗的是否展示 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const dialogTitle = ref('') // 弹窗的标题 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const formType = ref('') // 表单的类型:create - 新增;update - 修改 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const formData = ref({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	votingActivityId: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	activityTitle: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	activityStartDate: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	activityEndDate: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	activityContent: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		backgroundImg: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		content: undefined 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	activityOrganizer: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	votingRule: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		dateType: 'day', // 投票频率:day - 日,month - 月,year - 年 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		num: 1 // 指定频率内最多投票次数 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	headImg: undefined 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const formRules = reactive({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  activityTitle: [{ required: true, message: '活动名称不能为空', trigger: 'blur' }], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  activityStartDate: [{ required: true, message: '活动开始时间', trigger: 'change' }], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  activityEndDate: [{ required: true, message: '活动结束时间', trigger: 'change' }], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  activityOrganizer: [{ required: true, message: '举办机构不能为空', trigger: 'blur' }], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  headImg: [{ required: true, message: '活动图片不能为空', trigger: 'change' }], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	'activityContent.backgroundImg': [{ required: true, message: '活动背景图不能为空', trigger: 'change' }], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	'activityContent.content': [{ required: true, message: '活动内容不能为空', trigger: 'blur' }], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	'votingRule.dateType': [{ required: true, message: '投票频率不能为空', trigger: 'change' }], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	'votingRule.num': [{ required: true, message: '投票频率不能为空', trigger: 'change' }], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const formRef = ref() // 表单 Ref 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+// 过去的日期不可选 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const disabledDates = (date) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  const currentDate = new Date() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  currentDate.setDate(currentDate.getDate() - 1) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  return date.getTime() < currentDate.getTime() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+/** 打开弹窗 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const open = async (type: string, id?: number) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  dialogVisible.value = true 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  dialogTitle.value = t('action.' + type) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  formType.value = type 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  resetForm() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // 修改时,设置数据 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  if (id) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    formLoading.value = true 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    try { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      formData.value = await VotingActivityApi.getVotingActivity(id) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } finally { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      formLoading.value = false 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+defineExpose({ open }) // 提供 open 方法,用于打开弹窗 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+/** 提交表单 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const submitForm = async () => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // 校验表单 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  await formRef.value.validate() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  // 提交请求 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  formLoading.value = true 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  try { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    if (formType.value === 'create') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      await VotingActivityApi.createVotingActivity(formData.value) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      message.success(t('common.createSuccess')) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      await VotingActivityApi.updateVotingActivity(formData.value) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      message.success(t('common.updateSuccess')) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    dialogVisible.value = false 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    // 发送操作成功的事件 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    emit('success') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } finally { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    formLoading.value = false 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+/** 重置表单 */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const resetForm = () => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  formData.value = { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		votingActivityId: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		activityTitle: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		activityStartDate: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		activityEndDate: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		activityContent: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			backgroundImg: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			content: undefined 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		activityOrganizer: undefined, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		votingRule: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			dateType: 'day', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			num: 1 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		headImg: undefined 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  formRef.value?.resetFields() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</script> 
			 |