日报分享

src/views/week/dailyHistoricalDetails.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="dailyHistoricalDetails">
-    <div class="dailyHistoricalDetailsBox">
+    <div class="dailyHistoricalDetailsBox" v-if="setDailyDetailsBoxFlag">
       <!--        顶部条-->
       <div class="navBarTOP">
         <van-nav-bar class="navBar" title="日报详情" left-arrow @click-left="onClickLeft">
@@ -544,10 +544,12 @@
     <share
       v-if="setShareFlag"
       :reportTarget="reportTarget"
-      :reportId="reportId"
+      :reportId="$route.query.reportId"
       @setShareImg="setShareImg"
+      @setDailyDetailsBox="setDailyDetailsBox"
       :urlList="urlList"
-      :reportRemarksIndex="reportRemarksIndex"></share>
+      :reportRemarksIndex="reportRemarksIndex"
+      :checkedPlan="checkedPlan"></share>
     <!--分享图片列表 -->
     <el-dialog
       title="选择分享的图片"
@@ -558,31 +560,34 @@
       @close="wuliaoTableClose"
       custom-class="shareImgFlag">
       <div v-if="reportTarget.photos">
+        <p style="margin-bottom: 10px; margin-top: 0; display: flex">
+          今日总结&明日规划<van-checkbox
+            v-model="checkedPlan"
+            style="margin-left: 10px"></van-checkbox>
+        </p>
         <div v-for="(item, index) in reportTarget.photos" :key="index">
-          <p style="margin-bottom: 10px; margin-top: 0">{{ item.taskName }}</p>
-          <van-row gutter="10" class="visitIMG1">
-            <van-col
-              span="6"
-              style="padding-bottom: 10px; position: relative"
-              v-for="(itemImg, indexImg) in item.photos"
-              :key="indexImg">
+          <p style="margin-bottom: 10px">{{ item.taskName }}</p>
+          <div class="shareVisitImg">
+            <div v-for="(itemImg, indexImg) in item.photos" :key="indexImg">
               <img :src="itemImg.fileUrl" alt="" @click="selectImg(itemImg)" />
               <van-icon
                 @click.stop
                 name="success"
                 class="activaImg"
-                color="red"
-                size="30"
+                color="#fff"
+                size="15"
                 style="
                   position: absolute;
-                  top: 50%;
-                  left: 50%;
-                  margin: -15px 0 0 -15px;
+                  right: 0;
+                  bottom: 0;
+                  /* margin: -15px 0 0 -15px; */
                   pointer-events: none;
+                  background: #2b73cf;
+                  border: 2px solid #fff;
                 "
                 v-if="itemImg.checked" />
-            </van-col>
-          </van-row>
+            </div>
+          </div>
         </div>
       </div>
       <span slot="footer" class="footer-btn">
@@ -683,6 +688,8 @@ export default {
       shareImgFlag: false,
       urlList: [],
       reportId: '',
+      checkedPlan: true, //今日总结&明日规划
+      setDailyDetailsBoxFlag: true,
       //
     };
   },
@@ -708,6 +715,8 @@ export default {
     },
   },
   activated() {
+    this.setDailyDetailsBoxFlag = true;
+    this.shareImgFlag = false;
     this.reportId = this.$route.query.reportId ? this.$route.query.reportId.replace('?', '') : '';
     console.log(this.reportId);
     this.source = this.$route.query.source;
@@ -716,6 +725,9 @@ export default {
     this.setShareFlag = false;
   },
   methods: {
+    setDailyDetailsBox(flag) {
+      this.setDailyDetailsBoxFlag = flag;
+    },
     setShareImg(flag) {
       this.setShareFlag = flag;
     },
@@ -738,12 +750,16 @@ export default {
     },
     // 确认分享
     confirmShare() {
-      this.shareImgFlag = false;
       this.reportTarget.photos.forEach((item) => {
         item.photos.forEach((val) => {
           if (val.checked) this.urlList.push(val.fileUrl);
         });
       });
+      if (this.urlList.length == 0 && !this.checkedPlan) {
+        this.$notify({ type: 'warning', message: '请选择分享内容！', className: 'notifyIndex' });
+        return;
+      }
+      this.shareImgFlag = false;
       this.setShareFlag = true;
     },
     pviewFn(val, imgVal) {
@@ -1159,4 +1175,33 @@ export default {
     }
   }
 }
+.shareImgFlag {
+  .shareVisitImg {
+    display: flex;
+    flex-wrap: wrap;
+    div {
+      width: 22%;
+      height: 80px;
+      margin-right: 3%;
+      margin-top: 10px;
+      position: relative;
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+  .el-dialog__header {
+    display: flex;
+    .el-dialog__title {
+      flex: 1;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+  }
+}
+.notifyIndex {
+  z-index: 999999 !important;
+}
 </style>