From e4233b5c4e123c4b79a38d0a9b0c8b60631e1683 Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期二, 30 七月 2024 10:40:24 +0800 Subject: [PATCH] update --- pages/user/address/address.vue | 888 ++++++++++++++++++++++++++++++----------------------------- 1 files changed, 453 insertions(+), 435 deletions(-) diff --git a/pages/user/address/address.vue b/pages/user/address/address.vue index 3766107..9df16bb 100644 --- a/pages/user/address/address.vue +++ b/pages/user/address/address.vue @@ -1,489 +1,507 @@ <template> - <!-- 收获地址列表 --> - <view class="p15 container-address"> - <no-data v-if="!list||list.length==0" style="width: 100%;"></no-data> + <!-- 收货地址列表 --> + <view class="p15 container-address"> + <no-data v-if="!list||list.length==0" style="width: 100%;"></no-data> - <!-- 循环 --> - <view v-for="(item,index) of list" :key="index" class="location-each"> - <view class="flex"> - <view class="container-info"> - <view class="flex"> - <view class="name">{{ item.name || '-' }}</view> - <view class="tel">{{ item.tel || '-' }}</view> - </view> - <view class="address"> - {{ item.address }} - - </view> - </view> - <!-- <view class="h-line"></view> --> - <view class="edit" @click="()=>{ + <!-- 循环 --> + <view v-for="(item,index) of list" :key="index" class="location-each"> + <view class="flex"> + <view class="container-info"> + <view class="flex"> + <view class="name">{{ item.name || '-' }}</view> + <view class="tel">{{ item.tel || '-' }}</view> + </view> + <view class="address"> + {{ item['province'] || '' }}{{ item['city'] && ('/' + item['city']) || '' }}{{ + item['region'] && ('/' + item['region']) || '' + }} + </view> + <view class="address"> + {{ item.address }} + </view> + </view> + <!-- <view class="h-line"></view> --> + <view class="edit" @click="()=>{ this.submitForm = { ...item } openAddressForm() }"> - <uni-icons type="compose" class="icon" color="#666666"></uni-icons> - </view> - </view> - <view class="v-line"></view> - <view class="flex"> - <!-- --> - <view class="flex"> - <view class="radio m-t-2 m-r-10" :class="[item.isDefault?'select':'']" - @click="changeDefaultAddress(item,index)"> + <uni-icons type="compose" class="icon" color="#666666"></uni-icons> + </view> + </view> + <view class="v-line"></view> + <view class="flex"> + <!-- --> + <view class="flex"> + <view class="radio m-t-2 m-r-10" :class="[item.isDefault?'select':'']" + @click="changeDefaultAddress(item,index)"> - </view> - <span class="desc">{{ item.isDefault ? '默认地址:' : '当前地址:' }}{{ item.address || '' }}</span> - <!-- 当前地址/默认地址勾选 --> - </view> - <view class="desc del t-red" @click="deleteAddress(item)"> - 删除 - </view> - <view class="desc del t-green m-l-10" v-if="source==='select'" @click="selectAddress(item)"> - 选择此地址 - </view> - </view> + </view> + <span class="desc">{{ item.isDefault ? '默认地址:' : '当前地址:' }}{{ item.address || '' }}</span> + <!-- 当前地址/默认地址勾选 --> + </view> + <view class="desc del t-red" @click="deleteAddress(item)"> + 删除 + </view> + <view class="desc del t-green m-l-10" v-if="source==='select'" @click="selectAddress(item)"> + 选择此地址 + </view> + </view> - </view> - <view style="height: 92rpx;width: 690rpx;"> - - </view> - <view class="button-green button-fixed-bottom" style="width: 690rpx;line-height: 92rpx;height: 92rpx;" @click=" ()=>{ - delete this.submitForm.id - this.submitForm['name'] = '' - this.submitForm['tel'] = '' - this.submitForm['tel'] = '' - this.submitForm['area'] = '' + </view> + <view style="height: 92rpx;width: 690rpx;"> + + </view> + <view class="button-green button-fixed-bottom" style="width: 690rpx;line-height: 92rpx;height: 92rpx;" + @click="addAddress">添加收货地址 + </view> - openAddressForm() - }">添加收货地址 - </view> - - <uni-popup ref="popup_form" type="top" :mask-click="false"> - <view class="popup-address-form"> - <view class="close-parent"> - {{ submitForm.id ? '新增' : '编辑' }}收货地址 - <uni-icons class="close" type="closeempty" @click="closeAddressForm"></uni-icons> - </view> - <!--收货人、手机号、校区、详细地址 --> - <view class="submit form"> - <view class="form-item"> - <view class="form-item-label require"> - 收货人 - </view> - <view class="form-item-value"> - <input v-model="submitForm.name" placeholder="请输入收货人" class="form-input"></input> - </view> - </view> - <view class="form-item"> - <view class="form-item-label require"> - 收获地址 - </view> - <view class="m-l-a m-r-0 flex " :class="[!dto['province']?'desc-gray':'']"> - <uni-data-picker :area="true" @change="(e)=>{PickArea(submitForm,e)}" placeholder="" - :localdata="regionDataPlus"> - {{ submitForm['province'] || '请选择' }}{{ submitForm['city'] && ('/' + submitForm['city']) || '' }}{{ + <uni-popup ref="popup_form" type="top" :mask-click="false"> + <view class="popup-address-form"> + <view class="close-parent"> + {{ submitForm.id ? '新增' : '编辑' }}收货地址 + <uni-icons class="close" type="closeempty" @click="closeAddressForm"></uni-icons> + </view> + <!--收货人、手机号、校区、详细地址 --> + <view class="submit form"> + <view class="form-item"> + <view class="form-item-label require"> + 收货人 + </view> + <view class="form-item-value"> + <input v-model="submitForm.name" placeholder="请输入收货人" class="form-input"></input> + </view> + </view> + <view class="form-item"> + <view class="form-item-label require"> + 手机号 + </view> + <view class="form-item-value"> + <input v-model="submitForm.tel" placeholder="请输入收货人手机号" class="form-input"></input> + </view> + </view> + <view class="form-item"> + <view class="form-item-label require"> + 收货地址 + </view> + <view class="m-l-a m-r-0 flex " :class="[!dto['province']?'desc-gray':'']"> + <uni-data-picker :area="true" @change="(e)=>{PickArea(submitForm,e)}" placeholder="" + :localdata="regionDataPlus"> + {{ submitForm['province'] || '请选择' }}{{ submitForm['city'] && ('/' + submitForm['city']) || '' }}{{ submitForm['region'] && ('/' + submitForm['region']) || '' }} - </uni-data-picker> - <u-icon class="m-l-a" name="arrow-right"></u-icon> - </view> + </uni-data-picker> + <u-icon class="m-l-a" name="arrow-right"></u-icon> + </view> - <!-- <view class="form-item-value" @click="chooseLocation">--> - <!-- <input v-model="submitForm.room" placeholder="请选择收获地址" disabled class="form-input"></input>--> - <!-- <!– 点击定位 –>--> - <!-- </view>--> - </view> - <view class="form-item"> - <view class="form-item-label require"> - 详细地址 - </view> - <view class="form-item-value"> - <input v-model="submitForm.address" placeholder="请输入详细地址" class="form-input"></input> - </view> - </view> - <view class="form-item"> - <view class="form-item-label"> - 是否默认 - </view> - <view class="form-item-value"> - <radio value="r1" :checked="submitForm.isDefault" - @click="submitForm.isDefault=!submitForm.isDefault" - style="transform:scale(0.6);margin-top: -8rpx;"/> - </view> - </view> - </view> + </view> + <view class="form-item"> + <view class="form-item-label require"> + 详细地址 + </view> + <view class="form-item-value"> + <input v-model="submitForm.address" placeholder="请输入详细地址" class="form-input"></input> - <view class="button-green m-t-15" @click="saveOrUpdateAddress">保存</view> - </view> - </uni-popup> + </view> + </view> + <view class="form-item"> + <view class="form-item-label"> + 是否默认 + </view> + <view class="form-item-value"> + <radio value="r1" :checked="submitForm.isDefault" + @click="submitForm.isDefault=!submitForm.isDefault" + style="transform:scale(0.6);margin-top: -8rpx;" /> + </view> + </view> + </view> - </view> + <view class="button-green m-t-15" @click="saveOrUpdateAddress">保存</view> + </view> + </uni-popup> + + </view> </template> <script> -// import qqmapwx from '@/plugins/qqmap-wx-jssdk.min.js'; -// const lockey = 'VUHBZ-2AMLP-B7AD7-VUQZ7-D4TW5-MFFVN'; //使用在腾讯位置服务申请的key -// const chooseLocation = requirePlugin('chooseLocation'); + // import qqmapwx from '@/plugins/qqmap-wx-jssdk.min.js'; + // const lockey = 'VUHBZ-2AMLP-B7AD7-VUQZ7-D4TW5-MFFVN'; //使用在腾讯位置服务申请的key + // const chooseLocation = requirePlugin('chooseLocation'); -export default { - async onPullDownRefresh() { - this.page.current = 0 - await this.getList() - uni.stopPullDownRefresh() - }, - async onLoad(options) { - // this.list = [{}, {}] - this.source = options.source || '' - this.listApi = '/api/address/list' - await this.getList() + export default { + async onPullDownRefresh() { + this.page.current = 0 + await this.getList() + uni.stopPullDownRefresh() + }, + async onLoad(options) { + // this.list = [{}, {}] + this.source = options.source || '' + this.listApi = '/api/address/list' + await this.getList() - }, - data() { - return { - source: '', - submitForm: { - name: '', - tel: '', - address: '', - isDefault: false, - province: '', - city: '', - region: '', + }, + data() { + return { + source: '', + submitForm: { + name: '', + tel: '', + address: '', + isDefault: false, + province: '', + city: '', + region: '', - }, - regionDataPlus: [], - list:[], - }; - }, - methods: { - PickArea(item, e) { - console.log('PickArea', item, e) - if (e.detail.value) { - this.submitForm.province = '' - this.submitForm.city = '' - this.submitForm.region = '' - if (e.detail.value.length <= 3) { - if (!!e.detail.value[0]) - this.submitForm.province = e.detail.value[0].value - if (!!e.detail.value[1]) - this.submitForm.city = e.detail.value[1].value - if (!!e.detail.value[2]) - this.submitForm.region = e.detail.value[2].value - } else { - //说明有重复的 - var plusnum = e.detail.value.length - 3 - if (!!e.detail.value[plusnum + 0]) - this.submitForm.province = e.detail.value[plusnum + 0].value - if (!!e.detail.value[plusnum + 1]) - this.submitForm.city = e.detail.value[plusnum + 1].value - if (!!e.detail.value[plusnum + 2]) - this.submitForm.region = e.detail.value[plusnum + 2].value - } + }, + regionDataPlus: [], + list: [], + }; + }, + methods: { + addAddress() { + delete this.submitForm.id + this.submitForm['name'] = '' + this.submitForm['tel'] = '' + this.submitForm['address'] = '' + this.submitForm['province'] = '' + this.submitForm['city'] = '' + this.submitForm['region'] = '' + this.submitForm['isDefault'] = false + this.openAddressForm() + }, + PickArea(item, e) { + console.log('PickArea', item, e) + if (e.detail.value) { + this.submitForm.province = '' + this.submitForm.city = '' + this.submitForm.region = '' + if (e.detail.value.length <= 3) { + if (!!e.detail.value[0]) + this.submitForm.province = e.detail.value[0].value + if (!!e.detail.value[1]) + this.submitForm.city = e.detail.value[1].value + if (!!e.detail.value[2]) + this.submitForm.region = e.detail.value[2].value + } else { + //说明有重复的 + var plusnum = e.detail.value.length - 3 + if (!!e.detail.value[plusnum + 0]) + this.submitForm.province = e.detail.value[plusnum + 0].value + if (!!e.detail.value[plusnum + 1]) + this.submitForm.city = e.detail.value[plusnum + 1].value + if (!!e.detail.value[plusnum + 2]) + this.submitForm.region = e.detail.value[plusnum + 2].value + } - this.$forceUpdate() - console.log('submit forn',this.submitForm) - } - }, - async init_area() { - const res = await this.$http.request('get', '/api/pub/china/area/json') - this.regionDataPlus = res.data && JSON.parse(res.data.replaceAll('code', 'value').replaceAll('name', - 'text')) || [] - }, - chooseLocation() { - //前往接口挑选位置 - const qqmapsdk = new qqmapwx({ - // 使用你在腾讯地图应用生成的key - key: lockey - }); + this.$forceUpdate() + console.log('submit forn', this.submitForm) + } + }, + async init_area() { + const res = await this.$http.request('get', '/api/pub/china/area/json') + this.regionDataPlus = res.data && JSON.parse(res.data.replaceAll('code', 'value').replaceAll('name', + 'text')) || [] + }, + chooseLocation() { + //前往接口挑选位置 + const qqmapsdk = new qqmapwx({ + // 使用你在腾讯地图应用生成的key + key: lockey + }); - uni.getLocation({ - type: 'wgs84', - success(res) { - //得到经纬度 - console.log(res); - qqmapsdk.reverseGeocoder({ - location: { - latitude: res.latitude, - longitude: res.longitude - }, - //成功后的回调 - success: (r) => { - // console.log('地址信息', r.result.address_component); - // result: {location: {lat: 31.26249, lng: 120.63212}, address: "江苏省苏州市吴中区太湖东路288号",…} - // ad_info: {nation_code: "156", adcode: "320506", phone_area_code: "0512", city_code: "156320500",…} - // address: "江苏省苏州市吴中区太湖东路288号" - // address_component: {nation: "中国", province: "江苏省", city: "苏州市", district: "吴中区", street: "太湖东路",…} - // address_reference: {,…} - // formatted_addresses: {recommend: "长桥苏州市吴中区人民政府(太湖东路北)", rough: "长桥苏州市吴中区人民政府(太湖东路北)"} - // location: {lat: 31.26249, lng: 120.63212} - // status: 0 - tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].longitude = r - .result.location.lng - tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].latitude = r - .result.location.lat - tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].loc_desc = r - .result.address - tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index]._show = false - tmp.$forceUpdate() - tmp.tmp_picker_lock_index = -1 + uni.getLocation({ + type: 'wgs84', + success(res) { + //得到经纬度 + console.log(res); + qqmapsdk.reverseGeocoder({ + location: { + latitude: res.latitude, + longitude: res.longitude + }, + //成功后的回调 + success: (r) => { + // console.log('地址信息', r.result.address_component); + // result: {location: {lat: 31.26249, lng: 120.63212}, address: "江苏省苏州市吴中区太湖东路288号",…} + // ad_info: {nation_code: "156", adcode: "320506", phone_area_code: "0512", city_code: "156320500",…} + // address: "江苏省苏州市吴中区太湖东路288号" + // address_component: {nation: "中国", province: "江苏省", city: "苏州市", district: "吴中区", street: "太湖东路",…} + // address_reference: {,…} + // formatted_addresses: {recommend: "长桥苏州市吴中区人民政府(太湖东路北)", rough: "长桥苏州市吴中区人民政府(太湖东路北)"} + // location: {lat: 31.26249, lng: 120.63212} + // status: 0 + tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].longitude = r + .result.location.lng + tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].latitude = r + .result.location.lat + tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index].loc_desc = r + .result.address + tmp.formcodes['LOC_ONE'][tmp.tmp_picker_lock_index]._show = false + tmp.$forceUpdate() + tmp.tmp_picker_lock_index = -1 - }, - fail: function (res) { - console.log(res); - tmp.tmp_picker_lock_index = -1 - }, - }); - } - }); - }, - async changeDefaultAddress(item, index) { - if (item.isDefault) { - return - } - this.$nextTick(() => { + }, + fail: function(res) { + console.log(res); + tmp.tmp_picker_lock_index = -1 + }, + }); + } + }); + }, + async changeDefaultAddress(item, index) { + if (item.isDefault) { + return + } + this.$nextTick(() => { - this.$message.confirm('确定设置此地址为默认地址吗').then(async res => { - this.$message.showLoading() - var { - code - } = await this.$http.request('post', '/api/address/set/default/'+item.id, { - data:{ - id:item.id - }, - params:{ - id:item.id - } - }) - this.$message.hideLoading() - if (code === 0) { - for (var dto of this.list) { - dto.isDefault = false - } - this.$message.showToast('设置成功') - item.isDefault = true - this.$store.commit('setDefaultAddress', { - ...item - }) + this.$message.confirm('确定设置此地址为默认地址吗').then(async res => { + this.$message.showLoading() + var { + code + } = await this.$http.request('post', '/api/address/set/default/' + item + .id, { + data: { + id: item.id + }, + params: { + id: item.id + } + }) + this.$message.hideLoading() + if (code === 0) { + for (var dto of this.list) { + dto.isDefault = false + } + this.$message.showToast('设置成功') + item.isDefault = true + this.$store.commit('setDefaultAddress', { + ...item + }) - } - }, err => { - this.$nextTick(() => { - this.list[index].defaulted = false - this.$forceUpdate() - console.log('err', err, this.list[index]) - }) + } + }, err => { + this.$nextTick(() => { + this.list[index].isDefault = false + this.$forceUpdate() + console.log('err', err, this.list[index]) + }) - }) - }) - }, - async selectAddress(item) { - await this.$message.confirm('确定选择此地址作为收获地址吗') - //携带,然后返回 - this.$store.commit('setDefaultAddress', { - ...item - }) - this.backpage() - }, - async deleteAddress(item) { - await this.$message.confirm('确定删除此地址吗') - this.$message.showLoading() - var { - code - } = await this.$http.request('get', '/api/address/delete?id=' + item.id, {}) - this.$message.hideLoading() - if (code === 0) { - this.$message.showToast('删除成功') - setTimeout(() => { - this.page.current = 1 - this.getList() - }, 500) - } - }, - async openAddressForm() { - this.init_area() - if (this.submitForm.id) { - this.$message.showLoading() - var { - data - } = await this.$http.request('get', '/api/address/list/detail?id=' + this.submitForm.id, {}) + }) + }) + }, + async selectAddress(item) { + await this.$message.confirm('确定选择此地址作为收货地址吗') + //携带,然后返回 + this.$store.commit('setDefaultAddress', { + ...item + }) + this.backpage() + }, + async deleteAddress(item) { + await this.$message.confirm('确定删除此地址吗') + this.$message.showLoading() + var { + code + } = await this.$http.request('get', '/api/address/delete?id=' + item.id, {}) + this.$message.hideLoading() + if (code === 0) { + this.$message.showToast('删除成功') + if (item.isDefault) { + //要清空地址了 + this.$store.commit('setDefaultAddress', {}) + } + setTimeout(() => { + this.page.current = 1 + this.getList() + }, 500) + } + }, + async openAddressForm() { + this.init_area() + if (this.submitForm.id) { + this.$message.showLoading() + var { + data + } = await this.$http.request('get', '/api/address/list/detail?id=' + this.submitForm.id, {}) - if (data) { - this.submitForm = { - ...this.submitForm, - ...data - } - } - this.$message.hideLoading() - } else { - this.submitForm = { - name: this.currentInfo && this.currentInfo.nickName || '', - tel: this.currentInfo && this.currentInfo.tel || '', - address: '', - isDefault: false, - province: '', - city: '', - region: '', - } - } + if (data) { + this.submitForm = { + ...this.submitForm, + ...data + } + } + this.$message.hideLoading() + } else { + this.submitForm = { + name: this.currentInfo && this.currentInfo.nickName || '', + tel: this.currentInfo && this.currentInfo.tel || '', + address: '', + isDefault: false, + province: '', + city: '', + region: '', + } + } - this.$refs.popup_form.open() + this.$refs.popup_form.open() - }, - closeAddressForm() { - this.$refs.popup_form.close() + }, + closeAddressForm() { + this.$refs.popup_form.close() - }, - async saveOrUpdateAddress() { - if (!this.checkFormValues(this.submitForm, ['tel', 'name', 'address'])) { - this.$message.showToast('字段未填写完整') - return - } - this.$message.showLoading() - const { - code - } = await this.$http.request('post', '/api/address/' + (this.submitForm.id ? 'update' : - 'add'), { - data: this.submitForm - }) - this.$message.hideLoading() - if (code === 0) { - this.$refs.popup_form.close() - this.$message.showToast(this.submitForm.id ? '修改成功' : '新增成功') + }, + async saveOrUpdateAddress() { + if (!this.checkFormValues(this.submitForm, ['tel', 'name', 'address'])) { + this.$message.showToast('字段未填写完整') + return + } + this.$message.showLoading() + const { + code + } = await this.$http.request('post', '/api/address/' + (this.submitForm.id ? 'update' : + 'add'), { + data: this.submitForm + }) + this.$message.hideLoading() + if (code === 0) { + this.$refs.popup_form.close() + this.$message.showToast(this.submitForm.id ? '修改成功' : '新增成功') + let tmp = this + setTimeout(() => { + tmp.page.current = 1 + tmp.refreshList() + }, 300) + } + }, - setTimeout(() => { - this.page.current = 1 - this.getList() - }, 300) - } - }, - - } -} + } + } </script> <style lang="scss" scoped> -.container-address { - .popup-address-form { - background: #FFFFFF; - border-radius: 16rpx; - // width: 690rpx; - height: 882rpx; - margin-top: 120rpx; - margin-left: 30rpx; - margin-right: 30rpx; - padding: 24rpx 36rpx; + .container-address { + .popup-address-form { + background: #FFFFFF; + border-radius: 16rpx; + // width: 690rpx; + height: 882rpx; + margin-top: 120rpx; + margin-left: 30rpx; + margin-right: 30rpx; + padding: 24rpx 36rpx; - .submit { - margin-top: 30rpx; + .submit { + margin-top: 30rpx; - .form-input { - height: 36rpx; - line-height: 36rpx; - } - } - } + .form-input { + height: 36rpx; + line-height: 36rpx; + } + } + } - .location-each { - background: #FFFFFF; - border-radius: 16rpx; - margin-bottom: 24rpx; - padding: 36rpx; + .location-each { + background: #FFFFFF; + border-radius: 16rpx; + margin-bottom: 24rpx; + padding: 36rpx; - .name { - font-size: 32rpx; - color: #000000; - line-height: 44rpx; - text-align: left; - font-style: normal; - } + .name { + font-size: 32rpx; + color: #000000; + line-height: 44rpx; + text-align: left; + font-style: normal; + } - .tel { - font-size: 28rpx; - color: #666666; - line-height: 40rpx; - text-align: left; - font-style: normal; - padding-top: 4rpx; - margin-left: 20rpx; - } + .tel { + font-size: 28rpx; + color: #666666; + line-height: 40rpx; + text-align: left; + font-style: normal; + padding-top: 4rpx; + margin-left: 20rpx; + } - .address { - font-size: 24rpx; - color: #000000; - line-height: 34rpx; - text-align: left; - font-style: normal; - } + .address { + font-size: 24rpx; + color: #000000; + line-height: 34rpx; + text-align: left; + font-style: normal; + } - .desc { - font-size: 24rpx; - color: #666666; - line-height: 34rpx; - text-align: left; - font-style: normal; - } + .desc { + font-size: 24rpx; + color: #666666; + line-height: 34rpx; + text-align: left; + font-style: normal; + } - .del { - // vertical-align: baseline; - margin-left: auto; - margin-right: 6rpx; - margin-top: 4rpx; - } + .del { + // vertical-align: baseline; + margin-left: auto; + margin-right: 6rpx; + margin-top: 4rpx; + } - .container-info { - max-width: 540rpx; - } + .container-info { + max-width: 540rpx; + } - .h-line { - width: 2rpx; - height: 46rpx; - background-color: #EEEEEE; - margin-left: 28rpx; - margin-right: 24rpx; - } + .h-line { + width: 2rpx; + height: 46rpx; + background-color: #EEEEEE; + margin-left: 28rpx; + margin-right: 24rpx; + } - .v-line { - width: 638rpx; - height: 2rpx; - // border: 2rpx solid #EEEEEE; - background-color: #EEEEEE; - margin-top: 24rpx; - margin-bottom: 24rpx; - } + .v-line { + width: 638rpx; + height: 2rpx; + // border: 2rpx solid #EEEEEE; + background-color: #EEEEEE; + margin-top: 24rpx; + margin-bottom: 24rpx; + } - .edit { - // min-width: 80rpx; - width: fit-content; - margin-left: auto; - margin-right: 0rpx; - display: flex; - position: relative; + .edit { + // min-width: 80rpx; + width: fit-content; + margin-left: auto; + margin-right: 0rpx; + display: flex; + position: relative; - .icon { - // margin: 0 auto; - // mar - margin-left: auto; - margin-right: auto; - margin-top: 20rpx; - display: block; + .icon { + // margin: 0 auto; + // mar + margin-left: auto; + margin-right: auto; + margin-top: 20rpx; + display: block; - } - } + } + } - .edit::before { - content: " "; - width: 2rpx; - height: 46rpx; - background-color: #EEEEEE; - position: absolute; - left: -24rpx; - top: 20rpx; - } - } -} + .edit::before { + content: " "; + width: 2rpx; + height: 46rpx; + background-color: #EEEEEE; + position: absolute; + left: -24rpx; + top: 20rpx; + } + } + } </style> \ No newline at end of file -- Gitblit v1.9.3