签到功能添加感谢信内容

src/views/signInModule/signInSet/components/EditDialog.vue

@@ -5,7 +5,7 @@
             <a-form ref="formRef" :model="formData" :rules="formRules">
                 <a-card class="mb-8-2">
                     <a-row :gutter="12">
-                         <a-col :span="24">
+                        <a-col :span="24">
                             <a-form-item :label="'奖品名称'" name="rewardName">
                                 <a-input :placeholder="'请输入奖品名称'" v-model:value="formData.rewardName"></a-input>
                             </a-form-item>
@@ -20,12 +20,12 @@
                         </a-col>
 
                         <a-col :span="24">
-                            <a-form-item :label="'积分数'" name="points" v-if="formData.rewardType==='point'">
+                            <a-form-item :label="'积分数'" name="points" v-if="formData.rewardType === 'point'">
                                 <a-input-number :placeholder="'请输入积分数'" v-model:value="formData.points"
                                     style="width: 100%;"></a-input-number>
                             </a-form-item>
                         </a-col>
-                         <a-col :span="24">
+                        <a-col :span="24">
                             <a-form-item :label="'周期类型'" name="cycleType">
                                 <a-select ref="select" v-model:value="formData.cycleType">
                                     <a-select-option :value="'自然月'">{{ '自然月' }}</a-select-option>
@@ -34,10 +34,16 @@
                             </a-form-item>
                         </a-col>
                         <a-col :span="24">
-                            <a-form-item  v-if="formData.cycleType==='固定天数'" :label="'签到周期(天)'" name="maxDays" >
+                            <a-form-item v-if="formData.cycleType === '固定天数'" :label="'签到周期(天)'" name="maxDays">
                                 <a-input-number :placeholder="'请输入签到周期'" v-model:value="formData.maxDays"
                                     style="width: 100%;"></a-input-number>
                             </a-form-item>
+                        </a-col>
+                                             <a-col :span="24">
+                            <a-form-item :label="'信件内容'">
+                                <x-editor v-model="editorContent" :uploadHandler="uploadHandler"
+                                    :height="300"></x-editor>
+                            </a-form-item>
                         </a-col>
                         <a-col :span="24">
                             <a-form-item :label="'状态'" name="status">
@@ -66,7 +72,7 @@ import apis from '@/apis'
 import { useForm, useModal, useSpining } from '@/hooks'
 import { message } from 'ant-design-vue'
 import { useI18n } from 'vue-i18n'
-import { spliceUrl } from "@/utils/util.js"
+import { spliceUrl,decryptString,encryptString  } from "@/utils/util.js"
 import { signInEnum } from "@/enums/useEnum"
 const emit = defineEmits(['ok'])
 const { t } = useI18n() // 解构出t方法
@@ -77,6 +83,7 @@ const cancelText = ref(t('button.cancel'))
 const okText = ref(t('button.confirm'))
 const listData = ref([])
 const numChecked = ref(false)
+const editorContent = ref('')
 const probabilityChecked = ref(false)
 formRules.value = {
     rewardName: { required: true, message: '请选择签到名称' },
@@ -84,6 +91,7 @@ formRules.value = {
     maxNum: { required: true, message: '请输入最大中奖数' },
     rewardType: { required: true, message: '请选择签到类型', trigger: 'change' },
     status: [{ required: true, message: '请输入状态', trigger: 'change' }],
+    content: { required: true, message: '请输入信件内容' },
 }
 
 /**
@@ -118,6 +126,7 @@ async function handleEdit(record = {}) {
             cycleType: data.maxDays < 0 ? '自然月' : '固定天数',
             imgList: data.img ? [config('http.apiBasic') + data.img] : []
         }
+        editorContent.value = decryptString(data.content) || ''
         numChecked.value = data.maxNum < 0 ? true : false
         probabilityChecked.value = data.probability < 0 ? true : false
     } catch (error) {
@@ -132,13 +141,14 @@ async function handleEdit(record = {}) {
 function handleOk() {
     formRef.value.validateFields().then(async (values) => {
         try {
-            if (formData.value.cycleType==='固定天数' && (!formData.value.maxDays || formData.value.maxDays<=0)){
+            if (formData.value.cycleType === '固定天数' && (!formData.value.maxDays || formData.value.maxDays <= 0)) {
-               return message.error('签到周期必须大于0')
+                return message.error('签到周期必须大于0')
             }
             showLoading()
             const params = {
-                ...values,
+                ...formData.value,
-                maxDays: formData.value.cycleType==='自然月'?-1:formData.value.maxDays,
+                content: encryptString(editorContent.value),
+                maxDays: formData.value.cycleType === '自然月' ? -1 : formData.value.maxDays,
                 img: formData.value.imgList && spliceUrl(formData.value.imgList[0]),
 
             }

src/views/signInModule/signInSet/index.vue

@@ -61,9 +61,10 @@
                             <span v-if="record.maxDays > 0">{{ record.maxDays + '天' }}</span>
                             <span v-else>自然月</span>
                         </template>
-                        <!-- <template v-if="column.dataIndex === 'content'">
+                        <template v-if="column.dataIndex === 'content'">
-                           <span>{{ record.content}}</span>
+                             <span style="cursor: pointer;color:#1677ff;"
-                        </template> -->
+                                @click="content = decryptString(record.content) || '';qropen = true" type="link">点击查看</span>
+                        </template>
                         <template v-if="'status' === column.dataIndex">
                             <a-tag v-if="record.status === 'enabled'" :color="'green'">启用</a-tag>
                             <a-tag v-if="record.status === 'disabled'" :color="'red'">停用</a-tag>
@@ -84,7 +85,13 @@
             </a-card>
         </a-col>
     </a-row>
-
+    <a-modal v-model:open="qropen" :title="'查看内容'" @ok="qropen = false" :footer="null">
+        <a-card>
+            <div style="height: 450px;overflow-y: auto;">
+                <div v-html="content" ></div>
+            </div>
+        </a-card>
+    </a-modal>
     <edit-dialog ref="editDialogRef" @ok="onOk"></edit-dialog>
 </template>
 
@@ -98,6 +105,7 @@ import EditDialog from './components/EditDialog.vue'
 import { PlusOutlined, EditOutlined, DeleteOutlined } from '@ant-design/icons-vue'
 import { useI18n } from 'vue-i18n'
 import { signInEnum } from "@/enums/useEnum"
+import { decryptString } from "@/utils/util"
 defineOptions({
     name: 'signInSet',
 })
@@ -108,9 +116,12 @@ const columns = [
     { title: '奖品类型', dataIndex: 'rewardType', width: 120, align: 'center' },
     { title: '奖励积分', dataIndex: 'points', width: 100, align: 'center' },
     { title: '签到周期', dataIndex: 'maxDays', align: 'center' },
+    { title: '信件内容', dataIndex: 'content', align: 'center' },
     { title: '状态', dataIndex: 'status', align: 'center' },
     { title: t('button.action'), key: 'action', fixed: 'right', width: 100, align: 'center' },
 ]
+const content = ref('')
+const qropen=ref(false)
 const { listData, loading, showLoading, hideLoading, paginationState, resetPagination, searchFormData } = usePagination()
 const editDialogRef = ref()
 getPageList()