活动列表

common/tool.js

@@ -167,3 +167,4 @@ export function checkDomain(str) {
     /^([\w-]+\.)+((com)|(net)|(org)|(gov\.cn)|(info)|(cc)|(com\.cn)|(net\.cn)|(org\.cn)|(name)|(biz)|(tv)|(cn)|(mobi)|(name)|(sh)|(ac)|   (io)|(tw)|(com\.tw)|(hk)|(com\.hk)|(ws)|(travel)|(us)|(tm)|(la)|(me\.uk)|(org\.uk)|(ltd\.uk)|(plc\.uk)|(in)|(eu)|(it)|(jp))$/;
   return domain.test(str);
 }
+

common/upload.js

@@ -43,3 +43,70 @@ export function uploadFile(rules) {
     });
   });
 }
+
+// 下载
+export function downloadFile(url, fileName) {
+  const a = document.createElement("a");
+  a.setAttribute("href", url)
+  a.setAttribute("download", fileName)
+  a.setAttribute("target", "_blank")
+  let clickEvent = document.createEvent("MouseEvents");
+  clickEvent.initEvent("click", true, true);
+  a.dispatchEvent(clickEvent);
+}
+
+export function base64ToPath(base64) {
+  return new Promise(function(resolve, reject) {
+      if (typeof window === 'object' && 'document' in window) {
+          base64 = base64.split(',')
+          var type = base64[0].match(/:(.*?);/)[1]
+          var str = atob(base64[1])
+          var n = str.length
+          var array = new Uint8Array(n)
+          while (n--) {
+              array[n] = str.charCodeAt(n)
+          }
+          return resolve((window.URL || window.webkitURL).createObjectURL(new Blob([array], { type: type })))
+      }
+      var extName = base64.match(/data\:\S+\/(\S+);/)
+      if (extName) {
+          extName = extName[1]
+      } else {
+          reject(new Error('base64 error'))
+      }
+      var fileName = Date.now() + '.' + extName
+      if (typeof plus === 'object') {
+          var bitmap = new plus.nativeObj.Bitmap('bitmap' + Date.now())
+          bitmap.loadBase64Data(base64, function() {
+              var filePath = '_doc/uniapp_temp/' + fileName
+              bitmap.save(filePath, {}, function() {
+                  bitmap.clear()
+                  resolve(filePath)
+              }, function(error) {
+                  bitmap.clear()
+                  reject(error)
+              })
+          }, function(error) {
+              bitmap.clear()
+              reject(error)
+          })
+          return
+      }
+      if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) {
+          var filePath = wx.env.USER_DATA_PATH + '/' + fileName
+          wx.getFileSystemManager().writeFile({
+              filePath: filePath,
+              data: base64.replace(/^data:\S+\/\S+;base64,/, ''),
+              encoding: 'base64',
+              success: function() {
+                  resolve(filePath)
+              },
+              fail: function(error) {
+                  reject(error)
+              }
+          })
+          return
+      }
+      reject(new Error('not support'))
+  })
+}

pages.json

