用户开课

src/views/modules/user/userCourse.vue

@@ -4,14 +4,29 @@
       :inline="true"
       :model="dataForm"
       @keyup.enter.native="getDataList()"
-    >
+    >    
-      <el-form-item>
+      <el-form-item label="">
-        <el-button @click="showAddD" type="primary">开通课程</el-button>
-      </el-form-item>
-      <el-form-item>
         <el-input v-model="dataForm.key" placeholder="请输入课程名" clearable>
         </el-input>
       </el-form-item>
+      <!-- <el-form-item label="">
+        <el-input v-model="dataForm.userInfo" placeholder="用户手机/邮箱/姓名" clearable>
+        </el-input>
+      </el-form-item> -->
+      <el-form-item label="">
+        <el-select v-model="dataForm.expire" placeholder="课程状态" 
+        @change="
+        pageIndex = 1;
+            getDataList();">
+          <el-option
+            v-for="item in statusOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
       <el-form-item >
         <el-button
           @click="
@@ -21,6 +36,9 @@
           >查询</el-button
         >        
       </el-form-item>
+      <el-form-item>
+        <el-button @click="showAddD" type="primary">开通课程</el-button>
+      </el-form-item>
       <el-form-item style="float:right">
         <div v-if="user.id" class="flexbox userInfo">   
       <div>用户信息：{{ user.name }}{{ user.tel }}</div>
@@ -42,7 +60,7 @@
     >
     
       <el-table-column
-        prop="title"
+        prop="courseName"
         header-align="center"
         align="center"
         label="课程名"
@@ -54,6 +72,10 @@
         align="center"
         label="分部"
       >
+      <template slot-scope="scope">
+        {{scope.row.catalogueName}}（<span :style="scope.row.expire == 0 ? 'color:green;' : 'color:red'">{{scope.row.expire == 0 ? '有效' : '已过期'}}</span>）
+       
+      </template>
       </el-table-column>
 
       <el-table-column
@@ -70,15 +92,25 @@
         label="到期时间"
       >
       </el-table-column>
-      <!-- <el-table-column
+      <el-table-column
+        prop="come"
+        header-align="center"
+        align="center"
+        label="操作原因"
+      >
+      </el-table-column>
+      <el-table-column
         fixed="right"
         header-align="center"
         align="center"
-        width="150"
+        width="250"
         label="操作"
       >
-        <template slot-scope="scope"> </template>
+        <template slot-scope="scope">
-      </el-table-column> -->
+          <el-button v-if="scope.row.expire == 0" type="primary" @click="delay(scope.row)" plain size="mini">延期</el-button>
+          <el-button type="danger" @click="expired(scope.row)" plain size="mini">设置过期</el-button>
+        </template>
+      </el-table-column>
     </el-table>
     <el-pagination
       @size-change="sizeChangeHandle"
@@ -99,7 +131,8 @@
       width="60%"
       @close="dialogClose"
     >
-      <el-form
+      <el-form style="width:100%"
+
         :model="youForm"
         label-width="100px"
         ref="youForm"
@@ -112,20 +145,20 @@
           <span v-else-if="user.vip == 1">（超级VIP）</span>
           <span v-else-if="user.vip == 3">（众妙之门VIP）</span>
         </el-form-item>
-        <div class="flexbox">
+        <div class="flexbox width100" >
           <div>
-            <el-form-item label="课程名：" prop="courseId">
+            <el-form-item label="课程名：" prop="courseId" >
               <el-select
                 v-model="youForm.courseId"
                 filterable
                 remote
                 reserve-keyword
-                placeholder="请输入课程名并选择您要添加的课程"
+                placeholder="请输入课程名"
                 :remote-method="remoteMethod"
                 :loading="totalLaoding"
                 @change="selectChange"
               >
-                <el-option
+                <el-option 
                   v-for="item in options"
                   :key="item.id"
                   :label="item.title"
@@ -142,7 +175,7 @@
               label-width="150px"
               prop="catalogueId"
             >
-            <div  v-for="(item, index) in youForm.cate"
+            <div  v-for="(item, index) in youForm.cate" style=""
                 :key="index">
               <el-radio               
                 v-model="youForm.catalogueId"
@@ -165,12 +198,16 @@
             </el-option>
           </el-select>
         </el-form-item>
+        <el-form-item label="开通原因："  prop="come" style="width: 400px">
+          <el-input v-model="youForm.come"  type="textarea" :rows="2"  placeholder="请输入内容"></el-input>
+        </el-form-item>
       </el-form>
       <span slot="footer" class="dialog-footer">
         <el-button @click="dialogClose">取消</el-button>
         <el-button @click="submit" type="primary">确认开通</el-button>
       </span>
     </el-dialog>
