添加知识平台

src/App.vue

@@ -11,7 +11,7 @@
 import { mapState, mapActions, mapMutations } from 'vuex';
 import zh_CN from 'ant-design-vue/lib/locale-provider/zh_CN';
 import BtnCon from 'components/BtnCom/BtnCon.vue';
-//
+
 export default {
   name: 'App',
   components: { BtnCon },

src/components/BtnCom/BtnCon.vue

@@ -38,6 +38,9 @@
     <div @click="jump('/industrial-services')" class="btn">服务</div>
     <div @click="jump('/industry-derivative-enterprise')" class="btn">衍生企业</div>
     <div @click="jump('/industry-demand-report')" class="btn">需求填报</div>
+
+    <div class="font-bold-24">知识平台</div>
+    <div @click="jump('/college')" class="btn">知识平台</div>
   </div>
 </template>
 

src/config/api.js

@@ -25,6 +25,7 @@ const personApply = `${greenvalley}/PersonApply`; // 加入我们相关操作
 const product = `${greenvalley}/product`; // 产品相关操作
 const releaseTheList = `${greenvalley}/releaseTheList`; // 发榜和揭榜功能相关操作
 const tutorRelated = `${greenvalley}/tutorRelated`; // 人才信息相关操作
+const academy = `${greenvalley}/academy`; // 知识平台相关操作
 
 export const upload = `${greenvalley}/file/upload`;
 
@@ -339,3 +340,18 @@ export const upTutorH = params => axios.post(`${tutorRelated}/upTutorH`, params)
 
 // 删除人才类型
 export const delTutorH = params => axios.post(`${tutorRelated}/delTutorH`, params);
+
+// 删除知识平台内容
+export const academyDelete = params => axios.post(`${academy}/delete`, params);
+
+// 查询知识平台内容
+export const academyQueryBack = params => axios.post(`${academy}/query/back`, params);
+
+// 添加知识平台内容
+export const academySave = params => axios.post(`${academy}/save`, params);
+
+// 修改知识平台内容
+export const academyUpdate = params => axios.post(`${academy}/update`, params);
+
+// 查询知识平台栏目
+export const queryMold = params => axios.post(`${academy}/queryMold`, params);

src/router/index.js

@@ -214,6 +214,13 @@ const routes = [
     name: 'IndustryDemandReport',
     component: () => import(/* webpackChunkName: "industry-demand-report" */ 'views/IndustryDemandReport/IndustryDemandReport.vue'),
   },
+  //  -------知识平台
+  // 知识平台
+  {
+    path: '/college',
+    name: 'College',
+    component: () => import(/* webpackChunkName: "industry-demand-report" */ 'views/College/College.vue'),
+  },
 ];
 
 const router = new VueRouter({

src/views/Challenge/Challenge.vue

@@ -40,7 +40,7 @@ export default {
   },
 
   methods: {
-    // 获取创业学院内容列表
+    // 获取知识平台内容列表
     async getListData(condition) {
       try {
         if (condition && condition.current) {

src/views/College/College.vue

@@ -0,0 +1,76 @@
+<template>
+  <div class="pa-3 white fill-height d-flex flex-column">
+    <college-search @getListData="getListData" />
+    <college-date :lists="lists" :pagination="pagination" @getListData="getListData" />
+  </div>
+</template>
+
+<script>
+import CollegeSearch from './components/CollegeSearch.vue';
+import CollegeDate from './components/CollegeDate.vue';
+import { academyQueryBack } from 'config/api';
+
+export default {
+  name: 'College',
+  components: {
+    CollegeSearch,
+    CollegeDate,
+  },
+
+  data() {
+    return {
+      str: '知识平台管理界面',
+      lists: {},
+      pagination: { current: 1, pageSize: 10 },
+      pageNum: 1,
+      pageSize: 10,
+      paramData: {
+        banner: [],
+        type: '',
+        title: '',
+      },
+    };
+  },
+
+  created() {
+    this.getListData();
+  },
+
+  methods: {
+    // 获取知识平台内容列表
+    async getListData(condition) {
+      try {
+        if (condition && condition.current) {
+          this.pageNum = condition.current;
+          this.pageSize = condition.pageSize;
+        } else if (condition && !condition.current) {
+          this.paramData = condition;
+        }
+        const params = {
+          param: {
+            title: this.paramData.title,
+            type: this.paramData.type,
+            banner: this.paramData.banner,
+            pageNum: this.pageNum,
+            pageSize: this.pageSize,
+          },
+        };
+        const res = await academyQueryBack(params);
+        const { code, msg, data } = res.data;
+        if (code === 200) {
+          this.lists = data;
+          const paper = { ...this.pagination };
+          paper.current = data.pageNum;
+          paper.total = +data.total;
+          paper.pageSize = data.pageSize;
+          this.pagination = paper;
+        } else {
+          throw msg || '获取失败';
+        }
+      } catch (error) {
+        this.$message.error(error);
+      }
+    },
+  },
+};
+</script>

src/views/College/components/CollegeAdd.vue

@@ -0,0 +1,268 @@
+<template>
+  <div class="d-flex flex-wrap pb-3">
+    <!-- 添加 -->
+    <a-modal
+      :mask-closable="false"
+      @cancel="$emit('closeModal')"
+      destroy-on-close
+      footer
+      title="知识平台添加"
+      v-model="visible"
+      width="700px"
+    >
+      <a-form :form="form" @submit="handleSubmit">
+        <!-- 标题 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="标题"
+        >
+          <a-input
+            @change="changeIpt($event, 'title')"
+            class="ml-3"
+            placeholder="标题"
+            v-decorator="[
+              'title',
+              {
+                rules: [
+                  { required: true, message: '标题不能为空' },
+                  { whitespace: true, message: '标题不能为空' },
+                  { max: 140, massage: '标题最多140个字符' },
+                ],
+              },
+            ]"
+          />
+        </a-form-item>
+        <!-- 内容链接 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="内容链接"
+        >
+          <a-input
+            @change="changeIpt($event, 'contentUrl')"
+            class="ml-3"
+            placeholder="内容链接"
+            v-decorator="[
+              'contentUrl',
+              {
+                rules: [
+                  { required: true, message: '内容链接不能为空' },
+                  { whitespace: true, message: '内容链接不能为空' },
+                  { max: 300, massage: '内容链接最多30个字符' },
+                ],
+              },
+            ]"
+          />
+        </a-form-item>
+        <!-- 简介 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="简介"
+        >
+          <a-textarea
+            @change="changeIpt($event, 'intro')"
+            class="ml-3"
+            placeholder="简介"
+            v-decorator="[
+              'intro',
+              {
+                rules: [
+                  { required: true, message: '简介不能为空' },
+                  { whitespace: true, message: '简介不能为空' },
+                  { max: 140, massage: '简介最多140个字符' },
+                ],
+              },
+            ]"
+          />
+        </a-form-item>
+        <!-- 封面图片 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="封面图片"
+        >
+          <a-upload
+            :action="upload"
+            :before-upload="beforeUpload"
+            @change="handleChange"
+            class="ml-3"
+            list-type="picture"
+            name="files"
+          >
+            <a-button>
+              <a-icon type="upload" />选择封面图片
+            </a-button>
+          </a-upload>
+        </a-form-item>
+        <!-- 时间 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="时间"
+        >
+          <a-date-picker @change="changeBirthday" class="ml-3" show-time />
+        </a-form-item>
+        <!-- 类型 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="类型"
+        >
+          <a-select
+            @change="getUse($event, 'type')"
+            class="ml-3"
+            default-value="视频"
+            style="width: 100%"
+          >
+            <a-select-option
+              :key="index"
+              :value="index + 1"
+              v-for="(item, index) in recStatusList"
+            >{{ item }}</a-select-option>
+          </a-select>
+        </a-form-item>
+        <!-- 栏目 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="栏目"
+        >
+          <a-checkbox-group @change="onChangeBan" class="ml-3">
+            <a-checkbox
+              :key="index"
+              :value="item.moldId"
+              class="my-2"
+              v-for="(item, index) in bannersList"
+            >{{ item.moldName }}</a-checkbox>
+          </a-checkbox-group>
+        </a-form-item>
+        <a-form-item class="d-flex flex-row-reverse">
+          <a-button @click="$emit('closeModal')" class="mr-3">取消</a-button>
+          <a-button class="white--text" html-type="submit" type="primary">保存</a-button>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import { upload, academySave, queryMold } from 'config/api';
+
+const formItemLayout = {
+  labelCol: { span: 6 },
+  wrapperCol: { span: 16 },
+};
+
+const tailItemLayout = { wrapperCol: { span: 16, offset: 6 } };
+
+export default {
+  name: 'CollegeAdd',
+  props: { visible: { type: Boolean, default: false } },
+  data() {
+    return {
+      formItemLayout,
+      tailItemLayout,
+      form: this.$form.createForm(this, { name: 'r-d-member-add' }),
+      upload: upload,
+      fileList: [],
+      //限制文件上传的格式和大小
+      beforeUpload: file => {
+        const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
+        if (!isJpgOrPng) {
+          this.$message.error('仅支持 JPG/PNG 格式的图片!');
+          this.fileList = [];
+        }
+        return isJpgOrPng;
+      },
+      recStatusList: ['视频', '音频', 'PPT'],
+      bannersList: [],
+      banner: [],
+      title: '',
+      contentUrl: '',
+      intro: '',
+      times: '',
+      type: 1,
+    };
+  },
+  created() {
+    this.getQueryMold();
+  },
+  methods: {
+    changeBirthday(date, dateString) {
+      // console.log(this.$moment(date._e).format('YYYY-MM-DD HH:mm:ss'));
+      this.times = this.$moment(date._e).format('YYYY-MM-DD HH:mm:ss');
+    },
+
+    onChangeBan(e) {
+      this.banner = e;
+    },
+    // 上传图片事件
+    handleChange(info) {
+      // this.fileList = fileList;
+      console.log(info);
+      if (info.file.status === 'done') {
+        this.fileList.push(info.file.response.data[0].id);
+      } else if (info.file.status === 'removed') {
+        this.fileList = info.fileList;
+      }
+    },
+    changeIpt(e, str) {
+      this[str] = e.target.value;
+    },
+    getUse(e, str) {
+      this[str] = e;
+    },
+    async getQueryMold() {
+      try {
+        const res = await queryMold();
+        const { code, msg, data } = res.data;
+        if (code === 200) {
+          this.bannersList = data;
+        } else {
+          this.$message.error(msg);
+        }
+      } catch (error) {
+        this.$message.error(error);
+      }
+    },
+    // 提交表单
+    handleSubmit(e) {
+      e.preventDefault();
+      this.form.validateFieldsAndScroll(async (err, values) => {
+        if (!err) {
+          try {
+            this.picId = this.fileList[0];
+            const params = {
+              param: {
+                banners: this.banner,
+                contentUrl: this.contentUrl,
+                coverPicture: this.fileList[0],
+                intro: this.intro,
+                times: this.times,
+                title: this.title,
+                type: this.type,
+              },
+            };
+            const res = await academySave(params);
+            const { data, msg, code } = res.data;
+            if (code === 200) {
+              this.fileList.splice(0, this.fileList.length);
+              this.$emit('handleTableChange');
+              this.$emit('closeModal');
+              this.$message.success('添加成功');
+            } else {
+              throw msg;
+            }
+          } catch (error) {
+            this.$message.error(error || '添加失败');
+          }
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style scoped lang="stylus"></style>

src/views/College/components/CollegeDate.vue

@@ -0,0 +1,209 @@
+<template>
+  <div class="main flex-1">
+    <div style="width: 100%" v-if="lists.list && lists.list.length > 0">
+      <a-table
+        :columns="columns"
+        :data-source="lists.list"
+        :loading="loading"
+        :pagination="pagination"
+        :row-key="record => record.academyId"
+        :scroll="{ y: height }"
+        @change="handleTableChange"
+        bordered
+        class="white"
+      >
+        <template slot="id" slot-scope="text, record, index">
+          <span>{{ index + 1 }}</span>
+        </template>
+
+        <template slot="coverPicture" slot-scope="text, record">
+          <img :src="record.picUrl" height="50" width="50" />
+        </template>
+
+        <template slot="type" slot-scope="text, record">
+          <span v-if="record.type === 1">视频</span>
+          <span v-else-if="record.type === 2">音频</span>
+          <span v-else-if="record.type === 3">ppt</span>
+        </template>
+
+        <template slot="edit" slot-scope="text, record">
+          <a-icon @click="showEditModal(record)" class="pointer" theme="twoTone" type="edit" />
+          <a-popconfirm
+            @confirm="() => onDelete(record.academyId)"
+            title="确定要删除这一条?"
+            v-if="lists.list.length"
+          >
+            <a-icon class="ml-4 pointer" theme="twoTone" two-tone-color="#ff0000" type="delete" />
+          </a-popconfirm>
+        </template>
+        <!-- <div class="d-flex flex-nowrap justify-space-between" slot="expandedRowRender" slot-scope="record" style="margin: 0">
+          {{ getselContent(record.id) }}
+        </div>-->
+      </a-table>
+    </div>
+    <a-empty v-else />
+
+    <!-- 编辑 -->
+    <college-edit
+      :edit-data="editData"
+      :edit-visible="editVisible"
+      @closeModal="closeModal"
+      @getData="getData"
+      v-if="editVisible"
+    />
+  </div>
+</template>
+
+<script>
+import CollegeEdit from './CollegeEdit.vue';
+import { academyDelete } from 'config/api';
+const columns = [
+  {
+    title: '序号',
+    align: 'center',
+    dataIndex: 'id',
+    key: 'id',
+    width: '7%',
+    scopedSlots: { customRender: 'id' },
+  },
+  {
+    title: '标题',
+    align: 'center',
+    dataIndex: 'title',
+    key: 'title',
+  },
+  {
+    title: '内容链接',
+    align: 'center',
+    dataIndex: 'contentUrl',
+    key: 'contentUrl',
+  },
+  {
+    title: '封面图片',
+    align: 'center',
+    dataIndex: 'coverPicture',
+    key: 'coverPicture',
+    scopedSlots: { customRender: 'coverPicture' },
+  },
+  {
+    title: '简介',
+    align: 'center',
+    dataIndex: 'intro',
+    key: 'intro',
+    // scopedSlots: { customRender: 'picUrl' },
+  },
+  {
+    title: '类型',
+    align: 'center',
+    dataIndex: 'type',
+    key: 'type',
+    scopedSlots: { customRender: 'type' },
+  },
+  {
+    title: '时间',
+    align: 'center',
+    dataIndex: 'times',
+    key: 'times',
+    scopedSlots: { customRender: 'times' },
+  },
+  {
+    title: '编辑',
+    align: 'center',
+    dataIndex: 'edit',
+    key: 'edit',
+    scopedSlots: { customRender: 'edit' },
+  },
+];
+
+export default {
+  name: 'CollegeDate',
+  components: { CollegeEdit },
+  // props: { lists: { type: Array, default: () => {} } },
+  props: { lists: { type: Object, default: () => {} }, pagination: { type: Object, default: () => {} } },
+
+  data() {
+    return {
+      columns,
+      loading: false,
+      editingKey: '',
+      height: '',
+      editVisible: false,
+      editData: null,
+      contents: '',
+    };
+  },
+
+  mounted() {
+    let th = 250;
+    let wh = window.innerHeight;
+    this.height = wh - th;
+    window.onresize = () => {
+      return (() => {
+        wh = window.innerHeight;
+        this.height = wh - th;
+      })();
+    };
+  },
+  methods: {
+    showEditModal(data) {
+      console.log('=====>showEditModal', data);
+      this.editData = data;
+      // this.contents = this.getselContent(data.academyId);
+      this.editVisible = true;
+      console.log('是否显示');
+    },
+
+    closeModal() {
+      this.editVisible = false;
+    },
+    handleTableChange(pagination) {
+      const { current, pageSize } = pagination;
+      const condition = { current, pageSize };
+      this.$emit('getListData', condition);
+    },
+    getData() {
+      this.$emit('getListData');
+    },
+    // 删除
+    async onDelete(academyId) {
+      try {
+        const params = { param: { academyId } };
+        const res = await academyDelete(params);
+        const { data, msg, code } = res.data;
+        if (code === 200) {
+          this.$emit('getListData');
+          this.$message.success('删除成功');
+          // TODO: 填到列表中
+        } else {
+          throw msg;
+        }
+      } catch (error) {
+        this.$message.error(error || '删除失败');
+      }
+    },
+    // 获取服务内容
+    getselContent(id) {
+      try {
+        const parmas = {
+          param: {
+            id: +id,
+            serviceType: 2,
+          },
+        };
+        const res = selContent(params);
+        const { code, msg, data } = res.data;
+        if (code === 200) {
+          // console.log(data);
+          return data.content;
+        } else {
+          return '暂无内容';
+        }
+      } catch (error) {
+        return '暂无内容';
+      }
+    },
+  },
+};
+</script>
+
+<style scoped lang="stylus"></style>

src/views/College/components/CollegeEdit.vue

@@ -0,0 +1,290 @@
+<template>
+  <div class="d-flex flex-wrap pb-3">
+    <!-- 添加 -->
+    <a-modal
+      :mask-closable="false"
+      @cancel="$emit('closeModal')"
+      destroy-on-close
+      footer
+      title="知识平台修改"
+      v-model="editVisible"
+      width="700px"
+    >
+      <a-form :form="form" @submit="handleSubmit">
+        <!-- 标题 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="标题"
+        >
+          <a-input
+            class="ml-3"
+            placeholder="标题"
+            v-decorator="[
+              'title',
+              {
+                rules: [
+                  { required: true, message: '标题不能为空' },
+                  { whitespace: true, message: '标题不能为空' },
+                  { max: 140, massage: '标题最多140个字符' },
+                ],
+                initialValue: title,
+              },
+            ]"
+          />
+        </a-form-item>
+        <!-- 内容链接 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="内容链接"
+        >
+          <a-input
+            class="ml-3"
+            placeholder="内容链接"
+            v-decorator="[
+              'contentUrl',
+              {
+                rules: [
+                  { required: true, message: '内容链接不能为空' },
+                  { whitespace: true, message: '内容链接不能为空' },
+                  { max: 300, massage: '内容链接最多30个字符' },
+                ],
+                initialValue:contentUrl,
+              },
+            ]"
+          />
+        </a-form-item>
+        <!-- 简介 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="简介"
+        >
+          <a-textarea
+            class="ml-3"
+            placeholder="简介"
+            style="height:80px"
+            v-decorator="[
+              'intro',
+              {
+                rules: [
+                  { required: true, message: '简介不能为空' },
+                  { whitespace: true, message: '简介不能为空' },
+                  { max: 140, massage: '简介最多140个字符' },
+                ],
+                initialValue:intro,
+              },
+            ]"
+          />
+        </a-form-item>
+        <!-- 封面图片 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="封面图片"
+        >
+          <div class="d-flex align-end ml-4" v-if="editData.picUrl">
+            <img :src="editData.picUrl" alt style="height:100px;" />
+            <div>
+              <a-icon @click="deleteFileList" class="ml-5" type="close-circle" />
+            </div>
+          </div>
+          <a-upload
+            :action="upload"
+            :before-upload="beforeUpload"
+            @change="handleChange"
+            class="ml-3"
+            list-type="picture"
+            name="files"
+          >
+            <a-button v-show="fileList.length - 0 === 0">
+              <a-icon type="upload" />选择封面图片
+            </a-button>
+          </a-upload>
+        </a-form-item>
+        <!-- 时间 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="时间"
+        >
+          <a-date-picker
+            class="ml-3"
+            show-time
+            v-decorator="[ 'times', { initialValue: times }, ]"
+          />
+          <!-- <a-date-picker class="ml-3" show-time /> -->
+        </a-form-item>
+        <!-- 类型 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="类型"
+        >
+          <a-select
+            class="ml-3"
+            default-value="视频"
+            style="width: 100%"
+            v-decorator="[ 'type', { initialValue: type }, ]"
+          >
+            <a-select-option
+              :key="index"
+              :value="index + 1"
+              v-for="(item, index) in recStatusList"
+            >{{ item }}</a-select-option>
+          </a-select>
+        </a-form-item>
+        <!-- 栏目 -->
+        <a-form-item
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol"
+          label="栏目"
+        >
+          <a-checkbox-group class="ml-3" v-decorator="[ 'banner', { initialValue:banner, }, ]">
+            <a-checkbox
+              :key="index"
+              :value="item.moldId"
+              class="my-2"
+              v-for="(item, index) in bannersList"
+            >{{ item.moldName }}</a-checkbox>
+          </a-checkbox-group>
+        </a-form-item>
+        <a-form-item class="d-flex flex-row-reverse">
+          <a-button @click="$emit('closeModal')" class="mr-3">取消</a-button>
+          <a-button class="white--text" html-type="submit" type="primary">保存</a-button>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import { upload, academyUpdate, queryMold } from 'config/api';
+
+const formItemLayout = {
+  labelCol: { span: 6 },
+  wrapperCol: { span: 16 },
+};
+
+const tailItemLayout = { wrapperCol: { span: 16, offset: 6 } };
+
+export default {
+  name: 'CollegeEdit',
+  props: {
+    editVisible: { type: Boolean, default: false },
+    editData: { type: Object, default: () => {} },
+  },
+  data() {
+    return {
+      formItemLayout,
+      tailItemLayout,
+      form: this.$form.createForm(this, { name: 'college-edit' }),
+      upload: upload,
+      fileList: [],
+      //限制文件上传的格式和大小
+      beforeUpload: file => {
+        const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
+        if (!isJpgOrPng) {
+          this.$message.error('仅支持 JPG/PNG 格式的图片!');
+        }
+        return isJpgOrPng;
+      },
+      recStatusList: ['视频', '音频', 'PPT'],
+      bannersList: [],
+      banner: [],
+      title: '',
+      contentUrl: '',
+      intro: '',
+      times: '',
+      type: 1,
+    };
+  },
+  created() {
+    this.getQueryMold();
+    // this.from = this.editData
+    (this.title = this.editData.title), (this.contentUrl = this.editData.contentUrl);
+    this.intro = this.editData.intro;
+    this.times = this.editData.times;
+    this.type = this.editData.type;
+    this.banner = this.editData.moldIds;
+    this.fileList.push(this.editData.coverPicture);
+    console.log('======>collegeEdit');
+  },
+  methods: {
+    // 删除fileList
+    deleteFileList() {
+      console.log('进入事件');
+      this.fileList = [];
+      this.editData.picUrl = '';
+    },
+    changeTime(e) {
+      return this.$moment(e).format('YYYY-MM-DD HH:mm:ss');
+    },
+    // 上传图片事件
+    handleChange(info) {
+      // this.fileList = fileList;
+      console.log(info);
+      if (info.file.status === 'done') {
+        this.fileList.push(info.file.response.data[0].id);
+      } else if (info.file.status === 'removed') {
+        this.fileList = info.fileList;
+      }
+    },
+
+    async getQueryMold() {
+      try {
+        const res = await queryMold();
+        const { code, msg, data } = res.data;
+        if (code === 200) {
+          this.bannersList = data;
+        } else {
+          this.$message.error(msg);
+        }
+      } catch (error) {
+        this.$message.error(error);
+      }
+    },
+    // 提交表单
+    handleSubmit(e) {
+      e.preventDefault();
+      this.form.validateFieldsAndScroll(async (err, values) => {
+        if (!err) {
+          if (this.fileList.length > 0 || this.editData.picUrl) {
+            try {
+              console.log('handleSubmit', values);
+              const params = {
+                param: {
+                  academyId: this.editData.academyId,
+                  banners: values.banner,
+                  contentUrl: values.contentUrl,
+                  coverPicture: this.fileList[0] || this.editData.coverPicture,
+                  intro: values.intro,
+                  times: this.changeTime(values.times._d),
+                  title: values.title,
+                  type: values.type,
+                },
+              };
+              const res = await academyUpdate(params);
+              const { data, msg, code } = res.data;
+              if (code === 200) {
+                this.$emit('getData');
+                this.$emit('closeModal');
+                this.$message.success('保存成功');
+              } else {
+                throw msg;
+              }
+            } catch (error) {
+              this.$message.error(error || '添加失败');
+            }
+          } else {
+            this.$message.error('请上传图片');
+          }
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style scoped lang="stylus"></style>

src/views/College/components/CollegeSearch.vue

@@ -0,0 +1,88 @@
+<template>
+  <div class="d-flex flex-wrap pb-3">
+    <div>
+      <a-input placeholder="标题" style="width: 150px" v-model="title" allow-clear />
+      <span class="ml-3"> 类型:</span>
+      <a-select @change="handleChangeSelect" class="ml-3" style="width: 150px" placeholder="类型" allow-clear>
+        <a-select-option :key="item" :value="index + 1" v-for="(item, index) in statusList">{{ item }}</a-select-option>
+      </a-select>
+      <span class="ml-3"> 栏目:</span>
+      <a-checkbox-group class="ml-3" @change="onChange">
+        <a-checkbox class="my-2" v-for="(item, index) in bannersList" :key="index" :value="item.moldId">{{ item.moldName }}</a-checkbox>
+      </a-checkbox-group>
+
+      <a-button @click="handleTableChange" class="mx-2" type="primary">搜索</a-button>
+    </div>
+
+    <div class="flex-1"></div>
+
+    <a-button type="primary" @click="showModal" class="editable-add-btn">增加</a-button>
+
+    <!-- 添加 -->
+    <college-add :visible="visible" @closeModal="closeModal" @handleTableChange="handleTableChange" />
+  </div>
+</template>
+
+<script>
+import CollegeAdd from './CollegeAdd.vue';
+import { queryMold } from 'config/api';
+
+export default {
+  name: 'CollegeSearch',
+  components: { CollegeAdd },
+  data() {
+    return {
+      visible: false,
+      title: '',
+      statusList: ['视频', '音频', 'ppt'],
+      bannersList: [],
+      banner: [],
+      type: '',
+    };
+  },
+  created() {
+    this.getQueryMold();
+  },
+  methods: {
+    onChange(e) {
+      this.banner = e;
+    },
+
+    showModal() {
+      this.visible = true;
+    },
+
+    closeModal() {
+      this.visible = false;
+    },
+
+    handleChangeSelect(e) {
+      // this[type] = value;
+      this.type = e;
+    },
+
+    async handleTableChange() {
+      const { title, type, banner } = this;
+      // 传参
+      const condition = { title, type, banner };
+      await this.$emit('getListData', condition);
+    },
+    async getQueryMold() {
+      try {
+        const res = await queryMold();
+        const { code, msg, data } = res.data;
+        if (code === 200) {
+          this.bannersList = data;
+        } else {
+          this.$message.error(msg);
+        }
+      } catch (error) {
+        this.$message.error(error);
+      }
+    },
+  },
+};
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped lang="stylus"></style>