课程增删改查

src/pages/system/courseManager/courseList/add.vue

@@ -11,7 +11,7 @@
                 :action='$api.file.image.url'
                 :show-file-list="false"
                 :on-success="handleAvatarSuccess">
-                <img v-if="postData.CourseImg" :src="postData.CourseImg" class="avatar">
+                <img v-if="detail.CourseImg" :src="detail.CourseImg" class="avatar">
                 <i v-else class="el-icon-plus avatar-uploader-icon"></i>
               </el-upload>
             </div>
@@ -23,7 +23,7 @@
             <div style="width: 50%;">
               <el-input
                 placeholder="请输入课程名称"
-                v-model="postData.CourseName"
+                v-model="detail.CourseName"
                 clearable
                 >
               </el-input>
@@ -34,12 +34,12 @@
           <span>课程类型：</span>
           <div class="flex-item">
             <div style="width: 50%;">
-              <el-select v-model="postData.LocationId" placeholder="请选择">
+              <el-select v-model="detail.LocationId" placeholder="请选择">
                 <el-option
-                  v-for="item in courseTypeList"
-                  :key="item.id"
-                  :label="item.name"
-                  :value="item.id">
+                  v-for="item in location"
+                  :key="item.LocationId"
+                  :label="item.LocationName"
+                  :value="item.LocationId">
                 </el-option>
               </el-select>
             </div>
@@ -51,7 +51,7 @@
             <div style="width: 200px;">
               <el-input
                 placeholder="请输入课程价格"
-                v-model="postData.Price"
+                v-model="detail.Price"
                 clearable
                 >
               </el-input>
@@ -62,7 +62,7 @@
           <span>案场：</span>
           <div class="flex-item">
             <div style="width: 50%;">
-              <el-select v-model="postData.CaseId" placeholder="请选择">
+              <el-select v-model="CaseId" placeholder="请选择">
                 <el-option
                   v-for="item in cases"
                   :key="item.CaseId"
@@ -79,7 +79,7 @@
             <div style="width: 200px;">
               <el-input
                 placeholder="请输入开课人数"
-                v-model="postData.MaxNum"
+                v-model="detail.MaxNum"
                 clearable
                 >
               </el-input>
@@ -92,7 +92,7 @@
             <div style="width: 200px;">
               <el-input
                 placeholder="请输入开课人数"
-                v-model="postData.MinNum"
+                v-model="detail.MinNum"
                 clearable
                 >
               </el-input>
@@ -105,7 +105,7 @@
             <div style="width: 200px;">
               <el-input
                 placeholder="请输入课时数"
-                v-model="postData.CourseNum"
+                v-model="detail.CourseNum"
                 clearable
                 >
               </el-input>
@@ -117,15 +117,15 @@
           <div class="flex-item">
             <div>
               <el-date-picker
-                v-model="postData.BeginDate"
-                type="date"
-                placeholder="选择开始日期">
-              </el-date-picker>
-              <span style="line-height:40px;display:inline-block;">-</span>
-              <el-date-picker
-                v-model="postData.EndDate"
-                type="date"
-                placeholder="选择结束日期">
+                v-model="courseDate"
+                type="daterange"
+                align="right"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                value-format="yyyy-MM-ddTHH:mm:ss"
+                :picker-options="pickerOptions">
               </el-date-picker>
             </div>
           </div>
@@ -138,7 +138,7 @@
                 type="textarea"
                 autosize
                 placeholder="请输入备注"
-                v-model="postData.Remark"
+                v-model="detail.Remark"
                 clearable
                 >
               </el-input>
@@ -150,17 +150,20 @@
           <div class="flex-item">
             <div style="width: 50%;">
               <el-select
-                v-model="postData.tagids"
+              style="width:100%"
+                v-model="tags"
                 multiple
                 filterable
                 allow-create
                 default-first-option
                 placeholder="请选择课程标签">
                 <el-option
