修改问题

src/api/categoryList.js

@@ -25,3 +25,10 @@ export function addCategoryList(data) {
     data
   })
 }
+// 获取专区课程列表
+export function getCategoryRelation(categoryId) {
+  return request({
+    url: `cms/category/categoryRelation/${categoryId}`,
+    method: 'get'
+  })
+}

src/router/index.js

@@ -128,6 +128,18 @@ export const constantRoutes = [
     }]
   },
   {
+    path: '/categoryRelation',
+    component: Layout,
+    redirect: '/categoryRelation',
+    children: [{
+      path: 'categoryRelation',
+      name: 'CategoryRelation',
+      component: () => import('@/views/categoryRelation/index'),
+      meta: { title: '专区课程列表' }
+    }],
+    hidden: true
+  },
+  {
     path: '/memberList',
     component: Layout,
     redirect: '/memberList',

src/store/getters.js

@@ -15,6 +15,7 @@ const getters = {
   getTempateData: state => state.dashboard.getTempateData,
   getCategoryData: state => state.categoryList.getCategoryData,
   getCategoryDataLength: state => state.categoryList.getCategoryDataLength,
+  getCategoryRelationData: state => state.categoryList.getCategoryRelationData,
   getMemberData: state => state.memberList.getMemberData,
   getMemberOrderData: state => state.memberList.getMemberOrderData,
   getMemberOrderDataLength: state => state.memberList.getMemberOrderDataLength,

src/store/modules/categoryList.js

@@ -1,8 +1,9 @@
-import { getCategoryList, setCategoryList, addCategoryList } from '@/api/categoryList'
+import { getCategoryList, setCategoryList, addCategoryList, getCategoryRelation } from '@/api/categoryList'
 
 const state = {
   getCategoryData: [],
-  getCategoryDataLength: 0
+  getCategoryDataLength: 0,
+  getCategoryRelationData: []
 }
 
 const mutations = {
@@ -11,6 +12,9 @@ const mutations = {
   },
   CATEGORY_LENGTH: (state, length) => {
     state.getCategoryDataLength = length
+  },
+  CATEGORY_RELATION: (state, data) => {
+    state.getCategoryRelationData = data
   }
 }
 
@@ -49,6 +53,19 @@ const actions = {
         reject(error)
       })
     })
+  },
+  // 获取专区课程列表
+  getRelationList({ commit, state }, obj) {
+    const categoryId = obj.categoryId
+    return new Promise((resolve, reject) => {
+      getCategoryRelation(categoryId).then((res) => {
+        const list = res.data
+        commit('CATEGORY_RELATION', list)
+        resolve()
+      }).catch(error => {
+        reject(error)
+      })
+    })
   }
 }
 

src/views/categoryList/index.vue

@@ -69,6 +69,10 @@
             >修改</el-button>
             <el-button
               size="mini"
+              @click="handleDetail(scope.$index, scope.row)"
+            >详情</el-button>
+            <el-button
+              size="mini"
               @click="handleUp(scope.$index, scope.row)"
             >{{ scope.row.status === 'ABNORMAL' ? '正常' : '不正常' }}</el-button>
           </template>
@@ -108,12 +112,14 @@
           <el-button type="primary" @click="handOk('ruleForm')">确 定</el-button>
         </div>
       </el-dialog>
+      <!--
       <el-pagination
         background
         layout="prev, pager, next"
         :total="getCategoryDataLength"
         @current-change="handleCurrentChange"
       />
+      -->
     </div>
   </div>
 </template>
@@ -198,6 +204,14 @@ export default {
       }
       this.setForm(row)
     },