@@ -37,7 +37,9 @@
     {
       "path": "pages/vcard/index",
       "style": {
-        "navigationBarTitleText": "电子名片"
+        "navigationBarTitleText": "电子名片",
+		"navigationBarBackgroundColor": "#353F5C",
+		"navigationBarTextStyle": "white"
       }
     },
     {

pages/actlist/index.vue

@@ -19,14 +19,15 @@
       <view class="line"></view>
       <view class="act-ward-box-btn">
         <text></text>
-        <view>下载海报</view>
+        <view @click="makePoster(item.distributionId)">下载海报</view>
       </view>
     </view>
   </view>
 </template>
 
 <script>
-import { getActList } from "@/utils/act";
+import { getActList, makePoster } from "@/utils/act";
+import { downloadFile, base64ToPath } from "@/common/upload";
 export default {
   data() {
     return {
@@ -49,6 +50,11 @@ export default {
         pageSize: 10,
       };
     },
+    makePoster(distributionId) {
+      makePoster({ distributionId }).then(async (res) => {
+        downloadFile(await base64ToPath(res), "海报");
+      });
+    },
   },
   onLoad(option) {},
   onShow() {

pages/profile/index.vue

@@ -2,6 +2,7 @@
   <view class="profile">
     <view class="profile-head">
       <image
+        class="profile-head-img"
         @click="toProfile"
         :src="
           userInfo && userInfo.avatar
@@ -10,24 +11,32 @@
         "
       ></image>
       <view>{{ userInfo && userInfo.realname }}</view>
+      <image
+        v-if="!userInfo.avatar"
+        class="profile-head-icon"
+        src="../../static/image/icon_camer.png"
+        mode=""
+      ></image>
     </view>
     <u-form v-if="userInfo" :model="userInfo" ref="uForm" labelWidth="160">
-      <u-form-item label="业务员ID"
-        ><u-input disabled v-model="userInfo.userAccount" border="bottom"
-      /></u-form-item>
-      <u-form-item label="姓名"
-        ><u-input disabled v-model="userInfo.realname" border="bottom"
-      /></u-form-item>
-      <u-form-item label="手机号码"
-        ><u-input
+      <u-form-item label="业务员ID">
+        <u-input disabled v-model="userInfo.userAccount" border="bottom" />
+      </u-form-item>
+      <u-form-item label="姓名">
+        <u-input disabled v-model="userInfo.realname" border="bottom" />
+      </u-form-item>
+      <u-form-item label="手机号码">
+        <u-input
           disabled
           v-model="userInfo.telphone"
           border="bottom"
           type="number"
-          maxlength="11" /></u-form-item
-      ><u-form-item label="身份证号"
-        ><u-input disabled v-model="userInfo.idCard" border="bottom"
-      /></u-form-item>
+          maxlength="11"
+        />
+      </u-form-item>
+      <u-form-item label="身份证号">
+        <u-input disabled v-model="userInfo.idCard" border="bottom" />
+      </u-form-item>
     </u-form>
   </view>
 </template>
@@ -51,28 +60,46 @@ export default {
   methods: {
     toProfile() {
       uploadFile().then((avatar) => {
-        sellerEdit({ avatar }).then((res) => {
+        sellerEdit({
+          avatar,
+        }).then((res) => {
           this.$u.toast("头像已上传");
           this.$store.dispatch("getUserInfo");
         });
       });
     },
   },
-  computed: { ...mapGetters(["userInfo"]) },
+  computed: {
+    ...mapGetters(["userInfo"]),
+  },
 };
 </script>
 
 <style scoped lang="scss">
+image {
+  width: 100%;
+  height: 100%;
+}
+
 .profile {
   padding: 68rpx 48rpx 0;
+
   .profile-head {
     margin: 0 auto 120rpx;
     width: 160rpx;
-    image {
+    position: relative;
+    .profile-head-img {
       width: 160rpx;
       height: 160rpx;
       border-radius: 50%;
     }
+    .profile-head-icon {
+      width: 56rpx;
+      height: 56rpx;
+      position: absolute;
+      top: 104rpx;
+      right: 0;
+    }
     view {
       padding-top: 20rpx;
       font-weight: bold;
@@ -81,6 +108,7 @@ export default {
       text-align: center;
     }
   }
+
   /deep/ {
     .u-input {
       background-color: #ffffff !important;

pages/vcard/index.vue

@@ -1,6 +1,40 @@
 <template>
-	<view>
-		123
+	<view class="vcard-ward">
+		<view class="vcard-ward-info">
+			<view class="vcard-ward-info-top">
+				个人名片
+			</view>
+			<view class="vcard-ward-info-main">
+				<view class="head">
+					<image :src="defaultHead"></image>
+				</view>
+				<view class="info">
+					<view class="info-name">
+						王俊凯
+					</view>
+					<view class="info-item fl">
+						<image src="../../static/image/icon-phone.png" mode=""></image>
+						<view class="">
+							15902021122
+						</view>
+					</view>
+					<view class="info-item fll">
+						<image src="../../static/image/icon-business.png" mode=""></image>
+						<view class="">
+							广州市祥粤建设职业培训建设职业培训
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="vcard-ward-tips">
+			<view class="vcard-ward-tips-title">
+				活动规则说明
+			</view>
+			<view class="vcard-ward-tips-text">
+				文案文案规则说明文案文案规则说明，文案文案规则说明文案文案规则说明文案文案明，文案文案规则说明文案文案规则说明文案文案规则说明，文案文案规则说明文案文案规则说明文案文案规则说明，文案文案规则说明文案文案规则说明文案文案规则说明，文案文案规则说明
+			</view>
+		</view>
 	</view>
 </template>
 
@@ -8,15 +42,105 @@
 	export default {
 		data() {
 			return {
-				
+				defaultHead: require("../../static/image/defhead.png"),
 			}
 		},
 		methods: {
-			
+
 		}
 	}
 </script>
 
-<style>
+<style scoped lang="scss">
+	page {
+		background: #353F5C;
+	}
+
+	image {
+		width: 100%;
+		height: 100%;
+	}
+
+	.vcard-ward {
+		padding: 60rpx 40rpx;
+
+		.vcard-ward-info {
+			padding-top: 16rpx;
+			background: #417BFF;
+			border-radius: 20rpx;
+
+			.vcard-ward-info-top {
+				height: 60rpx;
+				background: linear-gradient(180deg, #FFDEA7 0%, #FFEED2 100%);
+				margin: 0 14rpx;
+				border-radius: 13rpx 13rpx 0 0;
+				line-height: 60rpx;
+				padding-left: 24rpx;
+				color: #9C7B4A;
+				font-size: 28rpx;
+			}
+
+			.vcard-ward-info-main {
+				display: flex;
+				padding: 32rpx;
+				color: #FFFFFF;
+				background: #5A8CFF;
+				border-radius: 20rpx;
+
+				.head {
+					width: 120rpx;
+					height: 120rpx;
+				}
+
+				.info {
+					margin-left: 26rpx;
+					padding-top: 10rpx;
+					flex: 1;
+
+					.info-name {
+						font-weight: bold;
+						font-size: 36rpx;
+						margin-bottom: 30rpx;
+					}
 
+					.info-item {
+						margin-bottom: 12rpx;
+						font-size: 28rpx;
+
+						image {
+							width: 32rpx;
+							height: 32rpx;
+							margin-right: 20rpx;
+						}
+					}
+
+					.fll {
+						display: flex;
+						line-height: 38rpx;
+
+						image {
+							padding-top: 4rpx;
+						}
+					}
+				}
+			}
+		}
+
+		.vcard-ward-tips {
+			margin-top: 80rpx;
+            font-size: 32rpx;
+			.vcard-ward-tips-title {
+				font-weight: bold;
+				color: #FFFFFF;
+				margin-bottom: 24rpx;
+			}
+
+			.vcard-ward-tips-text {
+				font-size: 32rpx;
+				color: #bbb;
+				font-weight: 400;
+				line-height: 48rpx;
+			}
+		}
+	}
 </style>

utils/act.js

@@ -7,3 +7,11 @@ export function getActList(data) {
     data: data,
   });
 }
+// 下载海报
+export function makePoster(data) {
+  return myRequest({
+    url: "/distribution/poster/makePoster",
+    method: "get",
+    data: data,
+  });
+}