-                  v-for="item in tagList"
-                  :key="item.value"
-                  :label="item.id"
-                  :value="item.value">
+                  v-for="item in tagList.list"
+                  :key="item.TagId"
+                  :label="item.TagName"
+                  :value="item.TagId"
+                  :value-key="item.TagId"
+                  >
                 </el-option>
               </el-select>
             </div>
@@ -174,7 +177,7 @@
                 type="textarea"
                 autosize
                 placeholder="请输入课程简介"
-                v-model="postData.CourseDesc"
+                v-model="detail.CourseDesc"
                 clearable
                 >
               </el-input>
@@ -185,8 +188,8 @@
           <span>是否精选课程：</span>
           <div class="flex-item">
             <div>
-              <el-radio v-model="postData.IsSelect" label="1">是</el-radio>
-              <el-radio v-model="postData.IsSelect" label="0">否</el-radio>
+              <el-radio v-model="detail.IsSelect" :label="1">是</el-radio>
+              <el-radio v-model="detail.IsSelect" :label="0">否</el-radio>
             </div>
           </div>
         </li>
@@ -200,59 +203,150 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { createNamespacedHelpers, mapState } from 'vuex'
+
+const { mapState: mapCourseState, mapActions: mapCourseActions } = createNamespacedHelpers('course')
+const { mapState: mapLocationState, mapActions: mapLocationActions } = createNamespacedHelpers('cms')
+const { mapState: mapTagState, mapActions: mapTagActions } = createNamespacedHelpers('coursetag')
+
 export default {
   name: '',
   data () {
     return {
-      postData: {
-        CourseImg: '', // 课程主图
-        CourseName: '', // 课程名称
-        LocationId: '', // 课程类型
-        Price: '', // 课程价格
-        CaseId: '', // 案场id
-        MaxNum: '', // 上课人数
-        MinNum: '', // 最小开课人数
-        CourseNum: '', // 课时数
-        BeginDate: '', // 课程开始时间
-        EndDate: '', // 课程结束时间
-        Remark: '', // 课程计划备注
-        tagids: [], // 课程标签（已有标签数据存入此字段）
-        tagnames: [], // 课程标签（新增标签数据存入此字段）
-        CourseDesc: '', // 课程描述
-        IsSelect: '0', // 是否精选课程
+      pickerOptions: {
+        shortcuts: [{
+          text: '最近一周',
+          onClick (picker) {
+            const end = new Date()
+            const start = new Date()
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
+            picker.$emit('pick', [start, end])
+          }
+        }, {
+          text: '最近一个月',
+          onClick (picker) {
+            const end = new Date()
+            const start = new Date()
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
+            picker.$emit('pick', [start, end])
+          }
+        }, {
+          text: '最近三个月',
+          onClick (picker) {
+            const end = new Date()
+            const start = new Date()
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
+            picker.$emit('pick', [start, end])
+          }
+        }]
       },
-      courseTypeList: [], // 课程类型列表
-      tagList: [], // 标签列表
     }
   },
   computed: {
+    ...mapLocationState({
+      location: x => x.location
+    }),
+    ...mapCourseState({
+      detail: x => x.courseInfo
+    }),
     ...mapState({
       cases: x => x.app.cases.list,
-      defaultCaseId: x => x.app.cases.default,
-      OrgId: x => x.app.user.OrgId,
+      caseid: x => x.app.cases.default,
+      orgid: x => x.app.user.OrgId,
+    }),
+    ...mapTagState({
+      tagList: x => x.tagList
     }),
     CaseId: {
       get () {
-        return this.postData.CaseId === '' ? this.defaultCaseId || '' : this.postData.CaseId
+        return this.detail.CaseId || this.caseid
       },
       set (val) {
-        this.postData.CaseId = val
+        this.UpdateInfo({...this.detail, CaseId: val})
       }
-    }
+    },
+    courseDate: {
+      get () {
+        return this.detail.BeginDate && this.detail.EndDate ? [this.detail.BeginDate, this.detail.EndDate] : []
+      },
+      set (val) {
+        this.UpdateInfo({...this.detail, BeginDate: val[0], EndDate: val[1]})
+      },
+    },
+    tags: {
+      get () {
+        return (this.detail.CourseTags || []).map(x => x.TagId)
+      },
+      set (val) {
+        let v = val.map(x => {
+          return {
+            TagId: x,
+          }
+        })
+        this.UpdateInfo({...this.detail, CourseTags: v})
+      }
+    },
   },
   components: {},
   methods: {
+    ...mapCourseActions([
+      'GetCourseByID',
+      'AddCourse',
+      'UpdateCourse',
+      'UpdateInfo',
+    ]),
+    ...mapLocationActions([
+      'updateLocationInfo',
+    ]),
+    ...mapTagActions([
+      'GetCourseTagList',
+    ]),
     handleAvatarSuccess (res, file) {
-      this.postData.CourseImg = res.result.url
+      this.UpdateInfo({...this.detail, CourseImg: res.result.url})
     },
     submit () { // 提交数据
+      const { id } = this.$route.query
+      if (!id || id === '') {
+        this.UpdateInfo({...this.detail, CourseId: ''})
+      }
+      const _that = this
+      this.detail.tagids = this.tags.map(x => {
+        let tagfilter = (_that.tagList.list || []).filter(tag => tag.TagId === x)
+        if (tagfilter.length > 0) {
+          return tagfilter[0].TagName + ':' + tagfilter[0].TagId
+        } else {
+          return x
+        }
+      }).join(',')
+      if ((this.detail.CourseId || '') === '') {
+        this.detail.OrgId = this.orgid
+        if (!this.detail.CaseId || this.detail.CaseId === '') {
+          this.detail.CaseId = this.caseid
+        }
+        this.AddCourse(this.detail)
+      } else {
+        this.UpdateCourse(this.detail)
+      }
+      this.$message({
+        type: 'success',
+        message: '操作成功'
+      })
+      this.$router.push({ name: 'courseList' })
     },
     cancel () {
       this.$router.push({ name: 'courseList' })
     }
   },
-  mounted () { }
+  mounted () {
+    this.updateLocationInfo()
+    this.GetCourseTagList({ pagesize: 100 })
+    const { id } = this.$route.query
+    if (id && id !== '') {
+      this.GetCourseByID({ id: id })
+    } else {
+      // this.SetNull()
+    }
+  }
 }
 </script>
 

