123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228 |
- <template>
- <view class="pages" :style="{'height':(h)+'px','padding-top':mt+'px'}">
- <c-nav-bar title="酒店民宿信息" :showIcon="true"></c-nav-bar>
- <view class="content">
- <view class="card" @click="goToPosition()">
- <text class="label">位置定位</text>
- <u-icon name="arrow-right" size="24"></u-icon>
- </view>
- <view class="card">
- <text class="label">联系电话</text>
- <u--input inputAlign="right" placeholder="请输入内容" border="none" v-model="stayInfo.landlinePhone" style="text-align: right;"></u--input>
- </view>
- <view class="card c2">
- <view class="tit">酒店简介</view>
- <view>
- <u--textarea customStyle="font-size:28rpx;line-height:28rpx" border='none' maxlength="300" count v-model="stayInfo.introduction" :value="stayInfo.introduction"
- placeholder="请输入酒店简介" height='360' ></u--textarea>
- </view>
- </view>
- <view class="card c2">
- <view class="tit">内饰照片</view>
- <view class="imgs">
- <!-- <image src="" v-for="(item,index) in imgUrlList" :key="index"></image> -->
- <u-upload ref="uUpload" uploadText="上传图片" :fileList="imgUrlList" :maxSize="10 * 1024 * 1024" width="180"
- height="120" @afterRead="afterRead" @delete="deletePic">
- </u-upload>
- </view>
- </view>
- </view>
- <view class="bottom">
- <view class="btn" @click="save()">
- 确定
- </view>
- </view>
- </view>
- </template>
- <script>
- export default {
- data() {
- return {
- homestayId: uni.getStorageSync('homestayId')||0,
- value: '',
- value1: '',
- fileList: [],
- fileList1: [],
- imgUrlList: [],
- fileList2: [],
- stayInfo: {
- picList: []
- },
- }
- },
- onLoad() {
- this.getStayInfo()
- },
- methods: {
- goToPosition() {
- const qwe = JSON.stringify(this.stayInfo)
- uni.navigateTo({
- url: '/pagesMy/stayInfo/roomPosition?item=' + JSON.stringify(this.stayInfo)
- })
- },
- getStayInfo() {
- this.$api.get('/merchant/hotel/mine/getMerchantHomestayInfo/'+this.homestayId).then(res => {
- if (res.data.code == 0) {
- this.stayInfo = res.data.data;
- this.stayInfo.picList.forEach((item) => {
- this.imgUrlList.push({
- url: item
- })
- })
- }
- })
- },
- // 删除图片
- deletePic(event) {
- this.imgUrlList.splice(event.index, 1)
- },
- // 新增图片
- async afterRead(event) {
- let lists = [].concat(event.file)
- let fileListLen = this.imgUrlList.length
- lists.map((item) => {
- this.imgUrlList.push({
- ...item,
- status: 'uploading',
- message: '上传中'
- })
- })
- for (let i = 0; i < lists.length; i++) {
- const result = await this.uploadFilePromise(lists[i].url)
- let item = this.imgUrlList[fileListLen]
- this.imgUrlList.splice(fileListLen, 1, Object.assign(item, {
- status: 'success',
- message: '',
- url: result
- }))
- fileListLen++
- }
- console.log(this.imgUrlList)
- },
- uploadFilePromise(url) {
- return new Promise((resolve, reject) => {
- let a = uni.uploadFile({
- url: 'https://i.ringzle.com/island-cloud-server/oss/file/upload', // 仅为示例,非真实的接口地址
- filePath: url,
- name: 'file',
- formData: {
- user: 'test'
- },
- success: (res) => {
- console.log(res)
- let data = JSON.parse(res.data);
- console.log(data)
- resolve(data.data.url)
- }
- });
- })
- },
- save(){
- this.stayInfo.picList=[];
- this.imgUrlList.forEach((i)=>{
- if(i.url){
- this.stayInfo.picList.push(i.url)
- }
- })
- this.$api.post('/merchant/hotel/mine/updMHomestayInfo',this.stayInfo).then(res=>{
- console.log(res)
- })
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- /deep/.u-cell__body {
- padding: 0;
- }
- ::v-deep .u-icon__icon{
- font-size: 40rpx!important;
- margin-bottom: 10rpx;
- }
- ::v-deep .u-upload__button__text{
- color:#B9C2D0!important;
- font-size: 20rpx!important;
- }
- ::v-deep .u-cell__body {
- padding: 0;
- }
- .pages {
- background: #F9FAFC;
- .content {
- padding: 20rpx 30rpx;
- height: 100vh;
- .card {
- background: #fff;
- border-radius: 16rpx;
- padding: 30rpx;
- margin-bottom: 20rpx;
- display: flex;
- align-items: center;
- justify-content: space-between;
- &.c2{
- display: block;
- }
- .label {
- font-size: 30rpx;
- }
- .tit {
- font-size: 30rpx;
- font-weight: bold;
- margin-bottom: 20rpx;
- }
- .upload {
- margin-top: 48rpx;
- width: 100%;
- height: 200rpx;
- border-radius: 16rpx;
- background-color: #F5F8FA;
- display: flex;
- align-items: center;
- text-align: center;
- .upload-one {
- margin: 0 245rpx;
- width: 200rpx;
- height: 200rpx;
- image {
- width: 100%;
- height: 100%;
- }
- }
- }
- }
- }
- .bottom {
- position: fixed;
- bottom: 0;
- background: #fff;
- width: 100%;
- padding: 20rpx 0 30rpx;
- box-sizing: border-box;
- .btn {
- background: #33AFFC;
- color: white;
- text-align: center;
- height: 96rpx;
- margin: 0 auto;
- font-size: 34rpx;
- line-height: 96rpx;
- align-self: center;
- border-radius: 48rpx;
- width: 690rpx;
- }
- }
- }
- </style>
|