pages/supply/mySupply.vue

@@ -38,26 +38,94 @@
 </template>
 
 <script>
+import md5 from "@/common/md5.js";
 export default {
   data() {
     return {
       titleList: ["我的供需", "我的需求"],
       active: 0,
-      supplyList: new Array(5).fill({
-        image: "/static/supply/u1779.png",
-        title: "移动式空气消毒机",
-        time: "2021-08-30 14:50:00",
-        state: 1,
-      }),
+      supplyList:[],
     };
   },
-  onLoad() {},
+  onLoad() {
+    this.getMyList();
+  },
   methods: {
     toDetail(index) {
       uni.navigateTo({
         url: "/pages/supply/supply_detail?id=" + index,
       });
     },
+    getMyList() {
+      let md5Sign = md5(
+        "method=" +
+          "need" +
+          "&timestamp=" +
+          getApp().globalData.globalTimestamp +
+          "&secret=" +
+          getApp().globalData.secret
+      );
+      let url =
+        getApp().globalData.shareUrl +
+        "api/api.php" +
+        "?method=need&source=need&action=my_list&timestamp=" +
+        getApp().globalData.globalTimestamp +
+        "&sign=" +
+        md5Sign;
+      uni.request({
+        url: url,
+        method: "POST",
+        header: {
+          "content-type": "application/x-www-form-urlencoded",
+        },
+        data: {
+          openId: getApp().globalData.open_id,
+          s_type: this.active == 0 ? 2 : 1,
+        },
+        success: (res) => {
+          if (res.data.code === 200) {
+            let list = res.data.data.list;
+            /* 
+                supplyList: new Array(5).fill({
+                image: "/static/supply/u1779.png",
+                title: "移动式空气消毒机",
+                time: "2021-08-30 14:50:00",
+                state: 1,
+                }),
+                
+       */
+            this.supplyList = list.map((item) => {
+              let ob = {
+                image: "",
+                title: "",
+                time: "",
+                state: "",
+                id: "",
+              };
+              ob.id = item.id;
+              ob.title = item.title;
+              let time = this.$options.filters["globalTime"](item.addtime);
+              let timeSecond = this.$options.filters["globalTimeSecond"](
+                item.addtime
+              );
+              ob.time = time + " " + timeSecond;
+              ob.state = item.type;
+              ob.image = item.url;
+              return ob;
+            });
+            console.log(res.data.data.list);
+          }
+        },
+        fail: () => {
+          console.log("连接失败");
+        },
+      });
+    },
+  },
+  watch: {
+    active() {
+      this.getMyList();
+    },
   },
 };
 </script>

pages/supply/putSupply.vue

@@ -12,7 +12,8 @@
             @change="bindPickerChange"
             :value="index"
             :range="array"
-            range-key="name" class="pick"
+            range-key="name"
+            class="pick"
           >
             <view class="picker_title">
               <view class="pickername">
@@ -32,12 +33,31 @@
       <view class="update_photo">
         <view class="title"></view>
         <view>上传图片：</view>
-        <view class="update_container card">
-          <view class="update_button">
-            <view>
-              <image src="/static/appeal/photo.png" />
+        <view class="update_container card upload-parent-box">
+          <view class="update_button display-flex">
+            <view class="display-flex upload-box" @click="getImage('album')">
+              <img src="/static/appeal/photo.png" />
+              <view class="txt">上传</view>
+            </view>
+            <view
+              class="display-flex upload-box-photo"
+              v-for="(item, index) in uploadList"
+              :key="index"
+            >
+              <image
+                :src="item"
+                mode="aspectFit"
+                style="width: 100%; height: 100%"
+                @click="showLarge(item)"
+              />
+              <image
+                src="../../static/del.png"
+                class="del-icon"
+                mode="aspectFit"
+                style="width: 30rpx; height: 30rpx"
+                @click="delPhoto(index)"
+              ></image>
             </view>
-            <view class="txt">上传</view>
           </view>
         </view>
       </view>
@@ -61,6 +81,7 @@
   </view>
 </template>
 <script>