src/pages/system/courseManager/courseList/index.vue

@@ -8,7 +8,13 @@
         <ul>
           <li>
             <!-- <span>选择案场：</span> -->
-            <el-select v-model="postData.caseid" placeholder="请选择">
+            <el-select v-model="postData.caseid" placeholder="请选择案场">
+              <el-option
+                key=""
+                label=""
+                value=""
+              >
+              </el-option>
               <el-option
                 v-for="item in cases"
                 :key="item.CaseId"
@@ -26,10 +32,10 @@
               >
               </el-option>
               <el-option
-                v-for="item in courseTypeList"
-                :key="item.typeId"
-                :label="item.typeName"
-                :value="item.typeId">
+                v-for="item in location"
+                :key="item.LocationId"
+                :label="item.LocationName"
+                :value="item.LocationId">
               </el-option>
             </el-select>
           </li>
@@ -49,9 +55,17 @@
     </div>
     <div class="system-table-box">
       <el-table
-        :data="currentList"
+        :data="courses.list"
         stripe
         style="width: 100%">
+        <el-table-column
+          prop="CourseName"
+          label="发布状态"
+          width="150">
+          <template slot-scope="scope">
+            <label>{{scope.row.Status===1?'已发布':'未发布'}}</label>
+          </template>
+        </el-table-column>
         <el-table-column
           prop="CourseName"
           label="课程名称"
@@ -63,24 +77,34 @@
           width="150">
         </el-table-column>
         <el-table-column
-          prop="LocationId"
           label="课程类别"
           width="150">
+          <template slot-scope="scope">
+            <label>{{getLocationName(scope.row.LocationId)}}</label>
+          </template>
         </el-table-column>
         <el-table-column
-          prop="CaseId"
           label="所在案场"
           width="150">
