网页

src/project/qianxinan/AppCooperationPropaganda/addPropaganda.vue

@@ -49,7 +49,7 @@
           </div>
         </div>
         <!-- 素材库 -->
-        <div class="fodder_file" v-for="(item, index) in checkedList" :key="item.id">
+        <!-- <div class="fodder_file" v-for="(item, index) in checkedList" :key="item.id">
           <div class="item">
             <div class="images">
               <img src="https://cdn.cunwuyun.cn/dvcp/h5/file.png" alt="">
@@ -60,6 +60,18 @@
             </div>
             <div class="remove" @click="removeSucai(index)" style="color: #f72c27">删除</div>
           </div>
+        </div> -->
+        <!-- 网页 -->
+        <div class="fodder_file" v-for="(item, index) in webListInfo" :key="index">
+          <div class="item">
+            <div class="images">
+              <img src="https://cdn.cunwuyun.cn/dvcp/h5/file.png" alt="">
+            </div>
+            <div class="info">
+              <div class="name">{{ item.linkTitle }}</div>
+            </div>
+            <div class="remove" @click="removeWeb(index)" style="color: #f72c27">删除</div>
+          </div>
         </div>
       </div>
     </div>
@@ -180,12 +192,44 @@
         <div class="btnCancel" @click="showUpload = false">取消</div>
       </div>
 		</u-popup>
+
+    <u-popup v-model="showAddWeb" mode="bottom" border-radius="24" class="popup-form">
+      <div class="item">
+        <div class="left">
+          <span>*</span><span>标题</span>
+        </div>
+        <input type="text" class="right__text" v-model="webInfo.linkTitle" placeholder="请输入" maxlength="42"/>
+      </div>
+      <div class="item">
+        <div class="left">
+          <span>*</span><span>链接</span>
+        </div>
+        <input type="text" class="right__text" v-model="webInfo.linkUrl" placeholder="请输入" maxlength="682"/>
+      </div>
+      <div class="item">
+        <div class="left">
+          <span></span><span>描述</span>
+        </div>
+        <input type="text" class="right__text" v-model="webInfo.linkDesc" placeholder="请输入" maxlength="170"/>
+      </div>
+      <div class="items">
+        <div class="left">
+          <span style="margin-right: 8px"></span><span>封面图</span>
+        </div>
+        <div style="margin-top: 10px;">
+          <AiUploader v-model="webInfo.linkPicUrl" :limit="1" multiple action="/admin/file/add2"></AiUploader>
+        </div>
+      </div>
+      <div class="popup-btn" @click="addWeb">确定</div>
+		</u-popup>
+
+    
     
     <div class="btn">
       <div class="submitBtn" @click="confirm">通知成员发送</div>
     </div>
-
   </div>
+
 </template>
 
 <script>
@@ -313,6 +357,16 @@ export default {
               name: '文件',
               msgType: 'file'
             },
+            {
+              icon: 'https://cdn.cunwuyun.cn/dvcp/announce/ic-web.png',
+              name: '网页',
+              msgType: 'web'
+            },
+            {
+              icon: 'https://cdn.cunwuyun.cn/dvcp/announce/ic-web.png',
+              name: '小程序',
+              msgType: 'app'
+            },
           ]
         }
       ],
@@ -378,7 +432,10 @@ export default {
         'https://cdn.cunwuyun.cn/dvcp/announce/ic-video.png',
         'https://cdn.cunwuyun.cn/dvcp/announce/ic-web.png',
       ],
-      tagList: []
+      tagList: [],
+      showAddWeb: false,
+      webInfo: {},
+      webListInfo: []
     }
   },
   methods: {
@@ -424,6 +481,13 @@ export default {
     },
 
     uploadBtn(type) {
+      if(type == 'web') {
+        this.showAddWeb = true
+        return false
+      }
+      if(type == 'app') {
+        return
+      }
       let count = 9 - (this.files?.length || 0) - (this.checkedList?.length || 0)
       if(count > 0){
         let params = {
@@ -580,6 +644,16 @@ export default {
       })
       this.form.contents.push(...files)
 
+      //网页
+      this.webListInfo.map((item) => {
+        if(item.linkPicUrl && item.linkPicUrl.length) {
+          item.linkPicUrl = item.linkPicUrl[0].url
+        }
+        item.msgType = '4'
+      })
+
+      this.form.contents.push(...this.webListInfo)
+
       if(this.checkedList.length) {
         this.form.contents.push(...this.checkedList)
       }
@@ -687,6 +761,20 @@ export default {
 
     toSelectTag() {
       uni.navigateTo({url: `./selectTag?selected=${this.tagList.join(',')}`})
+    },
+
+    addWeb() {
+      if(!this.webInfo.linkTitle) {
+        return this.$u.toast('请输入标题')
+      }
+      if(!this.webInfo.linkUrl) {
+        return this.$u.toast('请输入链接')
+      }
+      this.webListInfo.push(this.webInfo)
+      this.showAddWeb = false
+    },
+    removeWeb(index) {
+      this.webListInfo.splice(index, 1)
     }
 
   },
@@ -1092,5 +1180,80 @@ export default {
       border-radius: 8px;
     }
   }
+  .popup-form {
+    .item {
+      display: flex;
+      padding: 32px;
+      box-sizing: border-box;
+      border-bottom: 1px solid #DDDDDD;
+
+      .left {
+        width: 240px;
+        span:first-child {
+          color: #FF4466;
+        }
+      }
+      
+      .right__text {
+        width: calc(100% - 240px);
+        text-align: right;
+      }
+
+      .color-999 {
+        color: #999;
+      }
+      .color-333 {
+        color: #333;
+      }
+      
+    }
+    .items {
+      padding: 32px;
+      box-sizing: border-box;
+      border-bottom: 1px solid #DDDDDD;
+
+      .left {
+        span:first-child {
+          color: #FF4466;
+        }
+      }
+      .text {
+        margin-top: 20px;
+      }
+      .textarea {
+        margin-top: 32px;
+      }
+      .tags {
+        margin-top: 20px;
+        span {
+          display: inline-block; 
+          width: 31%;
+          height: 80px;
+          line-height: 80px;
+          text-align: center;
+          box-sizing: border-box;
+          border-radius: 16px;
+          border: 1px solid #CCCCCC;
+          margin-right: 20px;
+          margin-bottom: 16px;
+        }
+        span:nth-child(3n) {
+          margin-right: 0;
+        }
+        .isCheck {
+          color: #FFF;
+          background: #4181FF;
+        }
+      }
+    }
+    .popup-btn {
+      width: 100%;
+      height: 98px;
+      background: #1365DD;
+      line-height: 98px;
+      text-align: center;
+      color: #FFF;
+    }
+  }
 }
 </style>