+import md5 from "@/common/md5.js";
 export default {
   data() {
     return {
@@ -68,31 +89,198 @@ export default {
       index: 0,
       supplyInfo: {
         title: "",
-        msg:"",
+        msg: "",
       },
-      company:{
-        name:"",
-        code:"",
-        tel:""
-      }
+      company: {
+        name: "",
+        code: "",
+        tel: "",
+      },
+      uploadList: [],
+      imgIdList: [],
     };
   },
   methods: {
     submit() {
-      console.log(this.supplyInfo);
-      console.log(this.company);
+      let md5Sign = md5(
+        "method=" +
+          "need" +
+          "&timestamp=" +
+          getApp().globalData.globalTimestamp +
+          "&secret=" +
+          getApp().globalData.secret
+      );
+      let url =
+        getApp().globalData.shareUrl +
+        "api/api.php" +
+        "?method=need&source=need&action=add&timestamp=" +
+        getApp().globalData.globalTimestamp +
+        "&sign=" +
+        md5Sign;
+      let postData = {
+        title: this.supplyInfo.title,
+        type: +this.index == 0 ? 2 : 1,
+        content: this.supplyInfo.msg,
+        company_name: this.company.name,
+        company_code: this.company.code,
+        phone: this.company.tel,
+        attach_ids: this.imgIdList.join(),
+        openId: getApp().globalData.open_id,
+      };
+      uni.request({
+        url: url,
+        method: "POST",
+        header: {
+          "content-type": "application/x-www-form-urlencoded",
+        },
+        data: postData,
+        success: (res) => {
+          if (res.data.code === 200) {
+            uni.showToast({
+              title: "发布供需成功",
+              icon: "none",
+              duration: 2500,
+            });
+            getApp().globalData.user_phone = this.company.tel;
+            setTimeout(() => {
+              uni.navigateBack({});
+            }, 2500);
+          } else {
+            uni.showToast({
+              title: res.data.msg,
+              icon: "none",
+              duration: 2500,
+            });
+          }
+        },
+        fail: () => {
+          console.log("连接失败");
+        },
+      });
     },
     bindPickerChange(e) {
       this.index = e.detail.value;
     },
+    getImage(type) {
+      let that = this;
+      if (that.uploadList.length >= 3) {
+        uni.showToast({
+          title: "最多上传3张图片",
+          icon: "none",
+          duration: 2500,
+        });
+        return;
+      }
+      uni.chooseImage({
+        sourceType: [type],
+        count: 3 - that.uploadList.length,
+        sizeType: ["original", "compressed"], //可以指定是原图还是压缩图，默认二者都有
+        success: (res) => {
+          for (let i = 0; i < res.tempFilePaths.length; i++) {
+            that.uploadList.push(res.tempFilePaths[i]);
+            that.uploadFileRequest(res.tempFilePaths[i]);
+          }
+        },
+      });
+    },
+    uploadFileRequest(fileVal) {
+      uni.showLoading({
+        title: "上传中",
+        mask: true,
+      });
+      let that = this;
+      let md5Sign = md5(
+        "method=" +
+          "upload" +
+          "&timestamp=" +
+          getApp().globalData.globalTimestamp +
+          "&secret=" +
+          getApp().globalData.secret
+      );
+      let url =
+        getApp().globalData.shareUrl +
+        "api/api.php" +
+        "?method=upload&source=consult&timestamp=" +
+        getApp().globalData.globalTimestamp +
+        "&sign=" +
+        md5Sign;
+      uni.uploadFile({
+        url: url, //需要设置为全局
+        filePath: fileVal,
+        name: "file",
+        formData: {
+          file: fileVal,
+        },
+        success: (res) => {
+          let tmpres = JSON.parse(res.data);
+          console.log(tmpres);
+          uni.hideLoading();
+          that.imgIdList.push(tmpres.data.id);
+        },
+        fail: (res) => {
+          console.log("上传请求失败");
+          console.log(res);
+        },
+      });
+    },
+    delPhoto(idx) {
+      this.uploadList.splice(idx, 1);
+      this.imgIdList.splice(idx, 1);
+    },
+    showLarge(src) {
+      uni.previewImage({
+        urls: [src],
+        longPressActions: {
+          itemList: ["发送给朋友", "保存图片"],
+          success: function (data) {},
+          fail: function (err) {
+            console.log(err.errMsg);
+          },
+        },
+      });
+    },
   },
 };
 </script>
 <style lang="scss" scoped>
+.upload-parent-box {
+  height: 150rpx;
+  padding-top: 25rpx;
+  padding-left: 20rpx;
+}
+.upload-box {
+  width: 25%;
+  background-color: #e0e0e0;
+  height: 110rpx;
+  border-radius: 10rpx;
+  padding-top: 15rpx;
+  img {
+    width: 60rpx;
+    height: 60rpx;
+  }
+}
+.upload-box-photo {
+  width: 25%;
+  height: 110rpx;
+  border-radius: 10rpx;
+  padding-top: 15rpx;
+  position: relative;
+}
+.del-icon {
+  position: absolute;
+  right: 0;
+  width: 30rpx;
+  height: 30rpx;
+}
+
+.update_button {
+  text-align: center;
+  display: flex;
+}
 .content {
   font-size: 25rpx;
   font-weight: 200;
-  padding:1% 2%;
+  padding: 1% 2%;
   .title {
     font-size: 30rpx;
     margin: 4% 0;
@@ -112,17 +300,17 @@ export default {
     margin-bottom: 2%;
   }
   .input {
-      padding: 0 2%;
-      margin: 2% 0;
-      display: inline-block;
-      width: 80%;
-      height: 70rpx;
-    }
+    padding: 0 2%;
+    margin: 2% 0;
+    display: inline-block;
+    width: 80%;
+    height: 70rpx;
+  }
   .supplyInfo {
     border-radius: 40rpx;
     padding: 4%;
     box-shadow: rgba(100, 100, 111, 0.2) 14rpx 14rpx 40rpx 14rpx;
-    .area{
+    .area {
       height: 200rpx;
     }
     .picker {
@@ -132,12 +320,12 @@ export default {
       display: flex;
       align-items: center;
       position: relative;
-      .pick{
-          width: 100%;
+      .pick {
+        width: 100%;
       }
       .picker_title {
         display: flex;
-        width:100%;
+        width: 100%;
         margin-left: 30rpx;
         align-items: center;
         justify-content: space-between;
@@ -163,7 +351,7 @@ export default {
       text-align: center;
     }
   }
-  .info{
+  .info {
     margin-top: 2%;
     border-radius: 40rpx;
     padding: 2% 4%;