jd_logistics/jd_logistics-app/pages/policy/ad_detail.vue

<template> 
<view class="padding20 ad_detail">
  <image :src="HTTP_ADMIN_URL+imageUrl" mode="" class="swiper_img border_radius_20"></image>
  <view v-html="remark" class="padding20 border_radius_20 bg_color_fff mt20"></view>
  <view class="mt20">
    <view v-for="(item, index) in aiAgents" :key="index" 
    @click="toAi({agentId:item.agentId})"
    class="flex-center-between padding20 border_radius_20 bg_color_fff mt20">
      <image :src="HTTP_ADMIN_URL+item.imageUrl" mode="" class="aiAgents_img border_radius_20 mr20"></image>
      <view class="ml20 flex_1 flex-center-between">
        <view class="flex_1 mr20">
          <view class="bold font_size35 line2">{{item.agentName}}</view>
          <view class="gray font_size25 line2">{{item.agentDesc}}</view>
        </view>
        <image src="/static/img/arrow-right.png" mode="widthFix" class="menu_img"></image>
      </view>
    </view>
  </view>
</view>
</template>
<script setup> 
import { ref } from "vue";
import { HTTP_ADMIN_URL } from "@/config/app.js";
import { getAdDetails } from "@/api/home";
import { onLoad } from "@dcloudio/uni-app";
import { useAppStore } from "@/stores/app";
const appStore = useAppStore();

const imageUrl = ref('');
const remark = ref('');
const aiAgents = ref([]);

onLoad(({dictCode}) => { 
  getAdDetailsFn(dictCode);
})
function getAdDetailsFn(dictCode) { 
  getAdDetails({dictCode}).then(res => {
    if (res.code == 200) {
      imageUrl.value = res.data?.sysDictData?.dictValue ||  '';
      remark.value = res.data?.sysDictData?.remark || '';
      aiAgents.value = res.data?.aiAgents || [];
    }
  })
}
function toAi({agentId='', msgContent=''}){
	if(agentId) appStore.UPDATE_agentId(agentId);
	if(msgContent)appStore.UPDATE_msgContent(msgContent);
	uni.switchTab({
		url: '/pages/ai/ai'
	});
}

</script>
<style lang="scss" scoped>
  .ad_detail{
    height: 100%;
    .swiper_img{
      width: 100%;
      height: 350rpx;
      background-color: #ffffff;
    }
    .aiAgents_img{
      width: 100rpx;
      height: 100rpx;
    }
    .menu_img{
      width: 40rpx;
      height: 40rpx;
    } 
  }
</style>