+
   </div>
 </template>
 
@@ -180,8 +217,22 @@ export default {
   data() {
     return {
       dataForm: {
-        key: ""
+        key: "",
+        expire: "",
+        userInfo: ""
       },
+       statusOptions: [
+        {
+          value: "0",
+          label: "有效"
+        },
+        {
+          value: "-1",
+          label: "已过期"
+        }       
+       
+      ],
+
       userId: this.$route.query.id,
       user: {},
       pointFormRules: {
@@ -205,35 +256,35 @@ export default {
         // 开通时长
         {
           value: "30",
-          label: "一个月"
+          label: "30天"
         },
         {
           value: "60",
-          label: "两个月"
+          label: "60天"
         },
         {
           value: "90",
-          label: "三个月"
+          label: "90天"
         },
         {
           value: "120",
-          label: "四个月"
+          label: "120天"
         },
         {
           value: "150",
-          label: "五个月"
+          label: "150天"
         },
         {
           value: "180",
-          label: "六个月"
+          label: "180天"
         },
         {
           value: "365",
-          label: "一年"
+          label: "365天"
         },
         {
           value: "730",
-          label: "两年"
+          label: "730天"
         }
       ],
       dataList: [],
@@ -251,8 +302,10 @@ export default {
         courseId: null,
         cate: [],
         catalogueId: null,
-        days: ""
+        days: "",
-      }
+        come:""  //管理员开通(原因)
+
+      }            
     };
   },
   components: {
@@ -268,6 +321,68 @@ export default {
     // this.getcourpeList()
   },
   methods: {
+    delay(val){
+      this.$prompt('请输入延期天数', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          // inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
+          // inputErrorMessage: '邮箱格式不正确'
+        }).then(({ value }) => {
+          console.log('value',value)
+          this.delaySubmit({
+            id:val.id,
+            days:value
+          })
+        }).catch(() => {
+          // this.$message({
+          //   type: 'info',
+          //   message: '取消输入'
+          // });       
+        });
+    },
+    delaySubmit(data){
+      this.$http({
+          url: this.$http.adornUrl("/master/userCourseBuy/delayUserCourseBuy"),
+          method: "post",
+          data: this.$http.adornData(data)
+        }).then(({ data }) => {
+          if (data && data.code === 0) {
+            this.$message.success('操作成功!')
+            this.getDataList()
+          } else {
+            this.$message.error('操作失败!')
+          }
+        }).catch(err => {
+          this.$message.error(err.msg)
+        })
+    },
+    expired(val){
+      this.$confirm(`是否确定将${val.courseName}->${val.catalogueName}设置为过期？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+        this.$http({
+          url: this.$http.adornUrl("/master/userCourseBuy/expireUserCourseBuy"),
+          method: "post",
+          data: this.$http.adornData({
+            "id": val.id
+          })
+        }).then(({ data }) => {
+          if (data && data.code === 0) {
+            this.$message.success('操作成功!')
+            this.getDataList()
+          } else {
+            this.$message.error('操作失败!')
+          }
+        }).catch(err => {
+          this.$message.error(err.msg)
+        })
+      }).catch( () => {
+
+        })
+    },
     submit() {
       console.log(this.youForm, "youForm");
       this.$refs['youForm'].validate(valid => {
@@ -279,7 +394,7 @@ export default {
           delete data.cate
           console.log('data',data)        
           this.$http({
-            url: this.$http.adornUrl("/master/userManage/addUserCourseBuy"),
+            url: this.$http.adornUrl("/master/userCourseBuy/insertUserCourseBuy"),
             method: "post",
             data: this.$http.adornData(data)
           })
@@ -375,13 +490,15 @@ export default {
       this.dataListLoading = true;
       this.$http({
         // url: this.$http.adornUrl('/book/user/list'),
-        url: this.$http.adornUrl("/master/userManage/getUserCourseList"),
+        url: this.$http.adornUrl("/master/userCourseBuy/listByPage"),
         method: "post",
         data: this.$http.adornData({
-           userId: this.userId,
+          "current": this.pageIndex,
-          page: this.pageIndex,
+          "limit": this.pageSize,
-          limit: this.pageSize,
+          "userInfo": this.userId,//姓名 电话 邮箱
-          title: this.dataForm.key
+          "courseName": this.dataForm.key,//课程名
+          "come":"",   //开课来源
+          "expire": this.dataForm.expire//状态  0有效 -1 过期
         })       
       })     
       .then(({ data }) => {        
@@ -441,6 +558,7 @@ export default {
 };
 </script>
 <style lang="less" scoped>
+/deep/ .width100 .el-input__inner{width: 100%;}
 .flexbox {
   display: flex;
 }