| @ -0,0 +1,53 @@ | |||||
| // 文字益处处理 | |||||
| .text-ellipsis{ | |||||
| overflow:hidden; //超出的文本隐藏 | |||||
| text-overflow:ellipsis; //溢出用省略号显示 | |||||
| white-space:nowrap; //溢出不换行 | |||||
| } | |||||
| .text-ellipsis-2{ | |||||
| overflow: hidden; | |||||
| text-overflow: ellipsis; | |||||
| display:-webkit-box; //作为弹性伸缩盒子模型显示。 | |||||
| -webkit-box-orient:vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列 | |||||
| -webkit-line-clamp:2; //显示的行 | |||||
| } | |||||
| .text-ellipsis-3{ | |||||
| overflow: hidden; | |||||
| text-overflow: ellipsis; | |||||
| display:-webkit-box; //作为弹性伸缩盒子模型显示。 | |||||
| -webkit-box-orient:vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列 | |||||
| -webkit-line-clamp:3; //显示的行 | |||||
| } | |||||
| .share{ | |||||
| padding: 0; | |||||
| margin: 0; | |||||
| background-color: #fff; | |||||
| display: flex !important; | |||||
| flex-direction: column !important; | |||||
| justify-content: center !important; | |||||
| align-items: center !important; | |||||
| font-size: 26rpx; | |||||
| } | |||||
| .share::after{ | |||||
| border: none; | |||||
| padding: 0; | |||||
| margin: 0; | |||||
| width: 0; | |||||
| height: 0; | |||||
| } | |||||
| .tag-list{ | |||||
| display: flex; | |||||
| flex-wrap: wrap; | |||||
| } | |||||
| .tag-list > view{ | |||||
| margin: 10rpx; | |||||
| padding: 10rpx; | |||||
| background-color: #EFF2F1; | |||||
| font-size: 24rpx; | |||||
| border-radius: 10rpx; | |||||
| } | |||||
| @ -1,81 +0,0 @@ | |||||
| <template> | |||||
| <view @click="$emit('confirm')" :style="{ | |||||
| position: 'fixed', | |||||
| display: 'flex', | |||||
| justifyContent: 'center', | |||||
| alignItems: 'center', | |||||
| width: '100vw', | |||||
| bottom: bottom | |||||
| }"> | |||||
| <button :style="{ | |||||
| color: color, | |||||
| backgroundColor: backgroundColor, | |||||
| fontSize: fontSize, | |||||
| width: width, | |||||
| height: height, | |||||
| borderRadius: borderRadius | |||||
| }"> | |||||
| {{ text }} | |||||
| </button> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| export default { | |||||
| props: { | |||||
| color: { | |||||
| default: '#000000' // 设置默认颜色值 | |||||
| }, | |||||
| backgroundColor: { | |||||
| default: '#FFFFFF' // 设置默认背景颜色 | |||||
| }, | |||||
| fontSize: { | |||||
| default: '36rpx' // 设置默认字体大小 | |||||
| }, | |||||
| text: { | |||||
| default: '按钮' // 设置默认文本内容 | |||||
| }, | |||||
| width: { | |||||
| default: '150rpx' // 设置默认宽度 | |||||
| }, | |||||
| height: { | |||||
| default: '60rpx' // 设置默认高度 | |||||
| }, | |||||
| borderRadius: { | |||||
| default: '40rpx' // 设置默认高度 | |||||
| }, | |||||
| bottom: { | |||||
| default: '40rpx' // 设置默认距离底部高度 | |||||
| }, | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="less"> | |||||
| // .container { | |||||
| // position: fixed; | |||||
| // display: flex; | |||||
| // justify-content: center; | |||||
| // /* 水平居中 */ | |||||
| // align-items: center; | |||||
| // /* 垂直居中 */ | |||||
| // width: 100%; | |||||
| // /* 使容器宽度覆盖整个屏幕 */ | |||||
| // } | |||||
| button { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| } | |||||
| </style> | |||||
| @ -0,0 +1,53 @@ | |||||
| <template> | |||||
| <uv-swipe-action> | |||||
| <view | |||||
| v-for="(item, index) in list" | |||||
| :key="index" | |||||
| > | |||||
| <view style="margin-top: 20rpx;"></view> | |||||
| <uv-swipe-action-item | |||||
| @click="e => clickSwipeAction(e, item)" | |||||
| :options="options"> | |||||
| <workItem/> | |||||
| </uv-swipe-action-item> | |||||
| </view> | |||||
| </uv-swipe-action> | |||||
| </template> | |||||
| <script> | |||||
| import workItem from './workItem.vue' | |||||
| export default { | |||||
| components : { | |||||
| workItem | |||||
| }, | |||||
| props : { | |||||
| options : { | |||||
| default : [ | |||||
| { | |||||
| text: '删除', | |||||
| style: { | |||||
| backgroundColor: '#FA5A0A' | |||||
| } | |||||
| }, | |||||
| ], | |||||
| }, | |||||
| list : { | |||||
| default : [] | |||||
| }, | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| clickSwipeAction(e, item){ | |||||
| this.$emit('clickSwipeAction', {e, item}) | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| </style> | |||||
| @ -1,93 +0,0 @@ | |||||
| <template> | |||||
| <view style=""> | |||||
| <view v-for="item in commodityList" :key="item.title" class="address-item"> | |||||
| <view class="itme1" @click="selectSp(item)"> | |||||
| <view class="left"> | |||||
| <img src="../../../static/image/center/1.png" alt="" style="width: 100%;height: 100%;"> | |||||
| </view> | |||||
| <view class="center"> | |||||
| <view>{{ item.title }}</view> | |||||
| <view>{{ item.smallTitle }}</view> | |||||
| </view> | |||||
| <view class="right">×{{item.total}}</view> | |||||
| </view> | |||||
| <uv-line></uv-line> | |||||
| </view> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| export default { | |||||
| props: { | |||||
| commodityList: { | |||||
| default: [], | |||||
| type: Array, | |||||
| } | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| selectAddress: 0, | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| // 打开商品选择 | |||||
| openCommodity() { | |||||
| this.$emit('openSpPopup') | |||||
| }, | |||||
| // 选择了商品 | |||||
| selectSp(e) { | |||||
| console.log(this.commodityList,"this.csss") | |||||
| console.log(e, '选择了商品') | |||||
| this.$emit('selectSp', e) | |||||
| } | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .itme1 { | |||||
| display: flex; | |||||
| height: 150rpx; | |||||
| width: 100vw; | |||||
| background-color: #ffffff; | |||||
| .left { | |||||
| padding: 40rpx; | |||||
| width: 20%; | |||||
| border-radius: 10rpx; | |||||
| background-color: #ffffff; | |||||
| } | |||||
| .center { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| justify-content: center; | |||||
| gap: 20rpx; | |||||
| width: 70%; | |||||
| padding: 0rpx 0 0 20rpx; | |||||
| background-color: #ffffff; | |||||
| // 给第一个 view 设置样式 | |||||
| > view:first-of-type { | |||||
| font-size: 36rpx; | |||||
| color: #333; | |||||
| } | |||||
| // 给第二个 view 设置样式 | |||||
| > view:nth-of-type(2) { | |||||
| font-size: 28rpx; | |||||
| color: #666666; | |||||
| } | |||||
| } | |||||
| .right { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| width: 10%; | |||||
| color: #666666; | |||||
| background-color: #ffffff; | |||||
| } | |||||
| } | |||||
| </style> | |||||
| @ -0,0 +1,47 @@ | |||||
| <template> | |||||
| <view class="const"> | |||||
| <view class="title"> | |||||
| {{ title }} | |||||
| </view> | |||||
| <view class="num"> | |||||
| {{ num }} | |||||
| </view> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| export default { | |||||
| props : { | |||||
| title : { | |||||
| default : '您当前的找活' | |||||
| }, | |||||
| num : { | |||||
| default : 0 | |||||
| } | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .const{ | |||||
| padding: 30rpx; | |||||
| background: $uni-color; | |||||
| color: #fff; | |||||
| font-weight: 900; | |||||
| .title{ | |||||
| font-size: 34rpx; | |||||
| } | |||||
| .num{ | |||||
| padding: 20rpx 0; | |||||
| font-size: 38rpx; | |||||
| } | |||||
| } | |||||
| </style> | |||||
| @ -0,0 +1,51 @@ | |||||
| <template> | |||||
| <view class="page"> | |||||
| <navbar title="我的收藏" | |||||
| bgColor="#3796F8" | |||||
| leftClick | |||||
| color="#fff" | |||||
| @leftClick="$utils.navigateBack"/> | |||||
| <workListSwipe | |||||
| :options="options" | |||||
| @clickSwipeAction="clickSwipeAction" | |||||
| :list="10"/> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import workListSwipe from '@/components/list/workList/workListSwipe.vue' | |||||
| import mixinList from '@/mixins/list.js' | |||||
| export default { | |||||
| mixins : [mixinList], | |||||
| components : { | |||||
| workListSwipe | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| options: [ | |||||
| { | |||||
| text: '删除', | |||||
| style: { | |||||
| backgroundColor: '#FA5A0A' | |||||
| } | |||||
| }, | |||||
| ], | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| clickSwipeAction({e, item}){ | |||||
| console.log(e, item); | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .page{ | |||||
| /deep/ .uv-swipe-action{ | |||||
| width: 100%; | |||||
| } | |||||
| } | |||||
| </style> | |||||
| @ -0,0 +1,23 @@ | |||||
| <template> | |||||
| <!-- 联系记录 --> | |||||
| <view class="page"> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| export default { | |||||
| data() { | |||||
| return { | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| </style> | |||||
| @ -0,0 +1,62 @@ | |||||
| <template> | |||||
| <!-- 我发布的招工 --> | |||||
| <view class="page"> | |||||
| <navbar title="我的找活" | |||||
| bgColor="#3796F8" | |||||
| leftClick | |||||
| color="#fff" | |||||
| @leftClick="$utils.navigateBack"/> | |||||
| <statisticsNumber/> | |||||
| <workListSwipe | |||||
| :options="options" | |||||
| @clickSwipeAction="clickSwipeAction" | |||||
| :list="10"/> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import workListSwipe from '@/components/list/workList/workListSwipe.vue' | |||||
| import statisticsNumber from '../components/statistics/statisticsNumber.vue' | |||||
| import mixinList from '@/mixins/list.js' | |||||
| export default { | |||||
| mixins : [mixinList], | |||||
| components : { | |||||
| workListSwipe, | |||||
| statisticsNumber | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| options: [ | |||||
| { | |||||
| text: '修改', | |||||
| style: { | |||||
| backgroundColor: '#ffa12c' | |||||
| } | |||||
| }, | |||||
| { | |||||
| text: '删除', | |||||
| style: { | |||||
| backgroundColor: '#FA5A0A' | |||||
| } | |||||
| }, | |||||
| ], | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| clickSwipeAction({e, item}){ | |||||
| console.log(e, item); | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .page{ | |||||
| /deep/ .uv-swipe-action{ | |||||
| width: 100%; | |||||
| } | |||||
| } | |||||
| </style> | |||||
| @ -1,366 +0,0 @@ | |||||
| <template> | |||||
| <view class="refundsOrExchange"> | |||||
| <navbar :title="title[titleIndex]" leftClick @leftClick="$utils.navigateBack"/> | |||||
| <view class="frame"> | |||||
| <!-- 商品简介 --> | |||||
| <view class="itme1" @click="openSpPopup"> | |||||
| <view class="left"> | |||||
| <img src="../../static/image/center/1.png" alt="" style="width: 100%;height: 100%;"> | |||||
| </view> | |||||
| <view class="center"> | |||||
| <view>{{ commodity.title }}</view> | |||||
| <view>{{ commodity.smallTitle }}</view> | |||||
| </view> | |||||
| <view class="right">×{{ commodity.total }}</view> | |||||
| </view> | |||||
| <!--<commoditySelect ></commoditySelect>--> | |||||
| <!-- 申请类型&申请原因 --> | |||||
| <view class="item2"> | |||||
| <view class="type"> | |||||
| <span>申请类型</span> | |||||
| <span>退货退款</span> | |||||
| </view> | |||||
| <uv-line></uv-line> | |||||
| <view class="reason"> | |||||
| <view>申请原因</view> | |||||
| <view> | |||||
| <uv-input placeholder="请输入申请原因" border="none" clearable></uv-input> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 退货数量&申请金额--> | |||||
| <view class="item3"> | |||||
| <view class="type"> | |||||
| <span>{{ titleIndex == 0 ? '退货数量' : '换货数量' }}</span> | |||||
| <span> | |||||
| <uv-number-box :min="1" :max="100"></uv-number-box> | |||||
| </span> | |||||
| </view> | |||||
| <uv-line v-if='titleIndex == 0 ? true :false'></uv-line> | |||||
| <view class="reason" v-if='titleIndex == 0 ? true :false'> | |||||
| <view>申请原因</view> | |||||
| <view> | |||||
| <uv-input disabled placeholder="$" border="none" clearable></uv-input> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 申请说明 --> | |||||
| <view class="item4"> | |||||
| <view>申请说明(选填)</view> | |||||
| <view> | |||||
| <uv-input placeholder="请您详细填写申请说明" border="none" clearable></uv-input> | |||||
| </view> | |||||
| <view> | |||||
| <uv-upload :fileList="fileList" :maxCount="5" multiple width="150rpx" height="150rpx" | |||||
| @delete="deleteImage" @afterRead="afterRead" :previewFullImage="true"></uv-upload> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 联系电话 --> | |||||
| <view class="item5"> | |||||
| <view class="phone"> | |||||
| <view>联系电话</view> | |||||
| <view> | |||||
| <uv-input placeholder="请输入联系电话" border="none" clearable></uv-input> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 底部按钮 --> | |||||
| <bottomBtn @confirm='confirm()' :color='bottomBtnStyle.color' :backgroundColor='bottomBtnStyle.backgroundColor' | |||||
| :fontSize='bottomBtnStyle.fontSize' :text='bottomBtnStyle.text' :width="bottomBtnStyle.width" | |||||
| :height="bottomBtnStyle.height" :borderRadius='bottomBtnStyle.borderRadius' | |||||
| :bottom='bottomBtnStyle.bottom' | |||||
| > | |||||
| </bottomBtn> | |||||
| <!--商品选择--> | |||||
| <uv-popup ref="spPopup" :round="30"> | |||||
| <commoditySelect | |||||
| :commodityList="commodityList" | |||||
| @selectSp="selectCommodity" | |||||
| /> | |||||
| </uv-popup> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import bottomBtn from "../../components/bottom/bottomBtn.vue" | |||||
| import commoditySelect from "../components/commodity/commoditySelect.vue" | |||||
| export default { | |||||
| onLoad(option) { | |||||
| this.titleIndex = option.index | |||||
| }, | |||||
| components: { | |||||
| bottomBtn, commoditySelect | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| titleIndex: 0, | |||||
| title: ['申请换货', '申请退货'], | |||||
| fileList: [], | |||||
| bottomBtnStyle: { | |||||
| color: '#FFF', | |||||
| backgroundColor: '#fd5100', | |||||
| fontSize: '34rpx', | |||||
| text: '提交申请', | |||||
| width: '400rpx', | |||||
| height: '80rpx', | |||||
| borderRadius: '100rpx', | |||||
| bottom: '40rpx' | |||||
| }, | |||||
| commodityList: [ | |||||
| { | |||||
| title: '商品名称', | |||||
| smallTitle: '产品规格:120*4*75【桌子尺寸】', | |||||
| total:1, | |||||
| }, | |||||
| { | |||||
| title: '商品名称1', | |||||
| smallTitle: '产品规格:120*4*75【桌子尺寸】', | |||||
| total:1, | |||||
| }, | |||||
| { | |||||
| title: '商品名称2', | |||||
| smallTitle: '产品规格:120*4*75【桌子尺寸】', | |||||
| total:1, | |||||
| } | |||||
| ], | |||||
| commodity: { | |||||
| title: '商品名称', | |||||
| smallTitle: '产品规格:120*4*75【桌子尺寸】', | |||||
| total:1, | |||||
| }, | |||||
| } | |||||
| }, | |||||
| mounted() { | |||||
| }, | |||||
| methods: { | |||||
| openSpPopup() { | |||||
| this.$refs.spPopup.open('bottom'); | |||||
| }, | |||||
| // 选择退换货商品回调 | |||||
| selectCommodity(e) { | |||||
| console.log(e, "selectCommodity--e") | |||||
| this.commodity = e | |||||
| this.$refs.spPopup.close() | |||||
| }, | |||||
| confirm() { | |||||
| console.log("==="); | |||||
| }, | |||||
| deleteImage(e) { | |||||
| this.fileList.splice(e.index, 1) | |||||
| }, | |||||
| afterRead(e) { | |||||
| let self = this | |||||
| e.file.forEach(file => { | |||||
| self.$Oss.ossUpload(file.url).then(url => { | |||||
| self.fileList.push({ | |||||
| url | |||||
| }) | |||||
| }) | |||||
| }) | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style lang="scss" scoped> | |||||
| * { | |||||
| box-sizing: border-box; | |||||
| } | |||||
| .refundsOrExchange { | |||||
| .frame { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| gap: 30rpx; | |||||
| width: 100%; | |||||
| padding-top: 40rpx; | |||||
| background-color: #f5f5f5; | |||||
| .itme1 { | |||||
| display: flex; | |||||
| height: 200rpx; | |||||
| background-color: #ffffff; | |||||
| .left { | |||||
| padding: 40rpx; | |||||
| width: 20%; | |||||
| border-radius: 10rpx; | |||||
| background-color: #ffffff; | |||||
| } | |||||
| .center { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| justify-content: center; | |||||
| gap: 20rpx; | |||||
| width: 60%; | |||||
| padding: 0rpx 0 0 20rpx; | |||||
| background-color: #ffffff; | |||||
| // 给第一个 view 设置样式 | |||||
| > view:first-of-type { | |||||
| font-size: 36rpx; | |||||
| color: #333; | |||||
| } | |||||
| // 给第二个 view 设置样式 | |||||
| > view:nth-of-type(2) { | |||||
| font-size: 28rpx; | |||||
| color: #666666; | |||||
| } | |||||
| } | |||||
| .right { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| width: 10%; | |||||
| color: #666666; | |||||
| background-color: #ffffff; | |||||
| } | |||||
| } | |||||
| .item2 { | |||||
| width: 100vw; | |||||
| .type { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| padding: 0 0 0 20rpx; | |||||
| > span:nth-of-type(1) { | |||||
| width: 30%; | |||||
| } | |||||
| > span:nth-of-type(2) { | |||||
| width: 70%; | |||||
| } | |||||
| } | |||||
| .reason { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| > view:nth-of-type(1) { | |||||
| width: 30%; | |||||
| } | |||||
| > view:nth-of-type(2) { | |||||
| width: 70%; | |||||
| padding: 0 20rpx 0 0; | |||||
| } | |||||
| } | |||||
| } | |||||
| .item3 { | |||||
| width: 100vw; | |||||
| .type { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| padding: 0 0 0 20rpx; | |||||
| > span:nth-of-type(1) { | |||||
| width: 70%; | |||||
| } | |||||
| > span:nth-of-type(2) { | |||||
| width: 30%; | |||||
| } | |||||
| } | |||||
| .reason { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| > view:nth-of-type(1) { | |||||
| width: 30%; | |||||
| } | |||||
| > view:nth-of-type(2) { | |||||
| width: 70%; | |||||
| padding: 0 20rpx 0 0; | |||||
| } | |||||
| } | |||||
| } | |||||
| .item4 { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| background-color: #FFF; | |||||
| > view:nth-of-type(1) { | |||||
| background-color: #FFF; | |||||
| } | |||||
| > view:nth-of-type(2) { | |||||
| margin: 10rpx 0 10rpx 0; | |||||
| background-color: #FFF; | |||||
| } | |||||
| } | |||||
| .item5 { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| padding: 0 0 0 20rpx; | |||||
| background-color: #FFF; | |||||
| .phone { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| > view:nth-of-type(1) { | |||||
| width: 30%; | |||||
| } | |||||
| > view:nth-of-type(2) { | |||||
| width: 70%; | |||||
| padding: 0 20rpx 0 0; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||