import React, { useState, useEffect } from "react";
import Taro from "@tarojs/taro";
import withLayout from "@/layout";
import "./index.scss";
import { ScrollView } from "@tarojs/components";
import "@/assets/css/iconfont.css";
import { Image, RichText } from "@tarojs/components";
import { queryPolicyDetail } from "@/services/policy";
import { formatDate } from "@/utils/chatDate";

export default withLayout((props) => {
  const { router, shareContent, trackData, person, page, setNavigationBarTitle } = props;
  const { id } = router.params;
  const [data, setData] = useState({});

  const getData = (params) => {
    Taro.showLoading();
    queryPolicyDetail(params).then((res) => {
      setData(res||{});
      setNavigationBarTitle(res?.title)
      Taro.hideLoading();
    });
  };
  useEffect(() => {
    if (id) {
      getData(id);
    }
  }, [id]);

  return (
    <view className="Page encyDetail flex-v">
      <view className="flex-item">
        <view>
          <ScrollView
            scroll-y={true}
            refresher-enabled={false}
            refresher-background="#fff"
          >
            <view className="PageContent">
              <view className="Info">
                <view>
                  <text className="Title">
                    {data.title}
                  </text>
                  <view>
                  <text>阅读：{data.pvNum}</text>
                    <text className="Time">
                      {formatDate(data.createDate, "yyyy-M-d")}
                    </text>
                  </view>
                </view>
              </view>

              <view className="Content">
                <RichText nodes={data.body}></RichText>
              </view>
            </view>
          </ScrollView>
        </view>
      </view>
    
    
    </view>
  );
});
