医健宝，销售训练营，系统组件兼容优化

package.json

@@ -133,9 +133,9 @@
     "husky": "1.3.1",
     "lint-staged": "8.1.5",
     "mockjs": "1.0.1-beta3",
-    "node-sass": "4.14.1",
     "plop": "2.3.0",
     "runjs": "4.3.2",
+    "sass": "^1.32.13",
     "sass-loader": "8.0.2",
     "script-ext-html-webpack-plugin": "2.1.3",
     "script-loader": "0.7.2",

src/api/course/userCoursePeriod.js

@@ -177,6 +177,15 @@ export function updatePeriod(data) {
   })
 }
 
+// 修改营期单独注册会员状态
+export function updatePeriodIsNeedRegisterMember(data) {
+  return request({
+    url: '/course/period/editIsNeedRegisterMember',
+    method: 'put',
+    data: data
+  })
+}
+
 // 根据营期id获取公司红包金额列表
 export function getPeriodCompanyList(query) {
   return request({

src/components/HeaderSearch/index.vue

@@ -167,7 +167,7 @@ export default {
     display: inline-block;
     vertical-align: middle;
 
-    /deep/ .el-input__inner {
+    ::v-deep .el-input__inner {
       border-radius: 0;
       border: 0;
       padding-left: 0;

src/components/LemonUI/components/chatrecords/basic.vue

@@ -524,23 +524,23 @@
         padding: 0 8px;
     }
 
-    /deep/.el-dialog__headerbtn{
+    ::v-deep.el-dialog__headerbtn{
          top:10px;
     }
 
-    /deep/.el-form--inline .el-form-item{
+    ::v-deep.el-form--inline .el-form-item{
         display: flex;
     }
-    /deep/.el-form-item--medium .el-form-item__content{
+    ::v-deep.el-form-item--medium .el-form-item__content{
         flex: 1;
         margin-right: 20px;
     }
 
-    /deep/.el-dialog:not(.is-fullscreen) {
+    ::v-deep.el-dialog:not(.is-fullscreen) {
         margin-top: 0 !important;
     }
 
-    // /deep/.el-dialog__header{
+    // ::v-deep.el-dialog__header{
     //     padding-bottom: 0;
     // }
 

src/components/LemonUI/components/chatrecords/basic1.vue

@@ -537,19 +537,19 @@
         padding: 0 8px;
     }
 
-    /deep/.el-dialog__headerbtn{
+    ::v-deep.el-dialog__headerbtn{
          top:10px;
     }
 
-    /deep/.el-form--inline .el-form-item{
+    ::v-deep.el-form--inline .el-form-item{
         display: flex;
     }
-    /deep/.el-form-item--medium .el-form-item__content{
+    ::v-deep.el-form-item--medium .el-form-item__content{
         flex: 1;
         margin-right: 20px;
     }
 
-    // /deep/.el-dialog__header{
+    // ::v-deep.el-dialog__header{
     //     padding-bottom: 0;
     // }
 

src/components/LemonUI/components/chatrecords/segrecords.vue

@@ -410,23 +410,23 @@
         padding: 0 8px;
     }
 
-    /deep/.el-dialog__headerbtn{
+    ::v-deep.el-dialog__headerbtn{
          top:10px;
     }
 
-    /deep/.el-form--inline .el-form-item{
+    ::v-deep.el-form--inline .el-form-item{
         display: flex;
     }
-    /deep/.el-form-item--medium .el-form-item__content{
+    ::v-deep.el-form-item--medium .el-form-item__content{
         flex: 1;
         margin-right: 20px;
     }
 
-    /deep/.el-dialog:not(.is-fullscreen) {
+    ::v-deep.el-dialog:not(.is-fullscreen) {
         margin-top: 0 !important;
     }
 
-    // /deep/.el-dialog__header{
+    // ::v-deep.el-dialog__header{
     //     padding-bottom: 0;
     // }
 

src/components/qqMap/index.vue

@@ -90,7 +90,7 @@ export default {
         });
         this.getAddress()
         this.creatPoint()
-      
+
         this.map.on("click",function(evt){
           if(evt.poi) {
             that.form.address = evt.poi.name
@@ -129,12 +129,12 @@ export default {
         //样式定义
         styles: {
           //创建一个styleId为"myStyle"的样式（styles的子属性名即为styleId）
-          "myStyle": new TMap.MarkerStyle({ 
+          "myStyle": new TMap.MarkerStyle({
             "width": 25,  // 点标记样式宽度（像素）
             "height": 35, // 点标记样式高度（像素）
             "src": markerDefault,  //图片路径
-            "anchor": { x: 16, y: 32 }  
-          }) 
+            "anchor": { x: 16, y: 32 }
+          })
         },
         //点标记数据数组
         geometries: [{
@@ -197,7 +197,7 @@ export default {
 
 <style lang="scss" scoped>
   .map-contain{
-    /deep/.el-dialog{
+    ::v-deep.el-dialog{
       margin-top: 2vh !important;
     }
   }
@@ -207,11 +207,11 @@ export default {
   }
   .map-coord{
     position: relative;
-    /deep/.address-select{
+    ::v-deep.address-select{
       position: absolute;
       top: 10px;
       left: 10px;
       z-index: 2000;
     }
   }
-</style>
+</style>

src/views/company/companyRecharge/doRecharge.vue

@@ -209,7 +209,7 @@ export default {
   .radio-img{
     margin-right: 10px;
   }
-  /deep/.el-radio{
+  ::v-deep.el-radio{
     display: flex;
     align-items: center;
     .el-radio__label{

src/views/company/companyVoicePackageOrder/buy.vue

@@ -61,7 +61,7 @@
 <script>
 import { getVoicePackagelist, buy} from "@/api/company/companyVoicePackageOrder";
 import { getCompanyInfo,getCompanyVoice } from "@/api/company/company";
- 
+
 export default {
   name: "CompanyRecharge",
   data() {
@@ -79,7 +79,7 @@ export default {
       },
       // 表单校验
       rules: {
-        
+
          packageId: [
           { required: true, message: "套餐不能为空", trigger: "blur" },
         ],
@@ -137,7 +137,7 @@ export default {
     width:200px;
     margin: 0px 10px;
     cursor: pointer;
-    
+
   }
   .active{
     border: 1px solid #13c2c2;;
@@ -151,7 +151,7 @@ export default {
 .radio{
   display: flex;
   align-items: center;
-   
+
 
 }
 .radio-item{
@@ -159,7 +159,7 @@ export default {
   .radio-img{
     margin-right: 10px;
   }
-  /deep/.el-radio{
+  ::v-deep.el-radio{
     display: flex;
     align-items: center;
     .el-radio__label{

src/views/course/sop/SopDialog.vue

@@ -286,13 +286,13 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align:center;
 
 }
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 </style>

src/views/course/sop/index.vue

@@ -649,13 +649,13 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align:center;
 
 }
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 </style>

src/views/course/userCoursePeriod/index.vue

@@ -33,40 +33,6 @@
     </el-form>
 
     <el-row :gutter="10" class="mb8">
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="primary"-->
-<!--          plain-->
-<!--          icon="el-icon-plus"-->
-<!--          size="mini"-->
-<!--          @click="handleAdd"-->
-<!--          v-hasPermi="['course:period:add']"-->
-<!--        >新增-->
-<!--        </el-button>-->
-<!--      </el-col>-->
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="warning"-->
-<!--          plain-->
-<!--          icon="el-icon-download"-->
-<!--          size="mini"-->
-<!--          @click="handleExport"-->
-<!--          v-hasPermi="['course:period:export']"-->
-<!--        >导出-->
-<!--        </el-button>-->
-<!--      </el-col>-->
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="primary"-->
-<!--          plain-->
-<!--          icon="el-icon-edit"-->
-<!--          size="mini"-->
-<!--          @click="handleBatchSetRedPacket"-->
-<!--          v-hasPermi="['course:period:export']"-->
-<!--          :disabled="batchSetRedPacketDisabled"-->
-<!--        >批量设置红包-->
-<!--        </el-button>-->
-<!--      </el-col>-->
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
@@ -77,6 +43,12 @@
                        :formatter="periodStatusFormatter"/>
       <el-table-column label="开营开始时间" align="center" prop="periodStartingTime" width="180"/>
       <el-table-column label="开营结束时间" align="center" prop="periodEndTime" width="180"/>
+<!--      <el-table-column label="看课休息开关" align="center" prop="isOpenRestReminder">-->
+<!--        <template slot-scope="scope">-->
+<!--          <el-tag v-if="scope.row.isOpenRestReminder==1" type="success">开启</el-tag>-->
+<!--          <el-tag v-if="scope.row.isOpenRestReminder==0" type="success">关闭</el-tag>-->
+<!--        </template>-->
+<!--      </el-table-column>-->
       <el-table-column label="创建时间" align="center" prop="createTime" width="180"/>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
@@ -95,6 +67,47 @@
             @click="handlePeriodSettings(scope.row)"
           >营期相关设置
           </el-button>
+          <!-- 根据 isNeedRegisterMember 动态显示按钮 -->
+          <el-button
+            v-if="scope.row.isNeedRegisterMember === '0'"
+            size="mini"
+            type="text"
+            icon="el-icon-open"
+            @click="handlePeriodUser(scope.row, '1')"
+          >开启单独注册会员
+          </el-button>
+<!--          <el-button-->
+<!--            v-else-if="scope.row.isNeedRegisterMember === '1'"-->
+<!--            size="mini"-->
+<!--            type="text"-->
+<!--            icon="el-icon-turn-off"-->
+<!--            @click="handlePeriodUser(scope.row, '0')"-->
+<!--          >关闭单独注册会员-->
+<!--          </el-button>-->
+<!--          <el-button-->
+<!--            v-if="scope.row.isOpenRestReminder ===null||scope.row.isOpenRestReminder === undefined || scope.row.isOpenRestReminder===1 "-->
+<!--            size="mini"-->
+<!--            type="text"-->
+<!--            icon="el-icon-open"-->
+<!--            @click="handlePeriodUserOpenReminder(scope.row, '0')"-->
+<!--          >关闭看课休息-->
+<!--          </el-button>-->
+<!--          <el-button-->
+<!--            v-if="scope.row.isOpenRestReminder ===null||scope.row.isOpenRestReminder === undefined ||scope.row.isOpenRestReminder === 0"-->
+<!--            size="mini"-->
+<!--            type="text"-->
+<!--            icon="el-icon-open"-->
+<!--            @click="handlePeriodUserOpenReminder(scope.row, '1')"-->
+<!--          >打开看课休息-->
+<!--          </el-button>-->
+<!--          <el-button-->
+<!--          v-else-->
+<!--          size="mini"-->
+<!--          type="text"-->
+<!--          icon="el-icon-open"-->
+<!--          @click="handlePeriodUser(scope.row, '1')"-->
+<!--        >开启单独注册会员-->
+<!--        </el-button>-->
         </template>
       </el-table-column>
     </el-table>
@@ -107,53 +120,36 @@
       @pagination="getList"
     />
 
-    <!-- 添加或修改会员营期对话框-->
+    <!-- 营期详情 -->
     <el-drawer :title="title" :visible.sync="open" size="700px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="营期名称" prop="periodName">
-          <el-input disabled v-model="form.periodName" placeholder="请输入营期名称"/>
-        </el-form-item>
-        <el-form-item label="课程风格" prop="courseStyle">
-          <image-upload disabled v-model="form.courseStyle" :limit="1"/>
-        </el-form-item>
-        <el-form-item label="直播间风格" prop="liveRoomStyle">
-          <image-upload disabled v-model="form.liveRoomStyle" :limit="1"/>
-        </el-form-item>
-        <el-form-item label="红包发放方式" prop="redPacketGrantMethod">
-          <el-radio-group disabled v-model="form.redPacketGrantMethod">
-            <el-radio :label="1">按课程</el-radio>
-            <el-radio :label="2">按营期</el-radio>
-          </el-radio-group>
-        </el-form-item>
-        <el-form-item label="营期类型" prop="periodType">
-          <el-radio-group disabled v-model="form.periodType">
-            <el-radio :label="1">多课程</el-radio>
-            <el-radio :label="2">单课程</el-radio>
-          </el-radio-group>
-        </el-form-item>
-        <el-form-item label="开营日期" prop="periodStartingTime">
-          <el-date-picker
-            disabled
-            :style="{display: form.periodType == 1 ? '' : 'none !important'}"
-            v-model="form.dateRange"
-            @change="timeChange(1)"
-            type="daterange"
-            range-separator="至"
-            start-placeholder="开始日期"
-            end-placeholder="结束日期"
-            value-format="yyyy-MM-dd">
-          </el-date-picker>
-          <el-date-picker
-            disabled
-            :style="{display: form.periodType == 2 ? '' : 'none !important'}"
-            @change="timeChange(2)"
-            v-model="form.date"
-            type="date"
-            value-format="yyyy-MM-dd"
-            placeholder="选择日期">
-          </el-date-picker>
-        </el-form-item>
-      </el-form>
+      <div class="period-detail-drawer">
+        <el-descriptions :column="1" border label-class-name="period-detail-label">
+          <el-descriptions-item label="营期名称">{{ form.periodName || '-' }}</el-descriptions-item>
+          <el-descriptions-item label="课程风格">
+            <el-image
+              v-if="form.courseStyle"
+              :src="form.courseStyle"
+              :preview-src-list="[form.courseStyle]"
+              fit="contain"
+              class="period-style-image"
+            />
+            <span v-else class="period-detail-empty">暂无</span>
+          </el-descriptions-item>
+          <el-descriptions-item label="直播间风格">
+            <el-image
+              v-if="form.liveRoomStyle"
+              :src="form.liveRoomStyle"
+              :preview-src-list="[form.liveRoomStyle]"
+              fit="contain"
+              class="period-style-image"
+            />
+            <span v-else class="period-detail-empty">暂无</span>
+          </el-descriptions-item>
+          <el-descriptions-item label="红包发放方式">{{ formatRedPacketGrantMethod(form.redPacketGrantMethod) }}</el-descriptions-item>
+          <el-descriptions-item label="营期类型">{{ formatPeriodType(form.periodType) }}</el-descriptions-item>
+          <el-descriptions-item label="开营日期">{{ formatPeriodDate(form) }}</el-descriptions-item>
+        </el-descriptions>
+      </div>
     </el-drawer>
 
     <!-- 添加训练营对话框 -->
@@ -248,13 +244,6 @@
       </div>
     </el-dialog>
 
-    <!--    <red-packet-->
-    <!--      :visible.sync="redPacketVisible"-->
-    <!--      :periodId="currentRedPacketData.periodId"-->
-    <!--      :videoId="currentRedPacketData.videoId"-->
-    <!--      @success="handleRedPacketSuccess"-->
-    <!--    />-->
-
     <!-- 营期相关设置抽屉 -->
     <el-drawer
       title="营期相关设置"
@@ -316,6 +305,7 @@ import {
   getPeriod,
   pagePeriod,
   updatePeriod,
+  updatePeriodIsNeedRegisterMember,
   getDays,
   addCourse,
   updateCourseTime,
@@ -455,7 +445,6 @@ export default {
     };
   },
   created() {
-
     courseList().then(response => {
       this.courseList = response.list;
     });
@@ -565,10 +554,63 @@ export default {
           this.form.date = this.form.periodStartingTime;
         }
         this.open = true;
-        this.title = "修改会员营期";
+        this.title = "营期详情";
         this.isDisabledDateRange = true;
       });
     },
+    /** 处理单独注册会员开关 */
+    handlePeriodUser(data, open) {
+      const actionText = open === '1' ? '开启' : '关闭';
+      this.$confirm(`确定要${actionText}【${data.periodName}】的单独注册会员功能吗？`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        var data1 = {
+          periodId:data.periodId,
+          isNeedRegisterMember:open,
+        }
+        updatePeriodIsNeedRegisterMember(data1).then(response => {
+          if (response.code === 200) {
+            this.msgSuccess(`${actionText}成功`);
+            this.getList();
+          } else {
+            this.msgError(response.msg || `${actionText}失败`);
+          }
+        }).catch(error => {
+          console.error(`${actionText}单独注册会员失败:`, error);
+          this.msgError(`${actionText}失败`);
+        });
+      }).catch(() => {
+        this.$message.info('已取消操作');
+      });
+    },
+    // handlePeriodUserOpenReminder(data, open) {
+    //   const actionText = open === '1' ? '开启' : '关闭';
+    //   this.$confirm(`确定要${actionText}【${data.periodName}】的看课休息暂停功能吗？`, '提示', {
+    //     confirmButtonText: '确定',
+    //     cancelButtonText: '取消',
+    //     type: 'warning'
+    //   }).then(() => {
+    //     var data1 = {
+    //       periodId:data.periodId,
+    //       isOpenRestReminder:open,
+    //     }
+    //     updatePeriodIsOpenRestReminder(data1).then(response => {
+    //       if (response.code === 200) {
+    //         this.msgSuccess(`${actionText}成功`);
+    //         this.getList();
+    //       } else {
+    //         this.msgError(response.msg || `${actionText}失败`);
+    //       }
+    //     }).catch(error => {
+    //       console.error(`${actionText}单独注册会员失败:`, error);
+    //       this.msgError(`${actionText}失败`);
+    //     });
+    //   }).catch(() => {
+    //     this.$message.info('已取消操作');
+    //   });
+    // },
     /** 提交按钮 */
     submitForm() {
       this.$refs["form"].validate(valid => {
@@ -646,19 +688,6 @@ export default {
       this.batchRedPacketVisible = true;
     },
 
-    /** 处理批量设置红包保存 */
-    // handleBatchRedPacketSave(data) {
-    //   // 这里等待接口提供后补充具体实现
-    //   // 示例代码：
-    //   // batchSetRedPacket(data).then(response => {
-    //   //   if (response.code === 200) {
-    //   //     this.$message.success('批量设置成功');
-    //   //     this.getList();
-    //   //   }
-    //   // });
-    //   this.batchRedPacketVisible = false;
-    // },
-
     /** 获取公司下拉列表*/
     getCompanyList() {
       this.loading = true;
@@ -942,7 +971,6 @@ export default {
         this.form.periodStartingTime = this.form.dateRange[0];
         this.form.periodEndTime = this.form.dateRange[1];
 
-
         // 转换为天数
         let days = this.getDiff(this.form.periodStartingTime, this.form.periodEndTime);
         for (let i = 0; i < days; i++) {
@@ -1198,6 +1226,23 @@ export default {
       };
       return statusMap[row.periodStatus] || '未知状态';
     },
+    formatRedPacketGrantMethod(value) {
+      const map = { 1: '按课程', 2: '按营期' };
+      return map[value] || '-';
+    },
+    formatPeriodType(value) {
+      const map = { 1: '多课程', 2: '单课程' };
+      return map[value] || '-';
+    },
+    formatPeriodDate(form) {
+      if (form.periodType == 1 && form.periodStartingTime && form.periodEndTime) {
+        return `${form.periodStartingTime} 至 ${form.periodEndTime}`;
+      }
+      if (form.periodStartingTime) {
+        return form.periodStartingTime;
+      }
+      return '-';
+    },
     /** 开课状态格式化 */
     courseStatusFormatter(row) {
       const statusMap = {
@@ -1472,4 +1517,20 @@ export default {
   display: flex;
   align-items: center;
 }
+
+.period-detail-drawer {
+  padding: 0 20px 20px;
+}
+
+.period-style-image {
+  width: 148px;
+  height: 148px;
+  border: 1px solid #dcdfe6;
+  border-radius: 4px;
+  background-color: #f5f7fa;
+}
+
+.period-detail-empty {
+  color: #909399;
+}
 </style>

src/views/qw/aiSop/aiSop.vue

@@ -781,13 +781,13 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align:center;
   display: block;
 }
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 </style>

src/views/qw/qwChat/qq.vue

@@ -802,11 +802,11 @@ export default {
         padding: 0 8px;
     }
 
-    /deep/.el-dialog__headerbtn{
+    ::v-deep.el-dialog__headerbtn{
          top:10px;
     }
 
-    /deep/.el-dialog:not(.is-fullscreen) {
+    ::v-deep.el-dialog:not(.is-fullscreen) {
         margin-top: 0 !important;
     }
 

src/views/qw/sop/addAiChatSop.vue

@@ -571,13 +571,13 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align:center;
   display: block;
 }
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 </style>

src/views/qw/sop/addSop.vue

@@ -1105,14 +1105,14 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align: center;
   display: block;
 }
 
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 

src/views/qw/sop/aiChatSop.vue

@@ -172,7 +172,7 @@
             type="text"
             icon="el-icon-edit"
             @click="selectSchedule(scope.row)"
-         
+
           >查看营期</el-button>
           <el-button
             v-if="scope.row.status==2"
@@ -910,13 +910,13 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align:center;
   display: block;
 }
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 </style>

src/views/qw/sop/deptSop.vue

@@ -1824,14 +1824,14 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align: center;
   display: block;
 }
 
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 

src/views/qw/sop/goupSop.vue

@@ -503,13 +503,13 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align:center;
 
 }
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 </style>

src/views/qw/sop/mySop.vue

@@ -1824,14 +1824,14 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align: center;
   display: block;
 }
 
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 

src/views/qw/sop/sop.vue

@@ -1913,14 +1913,14 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align: center;
   display: block;
 }
 
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 

src/views/qw/sop/upAiChatDateSop.vue

@@ -548,13 +548,13 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align:center;
   display: block;
 }
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 </style>

src/views/qw/sop/updateSop.vue

@@ -825,13 +825,13 @@ export default {
 };
 </script>
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   padding: 0 4px;
   text-align:center;
   display: block;
 }
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 20px;
 }
 /* 弹窗固定高度 */

src/views/qw/sopTemp/addAiChatTemp.vue

@@ -314,12 +314,12 @@ export default {
 </script>
 
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   text-align: center;
 }
 
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 10px;
 }
 

src/views/qw/sopTemp/addSopTemp.vue

@@ -976,12 +976,12 @@ export default {
 </script>
 
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   text-align: center;
 }
 
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 10px;
 }
 </style>

src/views/qw/sopTemp/addSopTempOld.vue

@@ -724,11 +724,11 @@ export default {
 </script>
 
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   text-align:center;
 }
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 10px;
 }
 </style>

src/views/qw/sopTemp/addTemp.vue

@@ -184,12 +184,12 @@ export default {
 </script>
 
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   text-align: center;
 }
 
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 10px;
 }
 </style>

src/views/qw/sopTemp/updateAiChatTemp.vue

@@ -310,12 +310,12 @@ export default {
 </script>
 
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   text-align: center;
 }
 
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 10px;
 }
 

src/views/qw/sopTemp/updateSopTemp.vue

@@ -659,12 +659,12 @@
   color: #fff !important;
 }
 
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   text-align: center;
 }
 
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 10px;
 }
 
@@ -672,7 +672,7 @@
   cursor: pointer;
 }
 
-/deep/ .el-badge__content.is-fixed {
+::v-deep .el-badge__content.is-fixed {
   top: 10px !important;
   right: 0 !important;
   width: 8px;

src/views/qw/sopTemp/updateSopTemp2.vue

@@ -896,12 +896,12 @@ export default {
 </script>
 
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   text-align: center;
 }
 
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 10px;
 }
 </style>

src/views/qw/sopTemp/updateSopTempOld.vue

@@ -654,11 +654,11 @@ export default {
 </script>
 
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   text-align:center;
 }
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 10px;
 }
 </style>

src/views/qw/sopTemp/updateTemp.vue

@@ -190,12 +190,12 @@ export default {
 </script>
 
 <style scoped>
-.custom-input /deep/ .el-input__inner {
+.custom-input ::v-deep .el-input__inner {
   height: 20px;
   text-align: center;
 }
 
-.custom-input /deep/ .el-input__icon {
+.custom-input ::v-deep .el-input__icon {
   line-height: 10px;
 }
 </style>

vue.config.js

@@ -29,6 +29,16 @@ module.exports = {
   lintOnSave: process.env.NODE_ENV === 'development',
   // 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建。
   productionSourceMap: false,
+  css: {
+    loaderOptions: {
+      scss: {
+        implementation: require('sass')
+      },
+      sass: {
+        implementation: require('sass')
+      }
+    }
+  },
   // webpack-dev-server 相关配置
   devServer: {
     host: '0.0.0.0',