ZhiHuiJiaoWu_UniApp/pages/common/my_message.vue

<!--我的消息-列表-->
<template>
  <view class="main_box">

    <view class="main_section">
      <view class="section_1">
        <view class="item" @click="openViewSysMsgList()">
          <view class="left">
            <image class="pic" src="@/static/images/common/xi_tong_xiao_xi.png"></image>
            <view>系统消息</view>
          </view>
          <view class="right">
            <view>99</view>
            <fui-icon name="arrowright" :size="60"></fui-icon>
          </view>
        </view>

        <view class="item" @click="openViewImChatInfo({user_id:1})">
          <view class="left">
            <image class="pic" src="@/static/images/common/yong_hu.png"></image>
            <view>张老师</view>
          </view>
          <view class="right">
            <view>99</view>
            <fui-icon name="arrowright" :size="60"></fui-icon>
          </view>
        </view>

        <view class="item" @click="openViewImChatInfo({user_id:2})">
          <view class="left">
            <image class="pic" src="@/static/images/common/yong_hu.png"></image>
            <view>李老师</view>
          </view>
          <view class="right">
            <view>99</view>
            <fui-icon name="arrowright" :size="60"></fui-icon>
          </view>
        </view>

      </view>
    </view>
  </view>
</template>

<script>
import memberApi from '@/api/member.js';
import AQUplodeImgMulti from '@/components/AQ/AQUplodeImgMulti';
import AQTabber from "@/components/AQ/AQTabber"


export default {
  components: {
    AQTabber,
    AQUplodeImgMulti,
  },
  data() {
    return {
      formData: {
        images_arr: [],
        images: '',
        content: '',
        mailbox: '',
      },
    }
  },
  onLoad() {
  },
  methods: {
    //######AQ上传文件组件相关######
    // 上传文件回调
    AQUploadSuccess(res) {
      console.log('接收AQ上传回调xxx1', res)
      // 使用 split 方法分割字符串
      let _inputValue = []
      if (res.filePathArr.length) {
        _inputValue = res.filePathArr
      }
      this.formData[res.inputName] = _inputValue
      // console.log('接收AQ上传回调xxx1',res)
      // console.log('接收AQ上传回调xxx2',this.formData.member_store_certification_arr)
    },

    async submitForm() {
      let data = {...this.formData}
      data.images = data.images_arr.join(',')
      if (!data.content) {
        //反馈内容为必填项
        uni.showToast({
          title: '反馈内容为必填项',
          icon: 'none'
        })
        return
      }
      let res = await memberApi.setFeedback(data)
      if (res.code != 1) {
        uni.showToast({
          title: res.msg,
          icon: 'none'
        })
      } else {
        uni.showToast({
          title: '提交成功',
          icon: 'none'
        })
        //延迟1s执行
        setTimeout(() => {
          this.$util.openHomeView();
        }, 1000);
      }
    },

    //跳转页面-系统消息列表
    openViewSysMsgList(){
      uni.navigateTo({
        url: `/pages/common/sys_msg_list`
      })
    },

    //跳转页面-聊天页面
    openViewImChatInfo(v){
      let user_id = 1
      uni.navigateTo({
        url: `/pages/common/im_chat_info?user_id=${user_id}`
      })
    },

  }
}
</script>

<style lang="less" scoped>
	.main_box {
		background: #292929;
	}

	//自定义导航栏
	.navbar_section {
		display: flex;
		justify-content: center;
		align-items: center;
		background: #29d3b4;

		.title {
			padding: 20rpx 0;
			font-size: 30rpx;
			color: #315d55;
		}
	}

	.main_section {
		min-height: 100vh;
		background: #292929 100%;
		padding: 0 0rpx;
		padding-top: 32rpx;
		padding-bottom: 150rpx;
		font-size: 28rpx;
		display: flex;
		flex-direction: column;
		gap: 20rpx;

		.section {
			background-color: #434544;
			padding: 40rpx 40rpx;
		}

    .section_1{
      padding: 0 24rpx;
      display: flex;
      flex-direction: column;
      gap: 38rpx;
      .item{
        display: flex;
        justify-content: space-between;
        align-items: center;

        padding: 40rpx 18rpx 36rpx;

        border-radius: 14rpx;
        background-color: rgba(255,255,255,1);
        border: 2rpx solid rgba(187,187,187,1);

        .left{
          display: flex;
          align-items: center;
          gap: 16rpx;
          .pic{
            width: 68rpx;
            height: 68rpx;
          }
          view{
            color: #D9001B;
            font-size: 32rpx;
          }
        }
        .right{
          display: flex;
          align-items: center;
          view{
            padding: 5rpx;
            border: 1px solid #BBBBBB;
            border-radius: 50%;
            color: #D9001B;
          }
        }
      }
    }




	}

	.describe {
		color: #999999;
		padding-left: 30rpx;
	}
</style>