+    handleDetail(index, row) {
+      this.$router.push({
+        path: '/categoryRelation/categoryRelation',
+        query: {
+          categoryId: row.id
+        }
+      })
+    },
     handleUp(index, row) {
       console.log(index, row)
       this.setForm(row)

src/views/categoryRelation/index.vue

@@ -0,0 +1,282 @@
+<template>
+  <div class="dashboard-container">
+    <div class="dashboard-text">
+      <el-button type="primary" @click="addList">增加专区课程列表</el-button>
+      <el-table
+        :data="getCategoryRelationData"
+        style="width: 100%"
+      >
+        <el-table-column
+          label="序号"
+          width="60"
+          prop="sort"
+        />
+        <el-table-column
+          label="id"
+          width="160"
+          prop="id"
+        />
+        <el-table-column
+          label="专区名称"
+          width="200"
+          prop="title"
+        />
+        <el-table-column
+          label="专区类型"
+          width="180"
+        >
+          <template slot-scope="scope">
+            <span>{{ targetCode(scope.row.code) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="专题类型"
+          width="180"
+        >
+          <template slot-scope="scope">
+            <span>{{ scope.row.courseType === 'KNOWLEDGE' ? '知识付费' : '图书馆' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="状态"
+          width="80"
+        >
+          <template slot-scope="scope">
+            <span>{{ scope.row.status === 'ABNORMAL' ? '不正常' : '正常' }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="创建时间"
+          width="180"
+        >
+          <template slot-scope="scope">
+            <span>{{ newDate(scope.row.gmtCreated) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="修改时间"
+          width="180"
+        >
+          <template slot-scope="scope">
+            <span>{{ newDate(scope.row.gmtModified) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              @click="handleEdit(scope.$index, scope.row)"
+            >修改</el-button>
+            <el-button
+              size="mini"
+              @click="handleUp(scope.$index, scope.row)"
+            >{{ scope.row.status === 'ABNORMAL' ? '正常' : '不正常' }}</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-dialog title="专区" :visible.sync="dialogFormVisible">
+        <el-form ref="ruleForm" :model="form" :rules="rules">
+          <el-form-item label="专区类型" :label-width="formLabelWidth" prop="code">
+            <el-select v-model="form.code" placeholder="请选择">
+              <el-option value="PAY" label="知识付费" />
+              <el-option value="PRESCHOOL" label="学前" />
+              <el-option value="PRIMARY" label="小学" />
+              <el-option value="MIDDLE" label="中学" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="标题" :label-width="formLabelWidth" prop="title">
+            <el-input v-model="form.title" autocomplete="off" clearable />
+          </el-form-item>
+          <el-form-item label="专题类型" :label-width="formLabelWidth" prop="courseType">
+            <el-select v-model="form.courseType" placeholder="请选择">
+              <el-option value="KNOWLEDGE" label="知识付费" />
+              <el-option value="LIBRARY" label="图书馆" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="排序" :label-width="formLabelWidth" prop="sort">
+            <el-input v-model="form.sort" autocomplete="off" clearable />
+          </el-form-item>
+          <el-form-item v-if="type === 'add'" label="状态" :label-width="formLabelWidth" prop="status">
+            <el-select v-model="form.status" placeholder="请选择">
+              <el-option value="ABNORMAL" label="不正常" />
+              <el-option value="NORMAL" label="正常" />
+            </el-select>
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button @click="dialogFormVisible = false">取 消</el-button>
+          <el-button type="primary" @click="handOk('ruleForm')">确 定</el-button>
+        </div>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+
+export default {
+  name: 'Dashboard',
+  data() {
+    return {
+      dialogFormVisible: false,
+      form: {},
+      formLabelWidth: '120px',
+      type: '',
+      rules: {
+        code: [
+          { required: true, message: '请选择专区类型', trigger: 'change' }
+        ],
+        title: [
+          { required: true, message: '请输入排序', trigger: 'blur' }
+        ],
+        courseType: [
+          { required: true, message: '请选择专题', trigger: 'change' }
+        ],
+        status: [
+          { required: true, message: '请选择状态', trigger: 'change' }
+        ],
+        sort: [
+          { required: true, message: '请输入排序', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  created() {
+    this.$store.dispatch('categoryList/getRelationList', {
+      categoryId: this.$route.query.categoryId
+    })
+  },
+  // eslint-disable-next-line vue/order-in-components
+  computed: {
+    ...mapGetters([
+      'getCategoryRelationData'
+    ])
+  },
+  methods: {
+    newDate(date) {
+      return new Date(date).toLocaleString()
+    },
+    targetCode(type) {
+      let target = ''
+      switch (type) {
+        case 'PRESCHOOL':
+          target = '学前'
+          break
+        case 'PAY':
+          target = '知识付费课程'
+          break
+        case 'PRIMARY':
+          target = '小学'
+          break
+        case 'MIDDLE':
+          target = '中学'
+          break
+      }
+      return target
+    },
+    handleEdit(index, row) {
+      console.log(index, row)
+      this.dialogFormVisible = true
+      this.type = 'set'
+      this.form = {
+        id: '',
+        code: '',
+        title: '',
+        status: '',
+        courseType: '',
+        sort: ''
+      }
+      this.setForm(row)
+    },
+    handleUp(index, row) {
+      console.log(index, row)
+      this.setForm(row)
+      this.form.status = row.status === 'NORMAL' ? 'ABNORMAL' : 'NORMAL'
+      this.$store.dispatch('categoryList/setBlockList', this.form).then(() => {
+        this.dialogFormVisible = false
+        this.$store.dispatch('categoryList/getBlockList', {
+          blockType: '',
+          page: this.page
+        })
+      })
+    },
+    handOk(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          if (this.type === 'set') {
+            console.log(this.form)
+            this.$store.dispatch('categoryList/setBlockList', this.form).then(() => {
+              this.dialogFormVisible = false
+              this.$store.dispatch('categoryList/getBlockList', {
+                blockType: '',
+                page: this.page
+              })
+            })
+          } else {
+            this.$store.dispatch('categoryList/addBlockList', this.form).then(() => {
+              this.dialogFormVisible = false
+              this.$store.dispatch('categoryList/getBlockList', {
+                blockType: '',
+                page: this.page
+              })
+            })
+          }
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    addList() {
+      this.dialogFormVisible = true
+      this.type = 'add'
+      this.form = {
+        code: '',
+        title: '',
+        status: '',
+        courseType: '',
+        sort: ''
+      }
+    },
+    handleCurrentChange(val) {
+      console.log(val)
+      this.page = val
+      this.$store.dispatch('categoryList/getBlockList', {
+        blockType: '',
+        page: this.page
+      })
+    },
+    setForm(data) {
+      this.form.id = data.id
+      this.form.courseType = data.courseType
+      this.form.title = data.title
+      this.form.code = data.code
+      this.form.sort = data.sort
+      this.form.status = data.status
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.dashboard {
+  &-container {
+    margin: 30px;
+  }
+  &-text {
+    font-size: 30px;
+    line-height: 46px;
+  }
+}
+  .el-input {
+    width: 300px;
+  }
+  .el-select>.el-input {
+    width: 300px;
+  }
+  .el-pagination {
+    text-align: center;
+    margin-top: 20px;
+  }
+</style>

src/views/dashboardRowItem/index.vue

@@ -76,7 +76,7 @@
       </el-table>
       <el-dialog title="首页项列表" :visible.sync="dialogFormVisible">
         <el-form ref="ruleForm" :model="form" :rules="rules">
-          <el-form-item label="项目名称" :label-width="formLabelWidth" prop="content">
+          <el-form-item label="项目名称" :label-width="formLabelWidth">
             <el-input v-model="form.content" autocomplete="off" clearable />
           </el-form-item>
           <el-form-item v-if="type === 'add'" label="icon" :label-width="formLabelWidth">

src/views/tempateList/index.vue

@@ -17,6 +17,11 @@
           prop="name"
         />
         <el-table-column
+          label="Code"
+          width="150"
+          prop="code"
+        />
+        <el-table-column
           label="状态"
           width="80"
         >
@@ -46,10 +51,12 @@
               size="mini"
               @click="handleEdit(scope.$index, scope.row)"
             >修改</el-button>
+            <!--
             <el-button
               size="mini"
               @click="handleDetail(scope.$index, scope.row)"
             >{{ scope.row.status === 'HAS_ON_STOCK' ? '下架' : '上架' }}</el-button>
+            -->
           </template>
         </el-table-column>
       </el-table>

src/views/uploadTab/index.vue

@@ -130,6 +130,11 @@ export default {
         message: '恭喜你，上传成功',
         type: 'success'
       })
+      this.$store.dispatch('tagsView/delView', this.$route).then(() => {
+        this.$router.push({
+          path: '/schoolTimetable/schoolTimetable'
+        })
+      })
     }
   }
 }