feat:修改项目封面图

src/views/projectcenter/ProjectAdd.vue

@@ -3,8 +3,7 @@
   <div class="projectAdd">
     <div class="header">
       <span class="title"
-      >{{
+        >{{ projectInfo.id ? "编辑" : "创建"
-          projectInfo.id ? "编辑" : "创建"
         }}{{ ptojectType == "3" ? "班级" : "项目" }}</span
       >
       <div
@@ -59,7 +58,7 @@
               class="nameimg"
               src="../../assets/images/basicinfo/asterisk.png"
             />
-            <div class="inname">封面图2</div>
+            <div class="inname">封面图</div>
           </div>
           <div class="in select" style="flex: 1; display: flex">
             <div
@@ -111,7 +110,8 @@
                 line-height: 36px;
               "
             >
-              查看更多 <img src="../../assets/images/projectadd/go.png"  alt=""/>
+              查看更多
+              <img src="../../assets/images/projectadd/go.png" alt="" />
             </div>
           </div>
         </div>
@@ -280,7 +280,9 @@
           <div class="inname" style="width: 50px">模版</div>
           <div class="in select" style="margin-left: 2px">
             <a-select
-                :getPopupContainer="triggerNode => (triggerNode.parentNode || document.body)"
+              :getPopupContainer="
+                (triggerNode) => triggerNode.parentNode || document.body
+              "
               placeholder="请选择模版"
               style="width: 100%"
               :options="classifyList5"
@@ -337,8 +339,8 @@
             class="learnBgItem"
             :style="{
               border:
-              pathBgId === item.code
+                projectInfo.picUrl === item.value
-                ? '2px solid rgba(78, 166, 255, 1)'
+                  ? '3px solid rgba(78, 166, 255, 1)'
                   : '1px solid #ccc',
               'background-image': 'url(' + item.value.split(',')[0] + ')',
             }"
@@ -385,14 +387,14 @@ export default {
     const routers = useRoute();
     const router = useRouter();
     const state = reactive({
-      datePartial: 'start',
+      datePartial: "start",
       loading: false,
       currentPage: 1, //当前页
       tableDataTotal: -1, //模版列表总数
       pageSize: 10, //每页10条数据
       totalPages: 0, //总页数
       viewDetail: null,
-      projectInfo: {id: ''},
+      projectInfo: { id: "" },
       projectPic: [],
       memberParam: {
         pageNo: 1,
@@ -406,7 +408,8 @@ export default {
       changeCondition: false,
       clickNum: 0,
       timeRange: [],
-      learnBgMore: false
+      learnBgMore: false,
+      pathBgId: null,
     });
 
     // 封面图选择
@@ -416,6 +419,7 @@ export default {
     };
     onMounted(() => {
       state.projectPic = store.state.project_pic.map((e) => ({
+        code: e.id,
         value: e.value,
         label: e.name,
       }));
@@ -423,7 +427,7 @@ export default {
       getProjectInfo();
       getTemplate();
       state.ptojectType = routers.query.ptojectType;
-      // console.log("routers.query.ptojectType", routers.query.ptojectType);
+      console.log("获取封面图", state.projectPic);
     });
 
     watch(routers.query, () => {
@@ -439,8 +443,7 @@ export default {
       (state.projectInfo.id || state.projectInfo.parentId) &&
         api
           .getProjectDetail({
-            projectId:
+            projectId: state.projectInfo.id || state.projectInfo.parentId,
-                state.projectInfo.id || state.projectInfo.parentId,
           })
           .then((res) => {
             state.projectInfo = {
@@ -450,7 +453,10 @@ export default {
             !routers.query.projectId &&
               !!routers.query.parentId &&
               (state.projectInfo.name = "");
-            state.timeRange = [state.projectInfo.beginTime, state.projectInfo.endTime];
+            state.timeRange = [
+              state.projectInfo.beginTime,
+              state.projectInfo.endTime,
+            ];
             state.courseSyncFlag = !!state.projectInfo.courseSyncFlag;
             if (Number(state.projectInfo.status) === -5) {
               let obj = {
@@ -485,8 +491,8 @@ export default {
 
     const classificationChange5 = (key, option) => {
       state.projectInfo = option;
-      state.projectInfo.projectTemplateId = option.id
+      state.projectInfo.projectTemplateId = option.id;
-      state.projectInfo.id = ''
+      state.projectInfo.id = "";
       state.projectInfo.type = 3;
       state.timeRange = [option.beginTime, option.endTime];
       state.projectInfo.parentName = routers.query.parentName;
@@ -593,14 +599,16 @@ export default {
       state.projectInfo.sourceBelongFullName = orgName;
     }
 
-
     const disabledDate = (current) => {
       //编辑的时候  开始实际只能选当前时间之前的时间
-      if (state.projectInfo.id && state.datePartial === 'start') {
+      if (state.projectInfo.id && state.datePartial === "start") {
-        return current && current > dayjs(state.timeRange[0]).endOf("YYYY-MM-DD HH:mm");
+        return (
+          current &&
+          current > dayjs(state.timeRange[0]).endOf("YYYY-MM-DD HH:mm")
+        );
       }
       // return current && current < dayjs().endOf('day');
-      return current && current < dayjs().subtract(1, 'days').endOf('day')
+      return current && current < dayjs().subtract(1, "days").endOf("day");
     };
 
     //显示更多路径背景弹窗
@@ -612,13 +620,14 @@ export default {
       state.learnBgMore = false;
     };
     function calendarChange(date, dateStr, partial) {
-      state.datePartial = partial
+      state.datePartial = partial;
     }
     const chooseImg2 = (item) => {
       // console.log(item);
+      state.projectInfo.picUrl = item.value;
       state.pathBgId = item.code;
-      state.pathBg = item.value.split(',')[0];
+      state.pathBg = item.value.split(",")[0];
-      state.mobilePicUrl = item.value.split(',')[1];
+      state.mobilePicUrl = item.value.split(",")[1];
     };
 
     return {
@@ -635,7 +644,7 @@ export default {
       handleChangeSelect,
       showLearnBgMore,
       closeLearnBgMore,
-      chooseImg2
+      chooseImg2,
     };
   },
 };
@@ -706,7 +715,7 @@ export default {
   }
 
   .active {
-    border: 2px solid rgba(78, 166, 255, 1);
+    border: 3px solid rgba(78, 166, 255, 1);
   }
 
   .content {