对接后端接口

package.json

@@ -10,6 +10,7 @@
   "dependencies": {
     "axios": "^0.19.2",
     "core-js": "^3.6.4",
+    "dayjs": "^1.8.23",
     "md5": "^2.2.1",
     "qs": "^6.9.1",
     "vant": "^2.5.5",

src/api/index.js

 import httpRequest from '@/utils/axios'
 
 // 获取事务类型列表
-export function getType(params) {
+export function getAffairType(params) {
   return httpRequest({
     url: '/v2/lobby/affairs',
     method: 'get',
     params
   })
 }
+// 获取事务列表
+export function getAffairList(params) {
+  return httpRequest({
+    url: '/v2/lobby/processes',
+    method: 'get',
+    params
+  })
+}
+// 获取事务详情
+export function getAffair(id) {
+  return httpRequest({
+    url: `/v2/lobby/processes/${id}`,
+    method: 'get'
+  })
+}
+// 创建事务
+export function createAffair(data) {
+  return httpRequest({
+    url: '/v2/lobby/processes',
+    method: 'post',
+    data
+  })
+}
+// 更新事务
+export function updateAffair(id, data) {
+  return httpRequest({
+    url: `/v2/lobby/processes/${id}`,
+    method: 'post',
+    data
+  })
+}
+// 删除事务
+export function deleteAffair(id) {
+  return httpRequest({
+    url: `/v2/lobby/processes/${id}`,
+    method: 'delete'
+  })
+}
+// 上传文件
+export function upload(data) {
+  return httpRequest({
+    url: '/v2/lobby/tools/upload',
+    method: 'post',
+    headers: {
+      'Content-Type': 'multipart/form-data'
+    },
+    data
+  })
+}
+// 获取学期
+export function getSemesters(params) {
+  return httpRequest({
+    url: '/v2/lobby/semesters',
+    method: 'get',
+    params
+  })
+}
+// 获取课程
+export function getCourses(data) {
+  return httpRequest({
+    url: `/v2/lobby/semesters/${data.id}/courses`,
+    method: 'get'
+  })
+}

src/components/Card.vue

 <template>
   <div class="card">
-    <div class="card-title">{{ data.title }}</div>
+    <div class="card-title">{{ data.form[title.name] }}</div>
     <div class="card-main">
       <div class="card-content">
-        <div class="p-item" v-for="item in fields" :key="item.name">
-          <div class="p-title">{{ item.label }}：</div>
-          <div class="p-content">{{ data[item.name] }}</div>
+        <template v-for="item in fields">
+          <div class="p-item" :key="item.name">
+            <div class="p-title">{{ item.label }}：</div>
+            <div class="p-content">{{ data.form[item.name] }}</div>
+          </div>
+        </template>
+        <div class="p-item">
+          <div class="p-title">审核状态：</div>
+          <div class="p-content is-red">{{ data.status }}</div>
+        </div>
+        <div class="p-item">
+          <div class="p-title">审核时间：</div>
+          <div class="p-content">{{ data.apply_time }}</div>
+        </div>
+        <div class="p-item" v-if="data.remark">
+          <div class="p-title">备注：</div>
+          <div class="p-content is-red">{{ data.remark }}}</div>
         </div>
       </div>
       <div class="card-aside">
@@ -26,6 +40,12 @@ export default {
   name: 'Card',
   props: {
     data: Object,
+    title: {
+      type: Object,
+      default() {
+        return {}
+      }
+    },
     fields: {
       type: Array,
       default() {
@@ -35,7 +55,10 @@ export default {
   },
   methods: {
     onEdit() {
-      this.$router.push({ name: 'create', query: this.$route.query })
+      this.$router.push({
+        name: 'edit',
+        query: Object.assign({}, this.$route.query, { view_id: this.data.id })
+      })
     },
     onRemove() {
       this.$emit('remove', this.data)
@@ -51,7 +74,7 @@ export default {
   box-shadow: 0px 3px 15px 0px rgba(0, 0, 0, 0.06);
 }
 .is-red {
-  color: #ab2824;
+  color: #ab2824 !important;
 }
 .card-title {
   font-size: 15px;

src/components/Form.vue

@@ -9,24 +9,36 @@
     <template v-for="(item, index) in fields">
       <div class="form-item" :key="index">
         <!-- 时间 -->
-        <template v-if="item.fieldType === 'datetime'">
+        <template v-if="item.fieldType === 'date'">
           <van-field
             readonly
             clickable
             :border="false"
             v-bind="item"
             v-model="ruleForm[item.name]"
-            @click="showDatetimePicker(item.name)"
+            @click="showPicker(item)"
+          />
+        </template>
+        <!-- 选择 -->
+        <template v-else-if="item.fieldType === 'select'">
+          <van-field
+            readonly
+            clickable
+            :border="false"
+            v-bind="item"
+            v-model="ruleForm[item.name]"
+            @click="showPicker(item)"
           />
         </template>
         <!-- 上传图片 -->
         <van-field
           :border="false"
-          :label="item.label"
+          v-bind="item"
+          v-model="ruleForm[item.name]"
           v-else-if="item.fieldType === 'uploader'"
         >
           <template #input>
-            <van-uploader v-model="ruleForm[item.name]" />
+            <upload v-model="ruleForm[item.name]" :max-count="1" />
           </template>
         </van-field>
         <!-- 文本框 -->
@@ -36,13 +48,21 @@
           v-model="ruleForm[item.name]"
           v-else
         />
-        <van-popup v-model="timePickerVisible" position="bottom">
+        <van-popup v-model="pickerVisible" position="bottom">
           <van-datetime-picker
-            type="datetime"
-            :value="timePickerValue"
+            type="date"
+            :value="pickerValue"
             :min-date="minDate"
-            @confirm="handleTimePickerConfirm"
-            @cancel="timePickerVisible = false"
+            @confirm="onTimePickerConfirm"
+            @cancel="pickerVisible = false"
+            v-if="pickerType === 'date'"
+          />
+          <van-picker
+            show-toolbar
+            :columns="pickerColumns"
+            @confirm="onPickerConfirm"
+            @cancel="pickerVisible = false"
+            v-if="pickerType === 'select'"
           />
         </van-popup>
       </div>
@@ -51,10 +71,14 @@
 </template>
 
 <script>
+import dayjs from 'dayjs'
+import Upload from '@/components/Upload'
+
 export default {
   name: 'VForm',
+  components: { Upload },
   props: {
-    params: {
+    model: {
       type: Object,
       default() {
         return {}
@@ -68,27 +92,68 @@ export default {
       }
     }
   },
+  watch: {
+    model: {
+      immediate: true,
+      deep: true,
+      handler(value) {
+        this.ruleForm = value
+      }
+    }
+  },
   data() {
     return {
-      ruleForm: this.params,
-      timePickerVisible: false,
-      timePickerName: '',
-      timePickerValue: '',
-      minDate: new Date()
+      ruleForm: this.model,
+      pickerVisible: false,
+      pickerType: '',
+      pickerName: '',
+      pickerValue: '',
+      pickerList: [],
+      pickerColumns: [],
+      minDate: new Date(),
+      pickerRemote: null,
+      pickerActive: {}
     }
   },
   methods: {
-    showDatetimePicker(name) {
-      this.timePickerVisible = true
-      this.timePickerName = name
-      this.timePickerValue = this.ruleForm[name]
+    showPicker({ fieldType, name, remote }) {
+      this.pickerVisible = true
+      this.pickerName = name
+      this.pickerType = fieldType
+      this.pickerValue = this.ruleForm[name]
+      if (fieldType === 'select') {
+        if (remote) {
+          this.pickerColumns = []
+        }
+        this.pickerRemote = remote
+        this.getSelectList(remote)
+      }
+    },
+    onPickerConfirm(value) {
+      this.ruleForm[this.pickerName] = value
+      this.pickerVisible = false
+      if (this.pickerRemote && this.pickerRemote.change) {
+        this.pickerActive = this.pickerList.find(
+          item => item[this.pickerRemote.valueKey] === value
+        )
+      }
     },
-    handleTimePickerConfirm(time) {
-      this.ruleForm[this.timePickerName] = time
-      this.timePickerVisible = false
+    onTimePickerConfirm(time) {
+      this.ruleForm[this.pickerName] = dayjs(time).format('YYYY-MM-DD')
+      this.pickerVisible = false
     },
     submit() {
       return this.$refs.form.submit()
+    },
+    getSelectList(remote) {
+      if (!remote) {
+        return
+      }
+      remote.request(this.pickerActive).then(response => {
+        const data = response.data
+        this.pickerList = data
+        this.pickerColumns = data.map(item => item[remote.valueKey])
+      })
     }
   }
 }

src/components/Layout.vue

@@ -8,14 +8,17 @@
           </div>
           <ul class="menu-list">
             <li @click="toPage({ name: 'channel' })">首页</li>
-            <li @click="toPage({ name: 'list', query: { channel: '1' } })">
-              学术活动
-            </li>
-            <li @click="toPage({ name: 'list', query: { channel: '2' } })">
-              乐分享
-            </li>
-            <li @click="toPage({ name: 'list', query: { channel: '3' } })">
-              重修
+            <li
+              v-for="item in menuList"
+              :key="item.id"
+              @click="
+                toPage({
+                  name: 'list',
+                  query: { channel: item.form_name, channel_id: item.id }
+                })
+              "
+            >
+              {{ item.affair_name }}
             </li>
             <li @click="$router.back()">返回上一页</li>
           </ul>
@@ -29,11 +32,13 @@
 </template>
 
 <script>
+import * as api from '@/api/index'
 export default {
   name: 'PageContainer',
   data() {
     return {
-      menuVisible: false
+      menuVisible: false,
+      menuList: []
     }
   },
   methods: {
@@ -46,7 +51,15 @@ export default {
         name: route.name,
         query: Object.assign({}, this.$route.query, route.query)
       })
+    },
+    getList() {
+      api.getAffairType().then(response => {
+        this.menuList = response
+      })
     }
+  },
+  beforeMount() {
+    this.getList()
   }
 }
 </script>
@@ -57,15 +70,21 @@ export default {
 }
 .menu .inner {
   position: fixed;
-  top: 0;
   left: 0;
+  top: 0;
   right: 0;
+  min-width: 70px;
+  max-width: 750px;
   height: 60px;
-  padding: 20px 30px;
+  margin: 0 auto;
+  padding: 0 30px;
   z-index: 100;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
   background-color: #fff;
-  max-width: 750px;
-  margin: 0 auto;
+  border-top-left-radius: 30px;
+  border-bottom-left-radius: 30px;
 }
 .menu.is-show {
   .menu-list {
@@ -82,8 +101,6 @@ export default {
   }
 }
 .menu-icon {
-  position: absolute;
-  right: 30px;
   width: 20px;
   height: 18px;
   cursor: pointer;

src/components/Upload.vue

+<template>
+  <van-uploader
+    v-model="fileList"
+    :after-read="afterRead"
+    @delete="onDelete"
+    v-bind="$attrs"
+  />
+</template>
+
+<script>
+import { upload } from '@/api/index'
+
+export default {
+  name: 'Upload',
+  props: { value: String },
+  data() {
+    return { fileList: [] }
+  },
+  watch: {
+    value: {
+      immediate: true,
+      handler(value) {
+        this.fileList = value ? [{ url: value }] : []
+      }
+    }
+  },
+  methods: {
+    afterRead(file) {
+      file.status = 'uploading'
+      file.message = '上传中...'
+      let formData = new FormData()
+      formData.append('file', file.file)
+      upload(formData)
+        .then(response => {
+          if (response.success) {
+            file.status = 'done'
+            this.$emit('input', response.url)
+          } else {
+            file.status = 'failed'
+            file.message = '上传失败'
+          }
+        })
+        .catch(error => {
+          console.log(error)
+          file.status = 'failed'
+          file.message = '上传失败'
+        })
+    },
+    onDelete() {
+      this.$emit('input', '')
+    }
+  }
+}
+</script>

src/main.js

 import Vue from 'vue'
 import App from './App.vue'
-import router from './router/index.js'
+import router from './router'
 import store from '@/store'
 
 // vue-meta
@@ -40,12 +40,11 @@ Vue.use(RadioGroup)
 import { DatetimePicker } from 'vant'
 Vue.use(DatetimePicker)
 
+import { Picker } from 'vant'
+Vue.use(Picker)
+
 import { Uploader } from 'vant'
 Vue.use(Uploader)
-
-import { List } from 'vant'
-Vue.use(List)
-
 // 公共css
 import '@/assets/css/base.css'
 

src/pages.js

+import * as api from '@/api/index'
+
+// 学术活动
+const symposiumForm = {
+  fields: [
+    {
+      name: 'symposium_name',
+      label: '名称',
+      required: true,
+      placeholder: '请输入学术活动名称',
+      rules: [{ required: true, message: '请输入学术活动名称' }]
+    },
+    {
+      fieldType: 'date',
+      name: 'symposium_time',
+      label: '时间',
+      required: true,
+      placeholder: '请选择学术活动时间',
+      rules: [{ required: true, message: '请选择学术活动时间' }]
+    },
+    {
+      name: 'symposium_lecturer',
+      label: '主讲人',
+      required: true,
+      placeholder: '请输入主讲人姓名',
+      rules: [{ required: true, message: '请输入主讲人姓名' }]
+    },
+    {
+      name: 'symposium_address',
+      label: '地址',
+      required: true,
+      placeholder: '请输入活动地址',
+      rules: [{ required: true, message: '请输入活动地址' }]
+    },
+    {
+      type: 'textarea',
+      name: 'symposium_contents',
+      label: '内容',
+      required: true,
+      placeholder: '请输入学术活动内容',
+      autosize: { maxHeight: 200, minHeight: 140 },
+      rules: [{ required: true, message: '请输入学术活动内容' }]
+    }
+  ]
+}
+
+// 乐分享
+const sharingForm = {
+  fields: [
+    {
+      name: 'personal_name',
+      label: '姓名',
+      required: true,
+      placeholder: '请输入姓名',
+      rules: [{ required: true, message: '请输入姓名' }]
+    },
+    {
+      name: 'trade_name',
+      label: '行业',
+      required: true,
+      placeholder: '请输入行业',
+      rules: [{ required: true, message: '请输入行业' }]
+    },
+    {
+      name: 'age',
+      label: '年龄',
+      required: true,
+      placeholder: '请输入年龄',
+      rules: [{ required: true, message: '请输入年龄' }]
+    },
+    {
+      name: 'class_name',
+      label: '班级',
+      required: true,
+      placeholder: '请输入班级',
+      rules: [{ required: true, message: '请输入班级' }]
+    },
+    {
+      type: 'tel',
+      name: 'telephone',
+      label: '电话',
+      required: true,
+      placeholder: '请输入电话',
+      rules: [{ required: true, message: '请输入电话' }]
+    },
+    {
+      name: 'sharing_theme',
+      label: '主题',
+      required: true,
+      placeholder: '请输入乐分享内容',
+      rules: [{ required: true, message: '请输入分享主题' }]
+    }
+  ]
+}
+
+// 重修
+const retakeForm = {
+  fields: [
+    {
+      name: 'personal_name',
+      label: '姓名',
+      required: true,
+      placeholder: '请输入姓名',
+      rules: [{ required: true, message: '请输入姓名' }]
+    },
+    {
+      name: 'class_name',
+      label: '班级',
+      required: true,
+      placeholder: '请输入班级',
+      rules: [{ required: true, message: '请输入班级' }]
+    },
+    {
+      fieldType: 'select',
+      name: 'semester_name',
+      label: '挂科学期',
+      required: true,
+      placeholder: '请选择挂科学期',
+      rules: [{ required: true, message: '请选择挂科学期' }],
+      remote: {
+        request: api.getSemesters,
+        valueKey: 'semester_name',
+        change: 'course_name'
+      }
+    },
+    {
+      fieldType: 'select',
+      name: 'course_name',
+      label: '重修课程',
+      required: true,
+      placeholder: '请选择重修课程',
+      rules: [{ required: true, message: '请选择重修课程' }],
+      remote: {
+        request: api.getCourses,
+        valueKey: 'course_name'
+      }
+    },
+    {
+      fieldType: 'uploader',
+      name: 'payment_instrument',
+      label: '上传缴费凭证',
+      required: true,
+      placeholder: '请上传缴费凭证',
+      rules: [{ required: true, message: '请上传缴费凭证' }]
+    }
+  ]
+}
+export default {
+  // 学术活动
+  symposium: {
+    list: {
+      title: '学术活动',
+      emptyText: '您还没有申请过学术活动',
+      buttonText: '申请新的活动',
+      card: {
+        title: { name: 'symposium_name' },
+        fields: [
+          { name: 'symposium_time', label: '活动时间' },
+          { name: 'symposium_lecturer', label: '主讲人' }
+        ]
+      }
+    },
+    create: {
+      title: '申请新的学术活动',
+      tips:
+        '温馨提示：学生自发组织的各类校友活动，包括并不限于：论坛、讲座、沙龙、参访、拓展、游学等，接受紫荆-索菲亚金融方向工商管理硕士学位中心的监督与指导。',
+      buttonText: '提交',
+      form: symposiumForm
+    },
+    edit: {
+      title: '编辑学术活动',
+      tips:
+        '温馨提示：学生自发组织的各类校友活动，包括并不限于：论坛、讲座、沙龙、参访、拓展、游学等，接受紫荆-索菲亚金融方向工商管理硕士学位中心的监督与指导。',
+      buttonText: '提交',
+      form: symposiumForm
+    }
+  },
+  // 乐分享
+  sharing: {
+    list: {
+      title: '乐分享',
+      emptyText: '您还没有申请过乐分享',
+      buttonText: '申请新的分享',
+      card: {
+        title: { name: 'sharing_theme' },
+        fields: [
+          { name: 'class_name', label: '班级' },
+          { name: 'personal_name', label: '申请人' },
+          { name: 'telephone', label: '电话' }
+        ]
+      }
+    },
+    create: {
+      title: '申请新的分享',
+      buttonText: '提交',
+      form: sharingForm
+    },
+    edit: {
+      title: '编辑乐分享',
+      buttonText: '提交',
+      form: sharingForm
+    }
+  },
+  // 重修
+  retake: {
+    list: {
+      title: '重修',
+      emptyText: '您还没有申请过重修',
+      buttonText: '申请重修',
+      card: {
+        fields: [
+          { name: 'class_name', label: '班级' },
+          { name: 'semester_name', label: '挂科学期' },
+          { name: 'course_name', label: '课程名称' }
+        ]
+      }
+    },
+    create: {
+      title: '申请重修',
+      buttonText: '提交',
+      form: retakeForm
+    },
+    edit: {
+      title: '编辑重修',
+      buttonText: '提交',
+      form: retakeForm
+    }
+  }
+}

src/router.js

-import Vue from 'vue'
-import VueRouter from 'vue-router'
-
-// 账号
-import account from './views/account/router.js'
-// 频道
-import channel from './views/channel/router.js'
-// 学术活动
-import learn from './views/learn/router.js'
-// 乐分享
-import share from './views/share/router.js'
-// 重修
-import rebuild from './views/rebuild/router.js'
-
-Vue.use(VueRouter)
-
-const routes = [
-  { path: '/', redirect: '/channel' },
-  ...account,
-  ...channel,
-  ...learn,
-  ...share,
-  ...rebuild
-]
-
-const router = new VueRouter({
-  mode: 'history',
-  base: process.env.BASE_URL,
-  routes
-})
-
-export default router

src/utils/axios.js

@@ -6,7 +6,11 @@ import router from '@/router'
 const httpRequest = axios.create({
   baseURL: process.env.VUE_APP_BASE_API,
   timeout: 60000,
-  headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
+  headers: {
+    'Content-Type': 'application/x-www-form-urlencoded',
+    tenant: 'sofia',
+    token: localStorage.getItem('token')
+  }
 })
 
 // 请求拦截
@@ -31,8 +35,10 @@ httpRequest.interceptors.response.use(
   },
   function(error) {
     if (error.response) {
-      const { status } = error.response.data
-      if (status === 403) {
+      const { status, message } = error.response.data
+      if (status === 400) {
+        Toast({ type: 'error', message: message })
+      } else if (status === 403) {
         router.replace({
           path: '/login',
           query: { redirect_uri: encodeURIComponent(window.location.href) }

src/utils/pages.js

-export default {
-  // 学术活动
-  1: {
-    list: {
-      title: '学术活动',
-      emptyText: '您还没有申请过学术活动',
-      buttonText: '申请新的活动',
-      card: {
-        fields: [
-          { name: 'time', label: '活动时间' },
-          { name: 'user', label: '主讲人' },
-          { name: 'status', label: '审核状态' },
-          { name: 'time2', label: '审核时间' },
-          { name: 'beizhu', label: '备注' }
-        ]
-      }
-    },
-    create: {
-      title: '申请新的学术活动',
-      tips:
-        '温馨提示：学生自发组织的各类校友活动，包括并不限于：论坛、讲座、沙龙、参访、拓展、游学等，接受紫荆-索菲亚金融方向工商管理硕士学位中心的监督与指导。',
-      buttonText: '提交',
-      form: {
-        fields: [
-          {
-            name: 'name',
-            label: '名称',
-            required: true,
-            placeholder: '请输入学术活动名称',
-            rules: [{ required: true, message: '请输入学术活动名称' }]
-          },
-          {
-            fieldType: 'datetime',
-            name: 'time',
-            label: '时间',
-            required: true,
-            placeholder: '请选择学术活动时间',
-            rules: [{ required: true, message: '请选择学术活动时间' }]
-          },
-          {
-            name: 'user',
-            label: '主讲人',
-            required: true,
-            placeholder: '请输入主讲人姓名',
-            rules: [{ required: true, message: '请输入主讲人姓名' }]
-          },
-          {
-            name: 'address',
-            label: '地址',
-            required: true,
-            placeholder: '请输入活动地址',
-            rules: [{ required: true, message: '请输入活动地址' }]
-          },
-          {
-            type: 'textarea',
-            name: 'content',
-            label: '内容',
-            required: true,
-            placeholder: '请输入学术活动内容',
-            rules: [{ required: true, message: '请输入学术活动内容' }]
-          }
-        ]
-      }
-    },
-    edit: {}
-  },
-  // 乐分享
-  2: {
-    list: {
-      title: '乐分享',
-      emptyText: '您还没有申请过乐分享',
-      buttonText: '申请新的分享',
-      card: {
-        fields: [
-          { name: 'time', label: '班级' },
-          { name: 'user', label: '申请人' },
-          { name: 'tel', label: '电话' },
-          { name: 'status', label: '审核状态' },
-          { name: 'time2', label: '审核时间' },
-          { name: 'beizhu', label: '备注' }
-        ]
-      }
-    },
-    create: {
-      title: '申请新的分享',
-      buttonText: '提交',
-      form: {
-        fields: [
-          {
-            name: 'name',
-            label: '姓名',
-            required: true,
-            placeholder: '请输入姓名',
-            rules: [{ required: true, message: '请输入姓名' }]
-          },
-          {
-            name: 'type',
-            label: '行业',
-            required: true,
-            placeholder: '请输入行业',
-            rules: [{ required: true, message: '请输入行业' }]
-          },
-          {
-            name: 'age',
-            label: '年龄',
-            required: true,
-            placeholder: '请输入年龄',
-            rules: [{ required: true, message: '请输入年龄' }]
-          },
-          {
-            name: 'level',
-            label: '班级',
-            required: true,
-            placeholder: '请输入班级',
-            rules: [{ required: true, message: '请输入班级' }]
-          },
-          {
-            type: 'tel',
-            name: 'tel',
-            label: '电话',
-            required: true,
-            placeholder: '请输入电话',
-            rules: [{ required: true, message: '请输入电话' }]
-          },
-          {
-            type: 'textarea',
-            name: 'content',
-            label: '内容',
-            required: true,
-            placeholder: '请输入乐分享内容',
-            rules: [{ required: true, message: '请输入乐分享内容' }]
-          }
-        ]
-      }
-    },
-    edit: {}
-  },
-  // 重修
-  3: {
-    list: {
-      title: '重修',
-      emptyText: '您还没有申请过重修',
-      buttonText: '申请重修',
-      card: {
-        fields: [
-          { name: 'time', label: '班级' },
-          { name: 'user', label: '挂科学期' },
-          { name: 'status', label: '审核状态' },
-          { name: 'time2', label: '审核时间' },
-          { name: 'beizhu', label: '备注' }
-        ]
-      }
-    },
-    create: {
-      title: '申请重修',
-      buttonText: '提交',
-      form: {
-        fields: [
-          {
-            name: 'name',
-            label: '姓名',
-            required: true,
-            placeholder: '请输入姓名',
-            rules: [{ required: true, message: '请输入姓名' }]
-          },
-          {
-            name: 'level',
-            label: '班级',
-            required: true,
-            placeholder: '请输入班级',
-            rules: [{ required: true, message: '请输入班级' }]
-          },
-          {
-            name: 'level',
-            label: '挂科学期',
-            required: true,
-            placeholder: '请选择挂科学期',
-            rules: [{ required: true, message: '请选择挂科学期' }]
-          },
-          {
-            name: 'tel',
-            label: '重修课程名称',
-            required: true,
-            placeholder: '请选择重修课程名称',
-            rules: [{ required: true, message: '请选择重修课程名称' }]
-          },
-          {
-            fieldType: 'uploader',
-            name: 'uploader',
-            label: '上传缴费凭证',
-            required: true,
-            placeholder: '请上传缴费凭证',
-            rules: [{ required: true, message: '请上传缴费凭证' }]
-          }
-        ]
-      }
-    },
-    edit: {}
-  }
-}

src/views/Channel.vue

@@ -4,7 +4,7 @@
     <div class="choose-list">
       <van-radio-group v-model="radio">
         <div class="choose-item" v-for="item in list" :key="item.value">
-          <van-radio :name="item.value">{{ item.label }}</van-radio>
+          <van-radio :name="item.id">{{ item.affair_name }}</van-radio>
         </div>
       </van-radio-group>
     </div>
@@ -20,24 +20,33 @@ import * as api from '@/api/index'
 export default {
   data() {
     return {
-      list: [
-        { value: '1', label: '学术活动' },
-        { value: '2', label: '乐分享' },
-        { value: '3', label: '重修' }
-      ],
-      radio: '1'
+      list: [],
+      radio: ''
+    }
+  },
+  computed: {
+    currentItem() {
+      return this.list.find(item => item.id === this.radio)
     }
   },
   methods: {
     toListPage() {
+      if (!this.radio) {
+        return
+      }
       this.$router.push({
         name: 'list',
-        query: Object.assign(this.$route.query, { channel: this.radio })
+        query: Object.assign(this.$route.query, {
+          channel: this.currentItem.form_name,
+          channel_id: this.radio
+        })
       })
     },
     getList() {
-      api.getType().then(response => {
-        console.log(response)
+      api.getAffairType().then(response => {
+        let [first] = response
+        this.radio = first.id
+        this.list = response
       })
     }
   },

src/views/Create.vue

@@ -4,15 +4,16 @@
     <v-form ref="form" :fields="page.form.fields" @submit="onSubmit"></v-form>
     <div class="fixed-box">
       <div class="fixed-inner">
-        <div class="fixed-button" @click="onSubmit">提交</div>
+        <div class="fixed-button" @click="handleSubmit">提交</div>
       </div>
     </div>
   </div>
 </template>
 
 <script>
-import pages from '@/utils/pages.js'
+import pages from '@/pages'
 import VForm from '@/components/Form'
+import * as api from '@/api/index'
 
 export default {
   name: 'Create',
@@ -50,12 +51,23 @@ export default {
     page() {
       const channel = this.$route.query.channel
       return pages[channel] ? pages[channel]['create'] : {}
+    },
+    channelId() {
+      return this.$route.query.channel_id
     }
   },
   methods: {
-    onSubmit() {
+    handleSubmit() {
       this.$refs.form.submit()
-      console.log(this.form)
+    },
+    onSubmit() {
+      let data = this.$refs.form.ruleForm
+      data.affair_id = this.channelId
+      api.createAffair(data).then(() => {
+        this.$dialog.alert({ message: '提交成功' }).then(() => {
+          this.$router.push({ name: 'list', query: this.$route.query })
+        })
+      })
     }
   }
 }

src/views/Edit.vue

 <template>
   <div class="main">
     <div class="form-tips">{{ page.tips }}</div>
-    <v-form ref="form" :fields="page.form.fields" @submit="onSubmit"></v-form>
+    <v-form
+      ref="form"
+      :model="formModel"
+      :fields="page.form.fields"
+      @submit="onSubmit"
+    ></v-form>
     <div class="fixed-box">
       <div class="fixed-inner">
-        <div class="fixed-button" @click="onSubmit">提交</div>
+        <div class="fixed-button" @click="handleSubmit">提交</div>
       </div>
     </div>
   </div>
 </template>
 
 <script>
-import pages from '@/utils/pages.js'
+import pages from '@/pages'
 import VForm from '@/components/Form'
+import * as api from '@/api/index'
 
 export default {
-  name: 'Create',
+  name: 'Edit',
   components: { VForm },
   metaInfo() {
     return {
@@ -23,7 +29,9 @@ export default {
     }
   },
   data() {
-    return {}
+    return {
+      formModel: {}
+    }
   },
   watch: {
     $route: {
@@ -49,14 +57,36 @@ export default {
     // 页面配置
     page() {
       const channel = this.$route.query.channel
-      return pages[channel] ? pages[channel]['create'] : {}
+      return pages[channel] ? pages[channel]['edit'] : {}
+    },
+    channelId() {
+      return this.$route.query.channel_id
+    },
+    viewId() {
+      return this.$route.query.view_id
     }
   },
   methods: {
-    onSubmit() {
+    handleSubmit() {
       this.$refs.form.submit()
-      console.log(this.form)
+    },
+    onSubmit() {
+      let data = this.$refs.form.ruleForm
+      data.affair_id = this.channelId
+      api.updateAffair(this.viewId, data).then(() => {
+        this.$dialog.alert({ message: '修改成功' }).then(() => {
+          this.$router.push({ name: 'list', query: this.$route.query })
+        })
+      })
+    },
+    getDetail() {
+      api.getAffair(this.viewId).then(response => {
+        this.formModel = response.form
+      })
     }
+  },
+  beforeMount() {
+    this.getDetail()
   }
 }
 </script>

src/views/List.vue

 <template>
   <div class="list">
-    <van-list
-      v-model="loading"
-      :finished="finished"
-      finished-text="没有更多了"
-      @load="onLoad"
-      v-if="list.length"
-    >
+    <template v-if="list.length">
       <card
         v-for="item in list"
-        :fields="page.card.fields"
         :data="item"
         :key="item.id"
+        v-bind="page.card"
         @remove="onRemove"
       ></card>
-    </van-list>
+    </template>
     <div class="empty" v-else>{{ page.emptyText }}</div>
     <div class="fixed-box">
       <div class="fixed-inner">
@@ -27,8 +21,10 @@
 </template>
 
 <script>
-import pages from '@/utils/pages.js'
+import pages from '@/pages'
 import Card from '@/components/Card.vue'
+import * as api from '@/api/index'
+
 export default {
   components: { Card },
   metaInfo() {
@@ -38,24 +34,7 @@ export default {
   },
   data() {
     return {
-      list: [
-        {
-          id: '0',
-          title: '金融沙龙活动',
-          time: '2020.02.10',
-          user: '王鹏飞',
-          time2: '2020.02.10'
-        },
-        {
-          id: '1',
-          title: '金融沙龙活动234234',
-          time: '2020.02.10',
-          user: '王鹏飞sdf',
-          time2: '2020.02.10'
-        }
-      ],
-      loading: false,
-      finished: true
+      list: []
     }
   },
   watch: {
@@ -83,17 +62,24 @@ export default {
     page() {
       const channel = this.$route.query.channel
       return pages[channel] ? pages[channel]['list'] : {}
+    },
+    channelId() {
+      return this.$route.query.channel_id
     }
   },
   methods: {
-    getList() {},
+    getList() {
+      api.getAffairList({ affair_id: this.channelId }).then(response => {
+        this.list = response
+      })
+    },
     onLoad() {
       this.getList()
     },
     toCreatePage() {
       this.$router.push({ name: 'create', query: this.$route.query })
     },
-    onRemove() {
+    onRemove(data) {
       this.$dialog
         .confirm({
           title: '提示',
@@ -101,12 +87,17 @@ export default {
           message: '确定删除'
         })
         .then(() => {
-          // on confirm
+          api.deleteAffair(data.id).then(() => {
+            this.getList()
+          })
         })
         .catch(() => {
           // on cancel
         })
     }
+  },
+  beforeMount() {
+    this.getList()
   }
 }
 </script>

src/views/Login.vue

@@ -101,6 +101,7 @@ export default {
     // 登录成功
     loginSuccess(response) {
       if (response.ticket) {
+        localStorage.setItem('token', response.ticket)
         if (this.redirectURI) {
           window.location.href = this.redirectURI
         } else {

src/views/account/components/Login.vue

-<template>
-  <div class="login">
-    <div class="login-hd">
-      <div class="logo" title="紫荆教育"></div>
-      <h2 class="login-title">欢迎回来</h2>
-    </div>
-    <div class="login-bd">
-      <div class="login-form">
-        <div class="login-form__item">
-          <input
-            type="text"
-            class="login-input"
-            placeholder="手机/邮箱/用户名"
-            v-model="form.account"
-          />
-        </div>
-        <div class="login-form__item">
-          <input
-            type="password"
-            class="login-input"
-            placeholder="密码"
-            v-model="form.password"
-          />
-        </div>
-        <div class="login-form__item">
-          <van-checkbox v-model="checked" shape="square"
-            >下次自动登录</van-checkbox
-          >
-        </div>
-        <div class="login-form__item">
-          <div class="login-button" @click="handleSubmit">登录</div>
-        </div>
-      </div>
-    </div>
-    <div class="login-ft">
-      <p class="login-tips">
-        登录遇到困难？请点击
-        <a href>找回密码</a>
-        <!-- <router-link :to="{ name: forgetPassword }">找回密码</router-link> -->
-      </p>
-    </div>
-  </div>
-</template>
-<script>
-export default {
-  data() {
-    return {
-      form: {
-        account: '',
-        password: ''
-      },
-      checked: false
-    }
-  },
-  methods: {
-    handleSubmit() {
-      if (!this.form.account) {
-        this.$notify('请输入手机/邮箱/用户名')
-      } else if (!this.form.password) {
-        this.$notify('请输入密码')
-      }
-    }
-  }
-}
-</script>
-<style lang="scss">
-.login {
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-}
-.logo {
-  width: 136px;
-  height: 44px;
-  background: url('~@/assets/img/logo.png') no-repeat;
-  background-size: contain;
-}
-.login-hd {
-  min-height: 170px;
-  padding: 30px 0 0 30px;
-  background: url('~@/assets/img/login_bg.png') no-repeat right top;
-  background-size: 152px 170px;
-}
-.login-title {
-  margin-top: 6px;
-  font-size: 50px;
-  color: #333;
-}
-.login-bd {
-  flex: 1;
-}
-.login-form {
-  padding: 40px 0 90px;
-  overflow: hidden;
-}
-.login-form__item {
-  padding: 0 30px;
-}
-.login-input {
-  padding: 0 20px;
-  width: 100%;
-  height: 40px;
-  font-size: 15px;
-  color: #999;
-  background: rgba(255, 255, 255, 1);
-  box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.06);
-  border-radius: 20px;
-  box-sizing: border-box;
-  margin-bottom: 30px;
-}
-.login-checkbox {
-  width: 15px;
-  height: 15px;
-  border: 1px solid rgba(153, 153, 153, 1);
-}
-.login-button {
-  float: right;
-  height: 60px;
-  padding-right: 90px;
-  font-size: 15px;
-  line-height: 60px;
-  background: url('~@/assets/img/login_button.png') no-repeat right center;
-  background-size: contain;
-  cursor: pointer;
-}
-.login-ft {
-  padding: 40px 0;
-}
-.login-tips {
-  text-align: center;
-  font-size: 12px;
-  color: #999;
-  a {
-    color: #1989fa;
-  }
-}
-</style>

src/views/account/router.js

-export default [
-  {
-    path: '/login',
-    meta: { title: '登录' },
-    component: () =>
-      import(/* webpackChunkName: "account" */ './components/Login.vue')
-  }
-]

src/views/channel/components/Index.vue

-<template>
-  <div class="choose">
-    <h2 class="choose-title">请选择事务</h2>
-    <div class="choose-list">
-      <van-radio-group v-model="radio">
-        <div class="choose-item" v-for="item in list" :key="item.value">
-          <van-radio :name="item.value">{{ item.label }}</van-radio>
-        </div>
-      </van-radio-group>
-    </div>
-    <div class="fixed-box">
-      <div class="fixed-inner">
-        <div class="fixed-button" @click="handClick">下一步</div>
-      </div>
-    </div>
-  </div>
-</template>
-<script>
-export default {
-  data() {
-    return {
-      list: [
-        { value: '1', label: '学术活动' },
-        { value: '2', label: '乐分享' },
-        { value: '3', label: '重修' }
-      ],
-      radio: '1'
-    }
-  },
-  methods: {
-    handClick() {
-      const map = {
-        1: 'learn',
-        2: 'share',
-        3: 'rebuild'
-      }
-      const routeName = map[this.radio]
-      this.$router.push({ name: routeName, query: this.$router.query })
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-.choose {
-  padding: 30px;
-}
-.choose-title {
-  font-size: 19px;
-  font-weight: normal;
-}
-.choose-list {
-  margin-top: 46px;
-}
-.choose-item {
-  margin-bottom: 50px;
-}
-</style>

src/views/channel/router.js

-export default [
-  {
-    path: '/channel',
-    meta: { title: '紫荆办事大厅' },
-    component: () => import('./components/Index.vue')
-  }
-]

src/views/learn/api.js

-import httpRequest from '@/utils/axios'
-
-// 登录
-export function login(data) {
-  return httpRequest({
-    url: '/api/login',
-    method: 'post',
-    data
-  })
-}

src/views/learn/components/Edit.vue

-<template>
-  <div class="main">
-    <div class="form-tips">
-      温馨提示：学生自发组织的各类校友活动，包括并不限于：论坛、讲座、沙龙、参访、拓展、游学等，接受紫荆-索菲亚金融方向工商管理硕士学位中心的监督与指导。
-    </div>
-    <van-form
-      @submit="onSubmit"
-      ref="form"
-      class="form"
-      validate-trigger="onChange"
-    >
-      <van-field
-        v-model="form.name"
-        label="名称"
-        required
-        placeholder="请输入学术活动名称"
-        :border="false"
-        :rules="[{ required: true, message: '请输入学术活动名称' }]"
-      />
-      <van-field
-        readonly
-        clickable
-        v-model="form.time"
-        label="时间"
-        required
-        placeholder="请选择学术活动时间"
-        :border="false"
-        :rules="[{ required: true, message: '请选择学术活动时间' }]"
-        @click="timePickerVisible = true"
-      />
-      <van-popup v-model="timePickerVisible" position="bottom">
-        <van-datetime-picker
-          type="datetime"
-          :value="form.time"
-          :min-date="minDate"
-          @confirm="handleTimePickerConfirm"
-          @cancel="timePickerVisible = false"
-        />
-      </van-popup>
-      <van-field
-        v-model="form.user"
-        label="主讲人"
-        required
-        placeholder="请输入主讲人姓名"
-        :border="false"
-        :rules="[{ required: true, message: '请输入主讲人姓名' }]"
-      />
-      <van-field
-        v-model="form.address"
-        label="地址"
-        required
-        placeholder="请输入活动地址"
-        :border="false"
-        :rules="[{ required: true, message: '请输入活动地址' }]"
-      />
-      <van-field
-        v-model="form.content"
-        type="textarea"
-        label="内容"
-        required
-        placeholder="请输入学术活动内容"
-        :border="false"
-        :rules="[{ required: true, message: '请输入学术活动内容' }]"
-      />
-    </van-form>
-    <div class="fixed-box">
-      <div class="fixed-inner">
-        <div class="fixed-button" @click="onSubmit">提交</div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      form: {
-        name: '',
-        time: '',
-        user: '',
-        address: '',
-        content: ''
-      },
-      timePickerVisible: false,
-      minDate: new Date()
-    }
-  },
-  methods: {
-    handleTimePickerConfirm(time) {
-      this.form.time = time
-      this.timePickerVisible = false
-    },
-    onSubmit() {
-      this.$refs.form.submit()
-      console.log(this.form)
-    }
-  }
-}
-</script>
-
-<style lang="scss"></style>

src/views/learn/components/Item.vue

-<template>
-  <div></div>
-</template>
-
-<script>
-export default {}
-</script>
-
-<style lang="scss"></style>

src/views/learn/components/List.vue

-<template>
-  <div class="list">
-    <van-list
-      v-model="loading"
-      :finished="finished"
-      finished-text="没有更多了"
-      @load="onLoad"
-      v-if="list.length"
-    >
-      <van-cell v-for="item in list" :key="item" :title="item" />
-    </van-list>
-    <div class="empty" v-else>您还没有申请过学术活动</div>
-    <div class="fixed-box">
-      <div class="fixed-inner">
-        <div
-          class="fixed-button"
-          @click="$router.push({ name: 'learnCreate' })"
-        >
-          申请新的活动
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      list: [],
-      loading: false,
-      finished: true
-    }
-  },
-  methods: {
-    getList() {},
-    onLoad() {
-      this.getList()
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-.list {
-  overflow: hidden;
-  min-height: 100vh;
-}
-</style>

src/views/learn/components/List/Card.vue

-<template>
-  <div class="card">
-    <div class="card-title"></div>
-    <div class="card-main">
-      <div class="card-content">
-        <div class="p-item">
-          <div class="p-title">班级：</div>
-          <div class="p-content"></div>
-        </div>
-        <div class="p-item">
-          <div class="p-title">申请人：</div>
-          <div class="p-content"></div>
-        </div>
-        <div class="p-item">
-          <div class="p-title">电话：</div>
-          <div class="p-content"></div>
-        </div>
-        <div class="p-item">
-          <div class="p-title">审核状态：</div>
-          <div class="p-content"></div>
-        </div>
-        <div class="p-item">
-          <div class="p-title">审核时间：</div>
-          <div class="p-content"></div>
-        </div>
-      </div>
-    </div>
-    <div class="card-tools">
-      <div class="card-button">编辑</div>
-      <div class="card-button">删除</div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'Card',
-  props: {
-    data: Object
-  },
-  data() {
-    return {
-      
-    }
-  }
-}
-</script>
-<style lang="scss" scoped>
-.card {
-}
-.is-red {
-  color: #ab2824;
-}
-.p-title {
-  font-size: 12px;
-  color: #999;
-}
-.p-content {
-  font-size: 12px;
-  color: #333;
-}
-.card-button {
-  width: 60px;
-  height: 25px;
-  border-radius: 5px;
-  border: 1px solid rgba(153, 153, 153, 1);
-}
-</style>

src/views/learn/router.js

-export default [
-  {
-    name: 'learn',
-    path: '/learn',
-    meta: { title: '学术活动' },
-    component: () =>
-      import(/* webpackChunkName: "learn" */ './components/List.vue')
-  },
-  {
-    name: 'learnCreate',
-    path: '/learn/create',
-    meta: { title: '申请新的活动' },
-    component: () =>
-      import(/* webpackChunkName: "learn" */ './components/Edit.vue')
-  },
-  {
-    name: 'learnItem',
-    path: '/learn/item',
-    meta: { title: '学术活动' },
-    component: () =>
-      import(/* webpackChunkName: "learn" */ './components/Item.vue')
-  }
-]

src/views/rebuild/api.js

-import httpRequest from '@/utils/axios'
-
-// 登录
-export function login(data) {
-  return httpRequest({
-    url: '/api/login',
-    method: 'post',
-    data
-  })
-}

src/views/rebuild/components/Edit.vue

-<template>
-  <div class="main">
-    <van-form
-      @submit="onSubmit"
-      ref="form"
-      class="form"
-      validate-trigger="onChange"
-    >
-      <van-field
-        v-model="form.name"
-        label="姓名"
-        required
-        placeholder="请输入姓名"
-        :border="false"
-        :rules="[{ required: true, message: '请输入姓名' }]"
-      />
-      <van-field
-        v-model="form.user"
-        label="班级"
-        required
-        placeholder="请输入班级"
-        :border="false"
-        :rules="[{ required: true, message: '请输入班级' }]"
-      />
-      <van-field
-        v-model="form.address"
-        label="挂科学期"
-        required
-        placeholder="请选择挂科学期"
-        :border="false"
-        :rules="[{ required: true, message: '请选择挂科学期' }]"
-      />
-      <van-field
-        v-model="form.content"
-        label="重修课程名称"
-        required
-        placeholder="请选择重修课程名称"
-        :border="false"
-        :rules="[{ required: true, message: '请选择重修课程名称' }]"
-      />
-      <van-field label="上传缴费凭证">
-        <template #input>
-          <van-uploader v-model="form.uploader" />
-        </template>
-      </van-field>
-    </van-form>
-    <div class="fixed-box">
-      <div class="fixed-inner">
-        <div class="fixed-button" @click="onSubmit">提交</div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      form: {
-        name: '',
-        time: '',
-        user: '',
-        address: '',
-        content: ''
-      }
-    }
-  },
-  methods: {
-    onSubmit() {
-      this.$refs.form.submit()
-      console.log(this.form)
-    }
-  }
-}
-</script>
-
-<style lang="scss"></style>

src/views/rebuild/components/Item.vue

-<template>
-  <div></div>
-</template>
-
-<script>
-export default {}
-</script>
-
-<style lang="scss"></style>

src/views/rebuild/components/List.vue

-<template>
-  <div class="list">
-    <van-list
-      v-model="loading"
-      :finished="finished"
-      finished-text="没有更多了"
-      @load="onLoad"
-      v-if="list.length"
-    >
-      <van-cell v-for="item in list" :key="item" :title="item" />
-    </van-list>
-    <div class="empty" v-else>您还没有申请过重修</div>
-    <div class="fixed-box">
-      <div class="fixed-inner">
-        <div
-          class="fixed-button"
-          @click="$router.push({ name: 'rebuildCreate' })"
-        >
-          申请重修
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      list: [],
-      loading: false,
-      finished: true
-    }
-  },
-  methods: {
-    getList() {},
-    onLoad() {
-      this.getList()
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-.list {
-  overflow: hidden;
-  min-height: 100vh;
-}
-</style>

src/views/rebuild/router.js

-export default [
-  {
-    name: 'rebuild',
-    path: '/rebuild',
-    meta: { title: '学术活动' },
-    component: () =>
-      import(/* webpackChunkName: "rebuild" */ './components/List.vue')
-  },
-  {
-    name: 'rebuildCreate',
-    path: '/rebuild/create',
-    meta: { title: '学术活动' },
-    component: () =>
-      import(/* webpackChunkName: "rebuild" */ './components/Edit.vue')
-  },
-  {
-    name: 'rebuildItem',
-    path: '/rebuild/item',
-    meta: { title: '学术活动' },
-    component: () =>
-      import(/* webpackChunkName: "rebuild" */ './components/Item.vue')
-  }
-]

src/views/share/api.js

-import httpRequest from '@/utils/axios'
-
-// 登录
-export function login(data) {
-  return httpRequest({
-    url: '/api/login',
-    method: 'post',
-    data
-  })
-}

src/views/share/components/Edit.vue

-<template>
-  <div class="main">
-    <van-form
-      @submit="onSubmit"
-      ref="form"
-      class="form"
-      validate-trigger="onChange"
-    >
-      <van-field
-        v-model="form.name"
-        label="姓名"
-        required
-        placeholder="请输入姓名"
-        :border="false"
-        :rules="[{ required: true, message: '请输入姓名' }]"
-      />
-      <van-field
-        v-model="form.type"
-        label="行业"
-        required
-        placeholder="请输入行业"
-        :border="false"
-        :rules="[{ required: true, message: '请输入行业' }]"
-      />
-      <van-field
-        v-model="form.age"
-        label="年龄"
-        required
-        placeholder="请输入年龄"
-        :border="false"
-        :rules="[{ required: true, message: '请输入年龄' }]"
-      />
-      <van-field
-        v-model="form.level"
-        label="班级"
-        required
-        placeholder="请输入班级"
-        :border="false"
-        :rules="[{ required: true, message: '请输入班级' }]"
-      />
-      <van-field
-        v-model="form.tel"
-        type="tel"
-        label="电话"
-        required
-        placeholder="请输入电话"
-        :border="false"
-        :rules="[{ required: true, message: '请输入电话' }]"
-      />
-      <van-field
-        v-model="form.content"
-        type="textarea"
-        label="内容"
-        required
-        autosize
-        placeholder="请输入乐分享内容"
-        :border="false"
-        :rules="[{ required: true, message: '请输入乐分享内容' }]"
-      />
-    </van-form>
-    <div class="fixed-box">
-      <div class="fixed-inner">
-        <div class="fixed-button" @click="onSubmit">提交</div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      form: {
-        name: '',
-        type: '',
-        age: '',
-        level: '',
-        content: ''
-      }
-    }
-  },
-  methods: {
-    onSubmit() {
-      this.$refs.form.submit()
-      console.log(this.form)
-    }
-  }
-}
-</script>
-
-<style lang="scss"></style>

src/views/share/components/Item.vue

-<template>
-  <div></div>
-</template>
-
-<script>
-export default {}
-</script>
-
-<style lang="scss"></style>

src/views/share/components/List.vue

-<template>
-  <div class="list">
-    <van-list
-      v-model="loading"
-      :finished="finished"
-      finished-text="没有更多了"
-      @load="onLoad"
-      v-if="list.length"
-    >
-      <van-cell v-for="item in list" :key="item" :title="item" />
-    </van-list>
-    <div class="empty" v-else>您还没有申请过乐分享</div>
-    <div class="fixed-box">
-      <div class="fixed-inner">
-        <div
-          class="fixed-button"
-          @click="$router.push({ name: 'shareCreate' })"
-        >
-          申请新的乐分享
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      list: [],
-      loading: false,
-      finished: true
-    }
-  },
-  methods: {
-    getList() {},
-    onLoad() {
-      this.getList()
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-.list {
-  overflow: hidden;
-  min-height: 100vh;
-}
-</style>

src/views/share/router.js

-export default [
-  {
-    name: 'share',
-    path: '/share',
-    meta: { title: '学术活动' },
-    component: () =>
-      import(/* webpackChunkName: "share" */ './components/List.vue')
-  },
-  {
-    name: 'shareCreate',
-    path: '/share/create',
-    meta: { title: '学术活动' },
-    component: () =>
-      import(/* webpackChunkName: "share" */ './components/Edit.vue')
-  },
-  {
-    name: 'shareItem',
-    path: '/share/item',
-    meta: { title: '学术活动' },
-    component: () =>
-      import(/* webpackChunkName: "share" */ './components/Item.vue')
-  }
-]

yarn.lock

@@ -2709,6 +2709,11 @@ dashdash@^1.12.0:
   dependencies:
     assert-plus "^1.0.0"
 
+dayjs@^1.8.23:
+  version "1.8.23"
+  resolved "https://registry.yarnpkg.com/dayjs/-/dayjs-1.8.23.tgz#07b5a8e759c4d75ae07bdd0ad6977f851c01e510"
+  integrity sha512-NmYHMFONftoZbeOhVz6jfiXI4zSiPN6NoVWJgC0aZQfYVwzy/ZpESPHuCcI0B8BUMpSJQ08zenHDbofOLKq8hQ==
+
 de-indent@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d"