zhywpt-sp/subpackage/service/remind/evaluate-list.vue

<!-- 评价列表 -->
<template>
  <view style="padding: 30rpx">
    <evaluate-tab-item :tabs="state.tabs" @tabClick="tabClick" />

    <view class="list" :class="state.type === '2' ? 'btn-divider' : ''">
      <evaluate-issue-item
        :dataList="state.dataList"
        v-if="state.type === '1'"
      />
      <evaluate-business-item
        :dataList="state.dataList"
        v-if="state.type === '2'"
      />
      <evaluate-equity-item
        :dataList="state.dataList"
        v-if="state.type === '3'"
      />
      <evaluate-salesman-item
        :dataList="state.dataList"
        v-if="state.type === '4'"
      />
    </view>
  </view>

  <view class="evaluate-btn" v-if="state.type === '2'">
    <submit-button
      title="去评价"
      @submit="goOrder()"
    ></submit-button>
  </view>
</template>

<script setup lang="ts">
import evaluateTabItem from "./components/evaluate-tab-item";
import evaluateIssueItem from "./components/evaluate-issue-item";
import evaluateEquityItem from "./components/evaluate-equity-item";
import evaluateBusinessItem from "./components/evaluate-business-item";
import evaluateSalesmanItem from "./components/evaluate-salesman-item";
import { onLoad } from "@dcloudio/uni-app";
import { reactive } from "vue";
import { request } from "@/utils/network/request";
import { stringToJson } from "@/utils/network/encryption";
import { satisfactionEvaluation } from "@/utils/network/api";
const state = reactive({
  type: "", //评价列表类型 1-发行产品评价 2-业务办理满意度评价 3-权益产品评价 4-业务员满意度评价(暂无UI)
  tabs: ["全部", "好评", "中评", "差评"],
  curCheckTab: "全部", //当前选择的tab
  dataList: [], //评价列表
  scoreLevel:0,   //0 全部 1 好评 2 中评 3 差评
  serviceType:'',
});

onLoad((options) => {
	console.log("options",options)
  state.type = options.type;
  uni.setNavigationBarTitle({
    title: options.title,
  });
  // if (state.type === "2") {
  //   state.tabs = [...state.tabs, "业务类型"];
  // }

  fetchList();
});
const goOrder=()=>{
	uni.switchTab({
		url:"/pages/order/order"
	})
}
/* tab点击 */
const tabClick = (tab) => {
	console.log("tab",tab)
    state.curCheckTab = tab;
	if(tab=='全部'){
		state.scoreLevel=0
	}else if(tab=='好评'){
		state.scoreLevel=1
	}else if(tab=='中评'){
		state.scoreLevel=2
	}else{
		state.scoreLevel=3
	}
	requestData("11", { type: state.curCheckTab });
};

/* 根据不同条件获取数据 */
const fetchList = () => {
  switch (state.type) {
    case "1": //发行产品评价
	  state.serviceType='product';
      requestData("11", { type: state.curCheckTab });
      break;
    case "2": //业务办理满意度评价
	  state.serviceType='service';
      requestData("22", { type: state.curCheckTab });
      break;
    case "3": //权益产品评价
	  state.serviceType='equity';
      requestData("33", { type: state.curCheckTab });
      break;
    case "4": //业务员满意度评价
	  state.serviceType='staff';
      requestData("44", { type: state.curCheckTab });
      break;
    default:
      break;
  }
};

/*请求评价列表*/
const requestData = (code, data) => {
  const options = {
    type: 2,
    data: {
		"serviceType":state.serviceType,
		"scoreLevel":state.scoreLevel,
	},
    method: "POST",
    showLoading: true,
  };
  request(satisfactionEvaluation,options).then((res)=>{
	  //若不填评价内容，根据打分规则自动填充评价内容
	  //差评展示：默认差评 2.5分及以下
	  //中评展示：默认中评 2.5以上4.0以下 
	  //好评展示：默认好评 4.0及4.0以上
	  console.log("stringToJson(res.bizContent)",stringToJson(res.bizContent).data)
	  const data=stringToJson(res.bizContent).data;
	  if(data){
		  for(var i=0;i<data.length;i++){
		  	  if(data[i].score<=2.5){
		  		  data[i].evaluate='差评';
		  	  }else if(data[i].score>2.5 && data[i].score<4){
		  		  data[i].evaluate='中评';
		  	  }else{
		  		  data[i].evaluate='好评';
		  	  }
			  data[i].insertTime = data[i].insertTime.split('T').join(' ');
			  // data[i].pictureUrl=data[i].pictureUrl.split(',')
		    }
		  state.dataList = data;
		  
	  }else{
		  state.dataList=[]
	  }
	  
  })

  //TODO 构造假数据
  // state.dataList = [
  //   {
  //     name: "张三",
  //     time: "2021-10-01 10:10",
  //     score: "4.5",
  //     evaluate: "好评",
  //     title: "产品A",
  //     content:
  //       "这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价",
  //   },
  //   {
  //     name: "李四",
  //     time: "2022-10-01 10:10",
  //     score: "3.0",
  //     evaluate: "中评",
  //     title: "产品B",
  //     content:
  //       "这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价",
  //   },
  //   {
  //     name: "河西笑傲",
  //     time: "2023-10-01 10:10",
  //     score: "2.8",
  //     evaluate: "差评",
  //     title: "产品C",
  //     content:
  //       "这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价这里是评价",
  //   },
  // ];
};
</script>

<style>
page {
  background-color: #eef7f7;
  box-sizing: border-box;
}
</style>
<style lang="scss" scoped>
.list {
  margin-top: 30rpx;
}
.btn-divider {
  margin-bottom: 180rpx;
}
.evaluate-btn {
  width: 100%;
  position: fixed;
  bottom: 0rpx;
  padding: 30rpx 40rpx;
  background-color: #eef7f7;
  text-align: center;
  box-sizing: border-box;
}
</style>