+          <template slot-scope="scope">
+            <label>{{getCaseName(scope.row.CaseId)}}</label>
+          </template>
         </el-table-column>
         <el-table-column
           prop="BeginDate"
           label="课程开始时间"
           width="150">
+          <template slot-scope="scope">
+            <label>{{FormatDate(scope.row.BeginDate)}}</label>
+          </template>
         </el-table-column>
         <el-table-column
           prop="EndDate"
           label="课程结束时间"
           width="150">
+          <template slot-scope="scope">
+            <label>{{FormatDate(scope.row.EndDate)}}</label>
+          </template>
         </el-table-column>
         <el-table-column
           fixed="right"
@@ -92,23 +116,35 @@
               type="success">添加课程详情</el-button>
             <el-button
               size="mini"
-              type="warning">排课</el-button>
+              type="warning"
+              v-if="scope.row.Status===0"
+              >排课</el-button>
             <el-button
               size="mini"
-              type="primary">复制课程</el-button>
+              type="primary"
+              @click="handleCopy(scope.row)"
+              >复制课程</el-button>
             <el-button
               size="mini"
-              type="warning">发布</el-button>
+              type="warning"
+              @click="handlePublic(scope.row)"
+              v-if="scope.row.Status===0"
+              >发布</el-button>
             <el-button
               size="mini"
-              type="danger">取消发布</el-button>
+              type="danger"
+              @click="handleUnPublic(scope.row)"
+              v-if="scope.row.Status===1"
+              >取消发布</el-button>
             <el-button
               size="mini"
               type="warning"
+              v-if="scope.row.Status===0"
               @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
             <el-button
               size="mini"
               type="danger"
+              v-if="scope.row.Status===0"
               @click="handleDelete(scope.$index, scope.row)">删除</el-button>
           </template>
         </el-table-column>
@@ -116,16 +152,19 @@
     </div>
     <el-pagination
       @current-change="handleCurrentChange"
-      :current-page.sync="postData.page"
-      :page-size="postData.pagesize"
+      :current-page.sync="courses.page"
+      :page-size="courses.pagesize"
       layout="prev, pager, next, jumper"
-      :total="total">
+      :total="courses.pagenum">
     </el-pagination>
   </div>
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { createNamespacedHelpers, mapState } from 'vuex'
+
+const { mapState: mapCourseState, mapActions: mapCourseActions } = createNamespacedHelpers('course')
+const { mapState: mapLocationState, mapActions: mapLocationActions } = createNamespacedHelpers('cms')
 
 export default {
   name: '',
@@ -139,19 +178,11 @@ export default {
         typeid: '', // 课程类型
         name: '', // 课程名称
       },
-      currentList: [{
-        CourseName: 'xxx',
-        Price: 'xxx',
-        LocationId: 'xxx',
-        CaseId: 'xxx',
-        BeginDate: 'xxx',
-        EndDate: 'xxx',
-        CourseId: 'xxx',
-      }],
       courseTypeList: [],
     }
   },
   mounted () {
+    this.updateLocationInfo({ pagesize: 100 })
     this.$nextTick(function () {
       this.getList()
     })
@@ -161,6 +192,12 @@ export default {
       cases: x => x.app.cases.list,
       defaultCaseId: x => x.app.cases.default
     }),
