feat: 添加报名简介模块

src/pages/index/enrol/classes/index.vue

@@ -59,6 +59,14 @@
         @change="handleEditOrder(scope.row)"></el-input-number>
     </template>
 
+    <!-- 封面 -->
+    <template #classes_cover="scope">
+      <el-image v-if="scope.row.classes_cover" :src="scope.row.classes_cover.split(',')[0]" lazy
+        :preview-src-list="scope.row.classes_cover.split(',')" :preview-teleported="true"
+        :hide-on-click-modal="true" fit="contain" class="el-avatar"></el-image>
+      <template v-else>暂无图片</template>
+    </template>
+
     <template #chaoz="scope">
       <el-space>
         <el-button size="small" @click="handleUpdate(scope.row)">
@@ -133,6 +141,11 @@ const column = [
     label: '班型名称',
     width: '150'
   },
+  {
+    prop: "classes_cover",
+    label: '封面',
+    width: '150',
+  },
   {
     prop: "classes_desc",
     label: '班型简介',

src/pages/index/enrol/sign_up_intro/index.vue

@@ -0,0 +1,150 @@
+<template>
+  <!-- 面包屑 -->
+  <el-breadcrumb>
+    <el-breadcrumb-item>报名方式</el-breadcrumb-item>
+    <el-breadcrumb-item to="/SignUpIntro'">报名简介</el-breadcrumb-item>
+  </el-breadcrumb>
+  <el-form ref="formRef" :model="formData" :rules="rules">
+    <el-row>
+
+
+      <el-col :span="12">
+        <el-form-item :label-width="labelWidth" label="标题" prop="sign_up_intro_title">
+          <el-input v-model='formData.sign_up_intro_title' type="text" placeholder='请输入标题'></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item :label-width="labelWidth" label="副标题" prop="sign_up_intro_subtitle">
+          <el-input v-model='formData.sign_up_intro_subtitle' type="text" placeholder='请输入副标题'></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item :label-width="labelWidth" label="简介" prop="sign_up_intro_desc">
+          <el-input v-model='formData.sign_up_intro_desc' type="text" placeholder='请输入简介'></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="24">
+        <el-form-item :label-width="labelWidth" label="内容" prop="sign_up_intro_content">
+          <RichText v-model='formData.sign_up_intro_content' :min-height='196'></RichText>
+          <!-- <el-input v-model='formData.sign_up_intro_content' type="textarea" :rows="10" placeholder='请输入内容'></el-input> -->
+        </el-form-item>
+      </el-col>
+      <el-col :span='12'>
+        <el-form-item :label-width='labelWidth' label='描述图片' prop='sign_up_intro_img'>
+          <UploadImage ref='uploadRef' v-model='formData.sign_up_intro_img' :data=uoloadData :limit='1' :fileSize='5'
+            :drag='true' :isShowTip='false' />
+        </el-form-item>
+      </el-col>
+
+
+    </el-row>
+    <el-row>
+      <el-button type="primary" class="sus_button" @click="save(formRef)">
+        保存
+      </el-button>
+    </el-row>
+  </el-form>
+</template>
+<script setup>
+import { ref, reactive } from "vue";
+import { getSignUpIntro, editSignUpIntro } from "~/service/sign_up_intro";
+import { useLoginStore } from "~/store";
+
+const store = useLoginStore();
+const headers = {
+  Accept: "application/json",
+  ...store.headers,
+};
+
+let formData = ref({});
+
+
+
+const uoloadData = ref({
+  dirName: "SignUpIntro"
+})
+
+//验证规则
+const rules = reactive({
+  sign_up_intro_title: [
+    {
+      required: true,
+      message: '标题不能为空'
+    }
+  ],
+  sign_up_intro_subtitle: [
+    {
+      required: true,
+      message: '副标题不能为空'
+    }
+  ],
+  sign_up_intro_desc: [
+    {
+      required: true,
+      message: '简介不能为空'
+    }
+  ],
+  sign_up_intro_content: [
+    {
+      required: true,
+      message: '内容不能为空'
+    }
+  ],
+  sign_up_intro_img: [
+    {
+      required: true,
+      message: '描述图片不能为空'
+    }
+  ],
+
+});
+
+const labelWidth = 200;
+const formRef = ref();
+
+//获取
+const getContent = async () => {
+  const { code, data } = await getSignUpIntro();
+  if (code == 0) {
+    formData.value = data;
+
+
+  }
+};
+
+getContent()
+
+//保存
+const save = async (formEl) => {
+  if (!formEl) return;
+  formEl.validate(async (valid) => {
+    if (!valid) {
+      return;
+    }
+
+
+
+    const { code } = await editSignUpIntro(formData.value);
+  });
+};
+
+</script>
+<style lang="scss" scoped>
+.sus_button {
+  width: 300px;
+  height: 50px;
+  margin: 20px auto;
+}
+
+.upLoadEl {
+  :deep(.el-upload-list__item) {
+    height: 200px;
+    width: 300px;
+  }
+
+  :deep(.el-upload-list__item-thumbnail) {
+    object-fit: contain;
+  }
+}
+</style>
+  

src/service/sign_up_intro.js

@@ -0,0 +1,23 @@
+import { api} from '~/utils/axios';
+
+/**
+ * 获取报名简介内容
+ * @param {Object} data
+ * @return {Promise} api
+ */
+export function getSignUpIntro(data) {
+  return api.post('Enrol.SignUpIntro/getSignUpIntro', data);
+}
+
+/**
+ * 编辑报名简介
+ * @param {Object} data
+ * @return {Promise} api
+ */
+export function editSignUpIntro(data) {
+  return api.post('Enrol.SignUpIntro/editSignUpIntro', data, {
+    isTransformResponse: true,
+    isShowSuccessMessage: true,
+    errorMessageText: '编辑失败'
+  });
+}