课程关联疗法

src/views/components/course/userCourseCatalogDetails.vue

@@ -133,6 +133,44 @@
                       @change="handleVideoChange" @selectProjects="handleSelectProjects" ref="videoUpload"
                       append-to-body/>
 
+        <el-form-item label="关联疗法" >
+          <el-button size="small" type="primary" @click="choosePackage">选取疗法</el-button>
+          <el-table border width="100%" style="margin-top:5px;"  :data="packageList">
+            <el-table-column label="疗法名称" align="center" prop="packageName"/>
+            <el-table-column label="疗法图片" align="center" prop="imgUrl">
+              <template slot-scope="scope">
+                <img :src="scope.row.imgUrl" style="height: 80px;">
+              </template>
+            </el-table-column>
+            <el-table-column label="疗法别名" align="center" prop="secondName"/>
+            <el-table-column label="总金额" align="center" prop="totalPrice"/>
+            <!-- 根据课程类型控制是否显示弹出时间列：0是公域(显示)，1是私域(不显示) -->
+            <el-table-column label="弹出时间" align="center" width="250px" v-if="isPrivate == 0">
+              <template slot-scope="scope">
+                <div>
+                  <el-time-select
+                    v-model="scope.row.duration"
+                    size="mini"
+                    placeholder="选择时间"
+                    :picker-options="getPickerOptions()"
+                    @change="handleTimeChange(scope.$index, scope.row)"
+                  ></el-time-select>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作" align="center" width="100px" fixed="right">
+              <template slot-scope="scope">
+                <el-button
+                  size="mini"
+                  type="text"
+                  icon="el-icon-delete"
+                  @click="handlePackageDelete(scope.row)"
+                >删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-form-item >
+
         <el-form-item label="课题选择" prop="questionBankId">
           <el-button size="small" type="primary" @click="chooseQuestionBank">选取课题</el-button>
           <el-table border width="100%" style="margin-top:5px;" :data="form.questionBankList">
@@ -631,6 +669,22 @@ export default {
           .padStart(2, "0")}`, // 动态结束时间
       };
     },
+
+    // 处理时间选择框值变化
+    handleTimeChange(index, row) {
+      // 确保 packageList 中的数据被正确更新
+      this.$set(this.packageList, index, row);
+      // 同步更新 form.packageJson 字段
+      this.$nextTick(() => {
+        // 确保每个疗法包都有 duration 字段
+        this.packageList.forEach(item => {
+          if (item.duration === undefined || item.duration === null) {
+            item.duration = ''; // 空值应初始化为空字符串而不是null，避免显示"null"
+          }
+        });
+        this.form.packageJson = JSON.stringify(this.packageList);
+      });
+    },
     handlePackageDelete(row) {
       this.packageList.splice(this.packageList.findIndex(item => item.packageId === row.packageId), 1)
     },