+    ...mapCourseState({
+      courses: x => x.courseList,
+    }),
+    ...mapLocationState({
+      location: x => x.location
+    }),
     CaseId: {
       get () {
         return this.postData.caseid || this.defaultCaseId
@@ -171,12 +208,33 @@ export default {
     }
   },
   methods: {
+    ...mapCourseActions([
+      'GetCourseList',
+      'Public',
+      'UnPublic',
+      'DelCourse',
+      'SetNull',
+      'GetCourseByID'
+    ]),
+    ...mapLocationActions([
+      'updateLocationInfo',
+    ]),
+    getLocationName (id) {
+      return (this.location.filter(x => x.LocationId === id)[0] || {}).LocationName
+    },
+    getCaseName (id) {
+      return (this.cases.filter(x => x.CaseId === id)[0] || {}).CaseName
+    },
+    FormatDate (date) {
+      return this.toolClass.dateFormat(date, 'yyyy-mm-dd')
+    },
     search () { // 搜索
       this.postData.page = 1
       this.currentList = []
       this.getList()
     },
     getList () { // 获取列表
+      this.GetCourseList(this.postData)
     },
     handleCurrentChange (val) { // 跳转到分页
       this.getList()
@@ -185,8 +243,61 @@ export default {
       this.$router.push({ name: 'addCourse', query: { id: row.CourseId } })
     },
     handleDelete (index, row) { // 删除
+      this.$confirm('确认删除此课程?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.DelCourse({id: row.CourseId, callback: this.delCallBack})
+        })
+        .catch(() => {
+          this.$message({
+            type: 'info',
+            message: '已取消删除'
+          })
+        })
+    },
+    actionCallBack () {
+      this.$message({
+        type: 'success',
+        message: '操作成功!'
+      })
+      this.getList()
+    },
+    delCallBack () {
+      this.$message({
+        type: 'success',
+        message: '删除成功!'
+      })
+      this.getList()
     },
     addCourse () {
+      this.SetNull()
+      this.$router.push({ name: 'addCourse' })
+    },
+    handlePublic (row) {
+      this.$confirm('确认发布此课程?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.Public({ id: row.CourseId, callback: this.actionCallBack })
+        })
+    },
+    handleUnPublic (row) {
+      this.$confirm('确认取消发布此课程?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.UnPublic({ id: row.CourseId, callback: this.actionCallBack })
+        })
+    },
+    handleCopy (row) {
+      this.GetCourseByID({ id: row.CourseId })
       this.$router.push({ name: 'addCourse' })
     }
   }

src/pages/system/goodsManager/goodManager/edit.vue

@@ -152,7 +152,7 @@ export default {
       'GetGoodsByID',
       'AddGoods',
       'UpdateGoods',
-      'SetRoleNull',
+      'SetNull',
       'UpdateInfo',
       'GetGoodSpecs',
     ]),
@@ -204,7 +204,7 @@ export default {
     if (id && id !== '') {
       this.GetGoodsByID({ id: id })
     } else {
-      this.SetRoleNull()
+      this.SetNull()
     }
   }
 }

src/pages/system/goodsManager/goodManager/index.vue

@@ -166,7 +166,6 @@ export default {
     },
     handleDelete (index, row) {
       // 删除
-      console.log(index, row)
       this.$confirm('确认删除此商品?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',

src/store/course/course.js

@@ -0,0 +1,104 @@
+import ajax from '../../util/ajax'
+import api from '../../util/api'
+
+export default {
+  namespaced: true,
+  state: {
+    courseList: [],
+    courseInfo: {},
+  },
+  mutations: {
+    updateList (state, payload) {
+      state.courseList = payload || []
+    },
+    updateInfo (state, payload) {
+      state.courseInfo = payload || {}
+    },
+  },
+  actions: {
+    GetCourseList ({ commit }, payload) {
+      ajax(api.course.list.url, {
+        method: api.course.list.method,
+        queryData: {
+          ...payload,
+        }
+      }).then(res => {
+        commit('updateList', res)
+      })
+    },
+    GetCourseByID ({ commit }, { id }) {
+      ajax(api.course.info.url, {
+        method: api.course.info.method,
+        urlData: {
+          id: id,
+        }
+      }).then(res => {
+        commit('updateInfo', res)
+      })
+    },
+    AddCourse ({ commit }, payload) {
+      ajax(api.course.add.url, {
+        method: api.course.add.method,
+        data: {
+          ...payload
+        }
+      }).then(res => {
+        commit('updateInfo', res)
+      })
+    },
+    UpdateCourse ({ commit }, payload) {
+      ajax(api.course.update.url, {
+        method: api.course.update.method,
+        data: {
+          ...payload
+        },
+        urlData: {
+          id: payload.GoodsId,
+        }
+      }).then(res => {
+      })
+    },
+    DelCourse ({ commit }, { id, callback }) {
+      ajax(api.course.delete.url, {
+        method: api.course.delete.method,
+        urlData: {
+          id: id,
+        }
+      }).then(res => {
+        if (callback) {
+          callback()
+        }
+      })
+    },
+    Public ({ commit }, { id, callback }) {
+      ajax(api.course.public.url, {
+        method: api.course.public.method,
+        urlData: {
+          id: id,
+        }
+      }).then(res => {
+        if (callback) {
+          callback()
+        }
+      })
+    },
+    UnPublic ({ commit }, { id, callback }) {
+      ajax(api.course.unpublic.url, {
+        method: api.course.unpublic.method,
+        urlData: {
+          id: id,
+        }
+      }).then(res => {
+        if (callback) {
+          callback()
+        }
+      })
+    },
+    SetNull ({ commit }) {
+      commit('updateInfo', {})
+    },
+    UpdateInfo ({ commit }, payload) {
+      commit('updateInfo', payload)
+    }
+  }
+}

src/store/course/tag.js

@@ -0,0 +1,26 @@
+import ajax from '../../util/ajax'
+import api from '../../util/api'
+
+export default {
+  namespaced: true,
+  state: {
+    tagList: [],
+  },
+  mutations: {
+    updateList (state, payload) {
+      state.tagList = payload || []
+    },
+  },
+  actions: {
+    GetCourseTagList ({ commit }, payload) {
+      ajax(api.course.tags.url, {
+        method: api.course.tags.method,
+        queryData: {
+          ...payload,
+        }
+      }).then(res => {
+        commit('updateList', res)
+      })
+    },
+  },
+}

src/store/goods/goods.js

@@ -96,7 +96,7 @@ export default {
         callback()
       })
     },
