|
|
@@ -1,22 +1,360 @@
|
|
|
<template>
|
|
|
- <view>
|
|
|
- 内容上传
|
|
|
- </view>
|
|
|
+ <view class="content">
|
|
|
+ <view class="supplyInfo">
|
|
|
+ <view class="flex">
|
|
|
+ <label>输入文本:</label>
|
|
|
+ <textarea v-model="supplyInfo.msg" class="area card"></textarea>
|
|
|
+ </view>
|
|
|
+ <view class="update_photo">
|
|
|
+ <view class="title"></view>
|
|
|
+ <view>选择图片:</view>
|
|
|
+ <view class="update_container card upload-parent-box">
|
|
|
+ <view class="update_button display-flex">
|
|
|
+ <view class="upload-box" @click="getImage('album')">
|
|
|
+ <view class="img">
|
|
|
+ <image src="/static/photo.png" class="photo"></image>
|
|
|
+ </view>
|
|
|
+ <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>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="flex">
|
|
|
+ <label>支部:</label>
|
|
|
+ <input type="text" v-model="supplyInfo.title" class="input card" />
|
|
|
+ </view>
|
|
|
+ <view class="flex">
|
|
|
+ <label>姓名:</label>
|
|
|
+ <input type="text" v-model="supplyInfo.name" class="input card" />
|
|
|
+ </view>
|
|
|
+ <button class="submit" @tap="submit">提交</button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
-
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
+import md5 from "@/common/md5.js";
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ supplyInfo: {
|
|
|
+ title: "",
|
|
|
+ msg: "",
|
|
|
+ name:''
|
|
|
+ },
|
|
|
+ uploadList: [],
|
|
|
+ imgIdList: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ submit() {
|
|
|
+ if (
|
|
|
+ this.supplyInfo.name === "" ||
|
|
|
+ this.supplyInfo.title === "" ||
|
|
|
+ this.supplyInfo.msg === ""
|
|
|
+ ) {
|
|
|
+ uni.showToast({
|
|
|
+ title: "内容不完善",
|
|
|
+ icon: "error",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ let md5Sign = md5(
|
|
|
+ "method=" +
|
|
|
+ "activity" +
|
|
|
+ "×tamp=" +
|
|
|
+ getApp().globalData.globalTimestamp +
|
|
|
+ "&secret=" +
|
|
|
+ getApp().globalData.secret
|
|
|
+ );
|
|
|
+ let url =
|
|
|
+ getApp().globalData.shareUrl +
|
|
|
+ "api/api.php" +
|
|
|
+ "?method=activity&action=process×tamp=" +
|
|
|
+ getApp().globalData.globalTimestamp +
|
|
|
+ "&sign=" +
|
|
|
+ md5Sign;
|
|
|
+ let postData = {
|
|
|
+ openid : "asfsfsffa",
|
|
|
+ activity_id : 1 , //这里固定是1
|
|
|
+ content : this.supplyInfo.msg,
|
|
|
+ department :this.supplyInfo.title,
|
|
|
+ user_name : this.supplyInfo.name,
|
|
|
+ attach_ids : '' // 3,34,5,5,6
|
|
|
+ };
|
|
|
+ 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: 2000,
|
|
|
+ });
|
|
|
+ // uni.setStorageSync("supply_name", this.company.name);
|
|
|
+ // uni.setStorageSync("supply_code", this.company.code);
|
|
|
+ // uni.setStorageSync("supply_tel", this.company.tel);
|
|
|
+ setTimeout(() => {
|
|
|
+ uni.navigateBack({});
|
|
|
+ }, 1500);
|
|
|
+ } 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" + "×tamp=" +
|
|
|
+ getApp().globalData.globalTimestamp +
|
|
|
+ "&secret=" + getApp().globalData.secret
|
|
|
+ );
|
|
|
+ let url =
|
|
|
+ getApp().globalData.shareUrl +
|
|
|
+ "api/upload.php" +
|
|
|
+ "?method=upload&source=activity&id=1×tamp=" +
|
|
|
+ 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>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.upload-parent-box {
|
|
|
+ height: 150rpx;
|
|
|
+ padding-top: 25rpx;
|
|
|
+ padding-left: 20rpx;
|
|
|
+}
|
|
|
+.upload-box {
|
|
|
+ display: flex;
|
|
|
+ flex-flow: column;
|
|
|
+ width: 25%;
|
|
|
+ background-color: #e0e0e0;
|
|
|
+ height: 140rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ padding-top: 15rpx;
|
|
|
+ image {
|
|
|
+ width: 60rpx !important;
|
|
|
+ height: 60rpx !important;
|
|
|
+ }
|
|
|
+}
|
|
|
+.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: 28rpx;
|
|
|
+ font-weight: 200;
|
|
|
+ padding: 1% 2%;
|
|
|
+ .title {
|
|
|
+ font-size: 30rpx;
|
|
|
+ margin: 4% 0;
|
|
|
+ }
|
|
|
+ label {
|
|
|
+ display: inline-block;
|
|
|
+ width: 25%;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+ .card {
|
|
|
+ background-color: rgb(248, 247, 247);
|
|
|
+ border-radius: 10rpx;
|
|
|
+ }
|
|
|
+ .flex {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 2%;
|
|
|
+ }
|
|
|
+ .input {
|
|
|
+ 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;
|
|
|
+ margin: 30rpx 0 30rpx 0;
|
|
|
+ .area {
|
|
|
+ height: 200rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ .picker {
|
|
|
+ width: 80%;
|
|
|
+ height: 70rpx;
|
|
|
+ background: rgb(248, 247, 247);
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ position: relative;
|
|
|
+ .pick {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ .picker_title {
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ margin-left: 30rpx;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ .triangle-down {
|
|
|
+ width: 0;
|
|
|
+ height: 0;
|
|
|
+ border-top: 15rpx solid rgb(173, 173, 173);
|
|
|
+ border-left: 15rpx solid transparent;
|
|
|
+ border-right: 15rpx solid transparent;
|
|
|
+ position: absolute;
|
|
|
+ right: 10rpx;
|
|
|
+ }
|
|
|
+ .pickername {
|
|
|
+ font-weight: 100;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .upload-box {
|
|
|
+ width: 25%;
|
|
|
+ background-color: #e0e0e0;
|
|
|
+ height: 110rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ padding-top: 15rpx;
|
|
|
+ }
|
|
|
+ .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;
|
|
|
+ }
|
|
|
+ image {
|
|
|
+ width: 60rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ }
|
|
|
+ .update_button {
|
|
|
+ text-align: center;
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .info {
|
|
|
+ margin-top: 2%;
|
|
|
+ border-radius: 40rpx;
|
|
|
+ padding: 2% 4%;
|
|
|
+ box-shadow: rgba(100, 100, 111, 0.2) 14rpx 14rpx 40rpx 14rpx;
|
|
|
+ }
|
|
|
+ .submit {
|
|
|
+ color: white;
|
|
|
+ font-weight: normal;
|
|
|
+ width: 70%;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ background-color: #02a7f0;
|
|
|
+ margin: 50rpx auto;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|