|
|
@@ -0,0 +1,191 @@
|
|
|
+<template>
|
|
|
+ <view class="flex-common-css">
|
|
|
+ <Nav title="我的发布" titleColor="#333" bgckgroundBox='#fff'></Nav>
|
|
|
+ <scroll-view :scroll-y="true" class="scroll-view-css content-box box-sizing-border"
|
|
|
+ @scrolltolower="scrolltolower">
|
|
|
+ <view class="item-box box-sizing-border b-rad-20 mb-20 bgc-f flex-justify-space"
|
|
|
+ v-for="(item,index) in listData" :key="index" @click="goToUrl(item)">
|
|
|
+ <image class="item-head-img flex-shrink0 b-rad-50 mr-16" src="../static/img/my/user-img.png"
|
|
|
+ mode="aspectFill"></image>
|
|
|
+ <view class="itme-right common-view-css">
|
|
|
+ <view class="item-name flex-justify-space mb-16">
|
|
|
+ <view class="">
|
|
|
+ <view class="mb-4 fc-3 fs-28">
|
|
|
+ 恒生科技和半导体
|
|
|
+ </view>
|
|
|
+ <view class="fs-24 fc-9">
|
|
|
+ 1小时前
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="align-items-center">
|
|
|
+ <image class="rd-img mr-8" src="@/static/img/my/rd.png" mode=""></image>
|
|
|
+ <view class="fs-26 fc-9">
|
|
|
+ 125
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="text-overflow-ellipsis-t fs-30 fc-3 mb-16">
|
|
|
+ 欢迎打脸,科技类型很顽强,不是刚刚说1 1吧,换着领涨,这个季节玩什么光伏储白 酒,普
|
|
|
+ </view>
|
|
|
+ <view class="item-img-box mb-20 align-items-center flex-wrap-wrap">
|
|
|
+ <image class="b-rad-12" v-for="imgUrl in item.img" :src="imgUrl" mode="aspectFill"
|
|
|
+ :class="item.img.length==1?'item-img-one':item.img.length==2?'item-img-two':'item-img-three'">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <view class="align-items-center mb-40">
|
|
|
+ <view class="label-box align-items-center mr-20 b-rad-200 bgc-F2F2F2">
|
|
|
+ <image class="wz mr-8" src="@/static/img/my/wz.png" mode=""></image>
|
|
|
+ <view class="fs-24 fc-9">
|
|
|
+ 重庆工商职业学校
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="label-box align-items-center b-rad-200 bgc-F2F2F2">
|
|
|
+ <image class="wz mr-8" src="@/static/img/my/ht.png" mode=""></image>
|
|
|
+ <view class="fs-24 fc-9">
|
|
|
+ 买卖闲置
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="flex-justify-space">
|
|
|
+ <view class="align-items-center">
|
|
|
+ <image class="but-icons mr-8" src="@/static/img/my/fx.png" mode=""></image>
|
|
|
+ <view class="fs-24 fc-9">
|
|
|
+ 分享
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="align-items-center">
|
|
|
+ <image class="but-icons mr-8" src="@/static/img/my/z.png" mode=""></image>
|
|
|
+ <view class="fs-24 fc-9">
|
|
|
+ 12
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="align-items-center">
|
|
|
+ <image class="but-icons mr-8" src="@/static/img/my/hf.png" mode=""></image>
|
|
|
+ <view class="fs-24 fc-9">
|
|
|
+ 16
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <uni-icons color="#999999" type="trash" size="20"></uni-icons>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
+ <movable-area class="add-box">
|
|
|
+ <movable-view direction="all" y="300">
|
|
|
+ <view class="add-but b-rad-50 text-align-center" @click="addInfo()">
|
|
|
+ <uni-icons type="plusempty" color="#fff" size="30"></uni-icons>
|
|
|
+ </view>
|
|
|
+ </movable-view>
|
|
|
+ </movable-area>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ components: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ listData: [{
|
|
|
+ img: [
|
|
|
+ 'https://img2.baidu.com/it/u=363454452,1934740400&fm=253&fmt=auto&app=138&f=JPEG?w=864&h=486'
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ img: ['https://img1.baidu.com/it/u=391647807,608347418&fm=253&fmt=auto&app=120&f=JPEG?w=889&h=500',
|
|
|
+ 'https://img1.baidu.com/it/u=2042516722,265172545&fm=253&fmt=auto&app=120&f=JPEG?w=800&h=500'
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ img: ['https://img0.baidu.com/it/u=3650197984,2591413134&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
|
|
|
+ 'https://img0.baidu.com/it/u=1452587454,2859975382&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
|
|
|
+ 'https://img1.baidu.com/it/u=2550250358,534330568&fm=253&fmt=auto&app=138&f=GIF?w=500&h=500',
|
|
|
+ 'https://img2.baidu.com/it/u=1185521512,762382298&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500'
|
|
|
+ ]
|
|
|
+ }]
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(data) {},
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ goToUrl() {
|
|
|
+
|
|
|
+ },
|
|
|
+ scrolltolower() {
|
|
|
+ console.log('触底');
|
|
|
+ },
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .content-box {
|
|
|
+ padding: 20rpx 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-box {
|
|
|
+ padding: 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-name {
|
|
|
+ align-items: flex-start;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-head-img {
|
|
|
+ width: 80rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .rd-img {
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label-box {
|
|
|
+ padding: 0 12rpx;
|
|
|
+ height: 38rpx;
|
|
|
+ line-height: 38rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .wz {
|
|
|
+ width: 32rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .but-icons {
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-img-box {
|
|
|
+ width: calc(100% + 6rpx);
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-img-one {
|
|
|
+ width: 360rpx;
|
|
|
+ height: 360rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-img-two {
|
|
|
+ width: 276rpx;
|
|
|
+ height: 276rpx;
|
|
|
+ margin: 0 6rpx 0 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item-img-three {
|
|
|
+ width: 182rpx;
|
|
|
+ height: 182rpx;
|
|
|
+ margin: 0 6rpx 6rpx 0;
|
|
|
+ }
|
|
|
+ .add-box{
|
|
|
+ position: fixed;
|
|
|
+ right: 98rpx;
|
|
|
+ top: 10vh;
|
|
|
+ max-width: 88rpx;
|
|
|
+ height: 80vh;
|
|
|
+ z-index: 999;
|
|
|
+ }
|
|
|
+ .add-but{
|
|
|
+ width: 88rpx;
|
|
|
+ height: 88rpx;
|
|
|
+ line-height: 88rpx;
|
|
|
+ background: linear-gradient( 284deg, #0290FC 0%, #01D8FF 100%);
|
|
|
+ }
|
|
|
+</style>
|