-    SetRoleNull ({ commit }) {
+    SetNull ({ commit }) {
       commit('updateInfo', {})
     },
     UpdateInfo ({ commit }, payload) {

src/store/index.js

@@ -18,6 +18,8 @@ export const modules = {
   role: () => require('./system/role').default,
   device: () => require('./case/device').default,
   goods: () => require('./goods/goods').default,
+  course: () => require('./course/course').default,
+  coursetag: () => require('./course/tag').default,
 }
 
 Object.keys(modules).forEach((modKey) => {

src/util/api.js

@@ -82,7 +82,7 @@ const $api = {
   caseManager: {
     getRolesList: { // 获取角色列表
       method: 'get',
-      url: `${baseUrl}/common/role`
+      url: `${baseUrl}${common}/role`
     },
     getCaseList: { // 获取案场列表
       method: 'get',
@@ -436,6 +436,56 @@ const $api = {
       method: 'delete',
       url: `${baseUrl}${common}/case/equipment/:id`
     },
+  },
+  course: {
+    list: {
+      method: 'get',
+      url: `${baseUrl}${common}/course`
+    },
+    info: {
+      method: 'get',
+      url: `${baseUrl}${common}/course/:id`
+    },
+    tags: {
+      method: 'get',
+      url: `${baseUrl}${common}/coursetag`
+    },
+    add: {
+      method: 'post',
+      url: `${baseUrl}${common}/course`
+    },
+    update: {
+      method: 'put',
+      url: `${baseUrl}${common}/course`
+    },
+    delete: {
+      method: 'delete',
+      url: `${baseUrl}${common}/course/:id`
+    },
+    public: {
+      method: 'put',
+      url: `${baseUrl}${common}/course/:id/public`
+    },
+    unpublic: {
+      method: 'put',
+      url: `${baseUrl}${common}/course/:id/unpublic`
+    },
+    getimgs: {
+      method: 'get',
+      url: `${baseUrl}${common}/courseimg/:id`
+    },
+    addimgs: {
+      method: 'post',
+      url: `${baseUrl}${common}/courseimg`
+    },
+    updateimgs: {
+      method: 'put',
+      url: `${baseUrl}${common}/courseimg`
+    },
+    deleteimgs: {
+      method: 'delete',
+      url: `${baseUrl}${common}/courseimg/:id`
+    },
   }
 }
 export default $api