<template>
  <oa-scroll
    customClass="scroll-height"
    :customStyle="{}"
    :refresherLoad="false"
    :refresherEnabled="false"
    :refresherDefaultStyle="'none'"
    :refresherThreshold="44"
    :refresherBackground="'#f5f6f7'"
    :data-theme="'theme-' + proxy.$settingStore.themeColor.name"
  >
    <view class="menu-list">
      <view class="list-cell">
        <view class="menu-item-box">
          <view style="font-size: 14px; font-weight: 600"> 为了更好提升我们的服务，请您对我们的服务人员进行评价、留下您宝贵的意见，我们将会不断完善我们的服务。 </view>
        </view>
      </view>
    </view>

    <view class="menu-list">
      <view class="list-cell">
        <view class="menu-item-box mb15">
          <view style="font-size: 14px; font-weight: 600"> 总体满意度 </view>
        </view>
        <view class="menu-item-box">
          <u-rate :count="rateCount" v-model="rateValue" :size="24" :gutter="0" :minCount="0" :touchable="true" :allowHalf="true" :activeColor="proxy.$settingStore.themeColor.color"></u-rate>
          <view style="font-size: 14px; margin: auto 0 auto auto">我的评分： {{ rateValue }}分</view>
        </view>
      </view>
    </view>

    <view class="menu-list">
      <view class="list-cell">
        <view class="menu-item-box mb15">
          <view style="font-size: 14px; font-weight: 600"> 建议或意见 </view>
        </view>
        <view class="menu-item-box">
          <u--textarea v-model="textareaValue" border="none" placeholder="请留下您的宝贵意见，这对我们很重要哦~" maxlength="100" style="padding: 0"></u--textarea>
        </view>
      </view>
    </view>

    <view class="app-button">
      <view class="app-button-padding"></view>
      <view class="app-button-fixed">
        <u-button class="app-buttom" type="primary" @click="handleSubmit('提交')" shape="circle"> 提交 </u-button>
      </view>
    </view>
  </oa-scroll>
</template>

<script setup>
import config from "@/config";
import storage from "@/utils/storage";
import { onLoad, onShow, onReady, onHide, onLaunch, onNavigationBarButtonTap, onPageScroll } from "@dcloudio/uni-app";
import { ref, reactive, computed, getCurrentInstance, toRefs, inject } from "vue";
import { publicStores, useStores } from "@/store/modules/index";

import { score } from "@/api/common/index.js";

const { proxy } = getCurrentInstance();
const publicStore = publicStores();

const data = reactive({
  rateCount: 5,
  rateValue: 0,
  textareaValue: "",
  repairCode: "",
  statusBool: true,
});
const { rateCount, rateValue, textareaValue, repairCode, statusBool } = toRefs(data);

/**
 * @提交
 */
function handleSubmit(value) {
  score({
    repairCode: repairCode.value,
    score: rateValue.value,
    appraiseContent: textareaValue.value,
  }).then((requset) => {
    if (requset.status === "SUCCESS") {
      proxy.$tab.navigateTo(`/pages/common/success/index?codeName=评价成功&showNow=${statusBool.value}`);
    }
  });
}

onLoad((options) => {
  if ("statusBool" in options) {
    statusBool.value = options.statusBool;
    document.getElementsByClassName("uni-page-head-hd")[0].style.cssText = "display: none;";
  }

  if ("repairCode" in options) {
    repairCode.value = options.repairCode;
  }
});

onReady(() => {});

onShow(() => {
  //调用系统主题颜色
  proxy.$settingStore.systemThemeColor([1]);
});
</script>

<style lang="scss" scoped></style>
