12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576 |
- <template>
- <view class=" bg-white">
- <cu-custom bgColor="bg-gradual-blue" :isBack="true"><block slot="backText">返回</block><block slot="content">上传头像</block></cu-custom>
- <view class="cu-form-group">
-
- <view class="grid text-center col-4 grid-square flex-sub">
- <view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
- <image :src="imgList[index]" mode="aspectFill"></image>
- </view>
- <view class="solids" @tap="ChooseImage">
- <text class='cuIcon-cameraadd'></text>
- </view>
- </view>
- </view>
- <view class="cu-bar btn-group " style="margin-top: 100upx;">
- <button class=" btn-logout cu-btn shadow-blur round lg" @click="upload">退出登录</button>
- </view>
- </view>
- </template>
- <script>
- import userService from "@/api/sys/userService"
- export default {
- data() {
- return {
- imgList: []
- }
- },
- methods: {
- ChooseImage() {
- uni.chooseImage({
- count: 4, //默认9
- sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
- sourceType: ['album'], //从相册选择
- success: (res) => {
- if (this.imgList.length != 0) {
- this.imgList = this.imgList.concat(res.tempFilePaths)
- } else {
- this.imgList = res.tempFilePaths
- }
- }
- });
- },
- ViewImage(e) {
- uni.previewImage({
- urls: this.imgList,
- current: e.currentTarget.dataset.url
- });
- },
- upload() {
- fileService.upload(filePath).then((data)=>{
- userService.saveInfo({
- id: this.userInfo.id,
- photo: data
- })
- })
- }
- }
- }
- </script>
- <style>
- .btn-logout {
- margin-top: 100upx;
- width: 80%;
- border-radius: 50upx;
- font-size: 16px;
- color: #fff;
- background: linear-gradient(to right, #365fff, #36bbff);
- }
- .btn-logout-hover {
- background: linear-gradient(to right, #365fdd, #36bbfa);
- }
- </style>
|