qianzhi-message/pages/publish/my-publish.vue

<template>
  <view class="container">
    <z-paging
      ref="paging"
      v-model="dataList"
      @query="queryList"
      style="padding-top: 10px"
    >
      <template slot="top">
        <u-navbar bgColor="#D6DDFF" :autoBack="true" :placeholder="true">
          <view class="u-nav-slot-center" slot="center">
            <text
              class="u-navbar__content__left__text"
              style="color: #000; font-size: 34rpx; font-weight: 600"
              >我的发布</text
            >
          </view>
        </u-navbar>
      </template>

      <view class="list-wrap2">
        <u-radio-group
          v-model="radiovalue"
          placement="column"
          @change="radioChange"
        >
          <view
            class="item text-16 color-333 text-500"
            v-for="(item, index) in dataList"
            :key="index"
          >
            <view class="item" v-if="item.type == 1">
              <view
                style="display: flex; flex-direction: row; align-items: center"
              >
                <u-radio shape="circle" :name="item.id" activeColor="#4D65FF">
                </u-radio>
                <view class="contont" @click="houseDetai(item)">
                  <img
                    :src="item.coverImg ? item.coverImg : ''"
                    style="width: 100px; height: 100px"
                  />
                  <view class="right">
                    <view class="titles">
                      <view class="name"> {{ item.title }} </view>
                    </view>
                    <view
                      class="info"
                      style="width: 100%; justify-content: flex-start"
                    >
                      <u-tag
                        style="margin-right: 10rpx"
                        :text="items"
                        plain
                        size="mini"
                        v-for="(items, index) in item.skill
                          ? item.skill.split(',')
                          : []"
                        :key="index"
                      ></u-tag>
                    </view>

                    <view
                      class="info"
                      style="width: 100%; justify-content: space-between"
                    >
                      <text>{{
                        item.experienceRange == 0
                          ? "1年以下"
                          : item.experienceRange == 1
                          ? "1-3年"
                          : item.experienceRange == 2
                          ? "3-5年"
                          : item.experienceRange == 3
                          ? "5年以上"
                          : ""
                      }}</text>
                      | <text>{{ item.age }}岁</text> |
                      <text>{{ item.nativePlace.substring(0, 3) }}人</text>|
                      <text>{{
                        item.atHome == 0
                          ? "住家"
                          : item.atHome == 1
                          ? "不住家"
                          : item.atHome == 2
                          ? "白班"
                          : item.atHome == 3
                          ? "钟点工"
                          : ""
                      }}</text>
                    </view>
                    <view class="intro"> {{ item.intro }} </view>
                    <!-- <view class="time"> 发布时间{{ item.createTime }} </view> -->
                  </view>
                </view>
              </view>
            </view>
            <view class="item" :key="index" v-if="item.type == 0">
              <view
                style="display: flex; flex-direction: row; align-items: center"
              >
                <u-radio shape="circle" :name="item.id" activeColor="#4D65FF">
                </u-radio>
                <view class="contont" @click="houseDetai(item)">
                  <img
                    :src="item.coverImg ? item.coverImg : ''"
                    style="width: 120px; height: 125px"
                  />
                  <view class="right">
                    <view class="titles">
                      <view class="name"> {{ item.title }} </view>
                    </view>
                    <view class="intro"> {{ item.intro }} </view>
                    <!-- <view class="time"> 发布时间{{ item.createTime }} </view> -->
                  </view>
                </view>
              </view>
            </view>
          </view>
        </u-radio-group>
      </view>
    </z-paging>
    <view
      @click="sendHandle"
      v-debounce
      class="operate-fixed qzy-space-between-center"
    >
      <u-button
        :disabled="!radiovalue ? true : false"
        color="linear-gradient( 97deg, #4D65FF 0%, #6F91FF 100%)"
        >发送</u-button
      >
    </view>
  </view>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      radiovalue: "",
      houseId: "",
      dataList: [],
      userId: "",
      queryParams: {
        currPage: 1,
        pageSize: 10,
        status: 1,
      },
    };
  },
  onLoad(options) {
    this.userId = options.userId;
  },
  methods: {
    queryList(currPage, pageSize) {
      this.queryParams.currPage = currPage;
      this.queryParams.pageSize = pageSize;
      this.$refs.paging.complete([]);
      this.api
        .hmGoodsList(this.queryParams)
        .then((res) => {
          if (res.code == 200) {
            this.$refs.paging.complete(res.data.list);
          }
        })
        .catch((err) => {
          this.$refs.paging.complete(false);
          uni.$u.toast("服务内部异常");
        });
    },
    sendHandle() {
      console.log(this.radiovalue);
      let params = {
        refId: this.radiovalue,
        isSend: 1,
        sendRefType: 1,
        status: -1,
        shopUserId: uni.getStorageSync("userId").substring(1),
        userId: this.userId,
        msgContent: {},
        sendType: 1,
      };
      this.api.sendMessage(params).then((res) => {
        if (res.code === 200) {
          uni.$u.toast("已发送~");
          setTimeout(() => {
            uni.navigateBack({
              delta: 1,
            });
          }, 1000);
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.container {
  background: #f4f4f4;
  height: 100%;
}
::v-deep .search-box {
  height: 100rpx;
  padding: 0 24rpx;
  background: #fff;
  position: fixed;
  top: 0;
  width: 100%;
  box-sizing: border-box;
  z-index: 1000;
  .u-search {
    border-radius: 44rpx;
    border: 1.5px solid rgba(0, 181, 148, 0.5);
  }
  .publish {
    width: 120rpx;
  }
  image {
    width: 50rpx;
    height: 50rpx;
  }
}
.tab-box {
  padding: 10rpx 24rpx;
  background: #fff;
  margin: 0;
  position: relative;
  box-sizing: border-box;
  .manage {
    position: absolute;
    right: 24rpx;
    top: 24rpx;
    font-size: 28rpx;
    image {
      width: 32rpx;
      height: 32rpx;
      margin-top: -4rpx;
    }
  }
  .manage-active {
    color: #00b594;
  }
}
.operate-fixed {
  width: 100%;
  height: 120rpx;
  position: fixed;
  background: #fff;
  bottom: 0;
  padding: 0 24rpx;
  box-sizing: border-box;
  z-index: 100;
}

.list-wrap2 {
  .item {
    width: 95%;
    margin: auto auto 10px auto;
    background: #ffffff;
    border-radius: 15rpx;
    .header {
      padding: 20rpx 40rpx 20rpx 40rpx;
      height: 60rpx;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      .title {
        font-family: PingFangSC, PingFang SC;
        font-weight: bold;
        font-size: 34rpx;
        color: #333333;
        text-align: left;
        font-style: normal;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        .icon {
          width: 52rpx;
          height: 52rpx;
          margin-right: 5rpx;
        }
      }
    }
    .contont {
      // padding: 0px 40rpx;
      padding-top: 20rpx;
      display: flex;
      flex-direction: row;
      align-items: flex-start;
      .right {
        margin-left: 30rpx;
        line-height: 60rpx;
        width: 100%;
      }
      .price {
        margin-top: 10rpx;
        font-weight: bold;
        font-size: 40rpx;
        color: #ff2f2f;
        text-align: left;
        font-style: normal;
      }
      .time {
        font-weight: 500;
        font-size: 26rpx;
        color: #666666;
        text-align: left;
        font-style: normal;
      }
      .titles {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        .tag {
          width: 75rpx;
          height: 45rpx;
          background: linear-gradient(270deg, #03f3a4 0%, #3ae2c4 100%);
          border-radius: 2rpx;
          text-align: center;
          color: white;
          display: flex;
          flex-direction: row;
          justify-content: center;
          align-items: center;
        }
        .name {
          margin-left: 5rpx;
          font-family: PingFang-SC, PingFang-SC;
          font-weight: bold;
          font-size: 37rpx;
          color: #333333;
          text-align: left;
          font-style: normal;
        }
      }
      .info {
        font-weight: 500;
        font-size: 28rpx;
        color: #666666;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
      }
    }
  }
}
::v-deep .z-paging-content {
  padding-bottom: 120rpx !important;
}
</style>