|
|
@@ -37,200 +37,7 @@ export default function HistoryItem(props: {
|
|
|
type?: string
|
|
|
}) {
|
|
|
const health = useSelector((state: any) => state.health);
|
|
|
- let showActionSheetWithOptions;
|
|
|
- function preview(obj) {
|
|
|
- var list: any = []
|
|
|
|
|
|
- props.data.events.map((item) => {
|
|
|
- item.moments && item.moments.map(moment => {
|
|
|
- moment.media && moment.media.map((obj) => {
|
|
|
- list.push(obj.url)
|
|
|
- })
|
|
|
- })
|
|
|
-
|
|
|
- })
|
|
|
-
|
|
|
-
|
|
|
- Taro.previewImage({
|
|
|
- current: obj.url,
|
|
|
- urls: list
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- //npm install react-native-text-size
|
|
|
-
|
|
|
- function getTitle(item) {
|
|
|
- if (item.title) return item.title
|
|
|
- if (item.moments) {
|
|
|
- return item.moments[0].title
|
|
|
- }
|
|
|
- // if (health.mode == 'FAST') {
|
|
|
- // return '开始断食'
|
|
|
- // }
|
|
|
- // else if (health.mode == 'SLEEP') {
|
|
|
- // return '开始睡眠'
|
|
|
- // }
|
|
|
- return ''
|
|
|
- }
|
|
|
-
|
|
|
- function ring() {
|
|
|
- const common: RingCommon = {
|
|
|
- useCase: 'ChooseScenario',
|
|
|
- radius: 12,
|
|
|
- lineWidth: 6,
|
|
|
- isFast: true,
|
|
|
- status: 'WAIT_FOR_START'
|
|
|
- }
|
|
|
-
|
|
|
- const bgRing: BgRing = {
|
|
|
- color: MainColorType.ringBg
|
|
|
- }
|
|
|
-
|
|
|
- const realRing = {
|
|
|
- hideBg: true,
|
|
|
- color: props.mode == 'FAST,SLEEP' ? getThemeColor('FAST') : getThemeColor(health.mode),
|
|
|
- startArc: startArc(props.data.window_range.start_timestamp),
|
|
|
- durationArc: durationArc(props.data.window_range.start_timestamp, props.data.window_range.end_timestamp)
|
|
|
- }
|
|
|
- const canvasId = (props.mode == 'FAST,SLEEP' ? 'history_fast_sleep' + props.index : 'history_' + props.index) + props.type
|
|
|
- return <Rings common={common} bgRing={bgRing} realRing={realRing} canvasId={canvasId} />
|
|
|
- }
|
|
|
-
|
|
|
- function ring2() {
|
|
|
- const common: RingCommon = {
|
|
|
- useCase: 'ChooseScenario',
|
|
|
- radius: 12,
|
|
|
- lineWidth: 6,
|
|
|
- isFast: true,
|
|
|
- status: 'WAIT_FOR_START'
|
|
|
- }
|
|
|
-
|
|
|
- const bgRing: BgRing = {
|
|
|
- color: MainColorType.ringBg
|
|
|
- }
|
|
|
-
|
|
|
- const realRing = {
|
|
|
- hideBg: true,
|
|
|
- color: getThemeColor('SLEEP'),
|
|
|
- startArc: startArc(props.data.events[1].time.timestamp),
|
|
|
- durationArc: durationArc(props.data.events[1].time.timestamp, props.data.events[2].time.timestamp)
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- const canvasId = 'history2_props_mode' + props.index + props.type
|
|
|
- return <Rings common={common} bgRing={bgRing} realRing={realRing} canvasId={canvasId} />
|
|
|
- }
|
|
|
-
|
|
|
- function mediaCount() {
|
|
|
- let count = 0;
|
|
|
- props.data.events.map((item) => {
|
|
|
- if (item.moments) {
|
|
|
- item.moments.map(moment => {
|
|
|
- moment.media.map((obj) => {
|
|
|
- count++
|
|
|
- })
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- })
|
|
|
- return count;
|
|
|
- }
|
|
|
-
|
|
|
- function imgList() {
|
|
|
- let array: any = [];
|
|
|
- props.data.events.map((item) => {
|
|
|
- if (item.moments) {
|
|
|
- item.moments.map(moment => {
|
|
|
- moment.media.map((obj) => {
|
|
|
- array.push(obj.url)
|
|
|
- })
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- })
|
|
|
- return array;
|
|
|
- }
|
|
|
-
|
|
|
- function historyDate() {
|
|
|
- if (!props.preData) {
|
|
|
- if (global.language == 'zh' && TimeFormatter.isToday(props.data.window_range.start_timestamp)) {
|
|
|
- return '今天'
|
|
|
- }
|
|
|
- if (global.language == 'zh' && TimeFormatter.isYesterday(props.data.window_range.start_timestamp)) {
|
|
|
- return '昨天'
|
|
|
- }
|
|
|
- return dayjs(props.data.window_range.start_timestamp).format('DD')
|
|
|
- }
|
|
|
- if (dayjs(props.data.window_range.start_timestamp).format('MM-DD') ==
|
|
|
- dayjs(props.preData.window_range.start_timestamp).format('MM-DD')) {
|
|
|
- return ''
|
|
|
- }
|
|
|
- if (global.language == 'zh' && TimeFormatter.isToday(props.data.window_range.start_timestamp)) {
|
|
|
- return '今天'
|
|
|
- }
|
|
|
- if (global.language == 'zh' && TimeFormatter.isYesterday(props.data.window_range.start_timestamp)) {
|
|
|
- return '昨天'
|
|
|
- }
|
|
|
- return dayjs(props.data.window_range.start_timestamp).format('DD')
|
|
|
- }
|
|
|
-
|
|
|
- function historyMonth() {
|
|
|
- if (!props.preData) {
|
|
|
- if (global.language == 'zh' && TimeFormatter.isToday(props.data.window_range.start_timestamp)) {
|
|
|
- return ''
|
|
|
- }
|
|
|
- if (global.language == 'zh' && TimeFormatter.isYesterday(props.data.window_range.start_timestamp)) {
|
|
|
- return ''
|
|
|
- }
|
|
|
- return dayjs(props.data.window_range.start_timestamp).format('MMM')
|
|
|
- }
|
|
|
- if (dayjs(props.data.window_range.start_timestamp).format('MM-DD') ==
|
|
|
- dayjs(props.preData.window_range.start_timestamp).format('MM-DD')) {
|
|
|
- return ''
|
|
|
- }
|
|
|
- if (global.language == 'zh' && TimeFormatter.isToday(props.data.window_range.start_timestamp)) {
|
|
|
- return ''
|
|
|
- }
|
|
|
- if (global.language == 'zh' && TimeFormatter.isYesterday(props.data.window_range.start_timestamp)) {
|
|
|
- return ''
|
|
|
- }
|
|
|
- return dayjs(props.data.window_range.start_timestamp).format('MMM')
|
|
|
- }
|
|
|
-
|
|
|
- function tapDel() {
|
|
|
- showAlert({
|
|
|
- title: '确定要放弃本次断食吗?',
|
|
|
- content: '放弃后断食不会本记录',
|
|
|
- showCancel: true,
|
|
|
- cancelText: '取消',
|
|
|
- confirmText: '确定',
|
|
|
- confirm: () => {
|
|
|
- del()
|
|
|
- }
|
|
|
- })
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- function del() {
|
|
|
- const { window_id } = props.data
|
|
|
- delRecord({ ids: [window_id] }).then(res => {
|
|
|
-
|
|
|
- global.refreshWindow()
|
|
|
- global.refreshHistory()
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- function dayTag(index) {
|
|
|
- if (index == 0) {
|
|
|
- return ''
|
|
|
- }
|
|
|
- else {
|
|
|
- var begin = props.data.events[0].time.timestamp
|
|
|
- var end = props.data.events[index].time.timestamp
|
|
|
-
|
|
|
- return TimeFormatter.dayTagText(begin, end)
|
|
|
- }
|
|
|
- }
|
|
|
|
|
|
function goDetail(event_id?: any) {
|
|
|
// debugger
|
|
|
@@ -243,246 +50,6 @@ export default function HistoryItem(props: {
|
|
|
|
|
|
}
|
|
|
|
|
|
- // if (props.mode == 'FAST,SLEEP'){
|
|
|
- // debugger
|
|
|
- // }
|
|
|
-
|
|
|
- function momentItem(moment) {
|
|
|
- var hasImage = false
|
|
|
- if (moment.media && moment.media.length > 0) hasImage = true
|
|
|
- if (moment.title || moment.description) {
|
|
|
- return <View style={{
|
|
|
- display: 'flex',
|
|
|
- flex: 1,
|
|
|
- flexShrink: 0,
|
|
|
- flexDirection: 'column',
|
|
|
- backgroundColor: hasImage ? 'transparent' : '#fafafa',
|
|
|
- paddingLeft: !hasImage ? rpxToPx(20) : rpxToPx(17),
|
|
|
- paddingRight: !hasImage ? rpxToPx(20) : 0,
|
|
|
- paddingTop: !hasImage ? rpxToPx(12) : 0,
|
|
|
- paddingBottom: !hasImage ? rpxToPx(12) : 0
|
|
|
- }}>
|
|
|
- <TimeTitleDesc
|
|
|
- className={hasImage ? 'line3' : 'line2'}
|
|
|
- timeObj={moment.time}
|
|
|
- time=''
|
|
|
- // time={moment.time && dayjs(moment.time.timestamp).format('HH:mm')}
|
|
|
- // dayTag={dayTag(index)}
|
|
|
- title={moment.title}
|
|
|
- desc={moment.description}
|
|
|
- />
|
|
|
- </View>
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- function temp() {
|
|
|
- return <View className="history_item2" onClick={goDetail}>
|
|
|
- {/* <View className="cell_date" >
|
|
|
- <View className="h42 w500" style={{ lineHeight: rpxToPx(60) + 'px' }}>{historyDate()}</View>
|
|
|
- <View className="h24 w500" style={{ marginLeft: rpxToPx(6), marginTop: rpxToPx(13), lineHeight: rpxToPx(47) + 'px' }}>{historyMonth()}</View>
|
|
|
- </View> */}
|
|
|
- <TimelineDate timestamp={props.data.window_range.start_timestamp}
|
|
|
- pre_timestamp={props.preData?props.preData.window_range.start_timestamp:null}
|
|
|
- />
|
|
|
- <View className="history_content" style={{ paddingTop: rpxToPx(4) }}>
|
|
|
- {
|
|
|
- props.data.dataArray.map((content, i) => {
|
|
|
- return <View style={{ display: 'flex', flexDirection: 'row', marginBottom: rpxToPx(12), flex: 1 }} key={i}>
|
|
|
- {
|
|
|
- content.type == 'TEXT' && <View style={{
|
|
|
- display: 'flex',
|
|
|
- flex: 1,
|
|
|
- flexShrink: 0,
|
|
|
- flexDirection: 'column',
|
|
|
- backgroundColor: '#fafafa',
|
|
|
- paddingLeft: rpxToPx(20),
|
|
|
- paddingRight: rpxToPx(20),
|
|
|
- paddingTop: rpxToPx(12),
|
|
|
- paddingBottom: rpxToPx(12)
|
|
|
- }}>{content.data.map((detail, j) => {
|
|
|
- return <TimeTitleDesc
|
|
|
- key={j * 100}
|
|
|
- className={'line3'}
|
|
|
- time=''
|
|
|
- title={detail.title}
|
|
|
- desc={detail.description}
|
|
|
- />
|
|
|
- })}</View>
|
|
|
- }
|
|
|
- {
|
|
|
- content.type == 'PIC' && <CoverList imgs={content.data} count={content.data.length} />
|
|
|
- }
|
|
|
- {
|
|
|
- content.type == 'PIC_TEXT' && <Image
|
|
|
- style={{ width: rpxToPx(178), height: rpxToPx(178), marginRight: rpxToPx(7), flexShrink: 0 }}
|
|
|
- src={content.data[0].url}
|
|
|
- onClick={(e) => {
|
|
|
- if (process.env.TARO_ENV == 'weapp') {
|
|
|
- e.stopPropagation()
|
|
|
- }
|
|
|
- Taro.previewImage({
|
|
|
- current: content.data[0].url,
|
|
|
- urls: [content.data[0].url]
|
|
|
- })
|
|
|
- }}
|
|
|
- mode="aspectFill" />
|
|
|
- }
|
|
|
- {
|
|
|
- content.type == 'PIC_TEXT' && <View style={{
|
|
|
- display: 'flex',
|
|
|
- flex: 1,
|
|
|
- flexShrink: 0,
|
|
|
- flexDirection: 'column',
|
|
|
- backgroundColor: 'transparent',
|
|
|
- paddingLeft: rpxToPx(17),
|
|
|
- paddingRight: 0,
|
|
|
- paddingTop: 0,
|
|
|
- paddingBottom: 0
|
|
|
- }}>
|
|
|
- <TimeTitleDesc
|
|
|
- className={'line3'}
|
|
|
- time=''
|
|
|
- title={content.data[0].title}
|
|
|
- desc={content.data[0].description}
|
|
|
- />
|
|
|
- </View>
|
|
|
- }
|
|
|
- </View>
|
|
|
- })
|
|
|
- }
|
|
|
- {/* {
|
|
|
- props.data.events.map((event, i) => {
|
|
|
- return event.moments && event.moments.map((moment, j) => {
|
|
|
- return <View style={{ display: 'flex', flexDirection: 'row', marginBottom: rpxToPx(12), flex: 1 }} key={i * 100 + j}>
|
|
|
- {
|
|
|
- moment.media && moment.media.length > 0 && <Image
|
|
|
- style={{ width: rpxToPx(178), height: rpxToPx(178), marginRight: rpxToPx(7), flexShrink: 0 }}
|
|
|
- src={moment.media[0].url}
|
|
|
- mode="aspectFill" />
|
|
|
- }
|
|
|
- {
|
|
|
- momentItem(moment)
|
|
|
- }
|
|
|
- </View>
|
|
|
- })
|
|
|
- })
|
|
|
- } */}
|
|
|
-
|
|
|
- {/* <View style={{ display: 'flex', flexDirection: 'column', marginBottom: rpxToPx(12), flex: 1, paddingTop: rpxToPx(4) }}>
|
|
|
- {
|
|
|
- props.data.events.map((item, index) => {
|
|
|
- return <TimeTitleDesc
|
|
|
- timeObj={item.time}
|
|
|
- time={item.time && dayjs(item.time.timestamp).format('HH:mm')}
|
|
|
- dayTag={dayTag(index)}
|
|
|
- title={getTitle(item)}
|
|
|
- desc={item.moments && item.moments.length > 0 ? item.moments[0].description : ''}
|
|
|
- />
|
|
|
- })
|
|
|
- }
|
|
|
- </View> */}
|
|
|
- {/* {
|
|
|
- mediaCount() > 0 && <CoverList count={mediaCount()} imgs={imgList()} />
|
|
|
- } */}
|
|
|
-
|
|
|
- {
|
|
|
- props.type != 'FAST,SLEEP' && props.mode != 'EAT' && props.mode != 'ACTIVE' && props.data.windows.map((item, index) => {
|
|
|
- return <TargetProgress key={index} showLine={index < props.data.windows.length - 1}
|
|
|
- color={getThemeColor(item.window)}
|
|
|
- showRing={props.fast_type != 'LF'}
|
|
|
- desc={item.description}
|
|
|
- icon={
|
|
|
- props.fast_type == 'LF' ? <IconLongFast color={MainColorType.fast} width={rpxToPx(32)} /> : null
|
|
|
- }
|
|
|
- canvasId={`${item.window}${item.window_range.start_timestamp}${index}`}
|
|
|
- startTimestamp={item.window_range.start_timestamp}
|
|
|
- endTimerstamp={item.window_range.end_timestamp}
|
|
|
- />
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- {
|
|
|
- props.type == 'FAST,SLEEP' && <TargetProgress
|
|
|
- showRing={true}
|
|
|
- doubleRing={true}
|
|
|
- first={props.data.windows[0]}
|
|
|
- second={props.data.windows[1]}
|
|
|
- canvasId={`double_${props.data.windows[0].window_range.start_timestamp}`}
|
|
|
- />
|
|
|
- }
|
|
|
- {/* <TargetProgress showLine={props.mode == 'FAST,SLEEP' && props.data.events.length > 2}
|
|
|
- color={props.mode == 'FAST,SLEEP' ? getThemeColor('FAST') : getThemeColor(health.mode)}
|
|
|
- showRing={props.fast_type != 'LF'}
|
|
|
- desc={props.data.window_range.end_timestamp ? formatMilliseconds(props.data.window_range.end_timestamp - props.data.window_range.start_timestamp) : ''}
|
|
|
- icon={
|
|
|
- props.fast_type == 'LF' ? <IconLongFast color={MainColorType.fast} width={rpxToPx(32)} /> : null
|
|
|
- }
|
|
|
- canvasId={(props.mode == 'FAST,SLEEP' ? 'history_fast_sleep' + props.index : 'history_' + props.index) + props.type}
|
|
|
- startTimestamp={props.data.window_range.start_timestamp}
|
|
|
- endTimerstamp={props.data.window_range.end_timestamp}
|
|
|
- />
|
|
|
- {
|
|
|
- props.mode == 'FAST,SLEEP' && props.data.events.length > 2 && <View className="history_duration_bg" style={{ marginTop: 0 }}>
|
|
|
- {
|
|
|
- props.fast_type != 'LF' && <View className="recent_ring_bg">
|
|
|
- {
|
|
|
- ring2()
|
|
|
- }
|
|
|
- </View>
|
|
|
- }
|
|
|
- {
|
|
|
- props.data.window_range.end_timestamp && <Text className="history_item_duration h26">{formatMilliseconds(props.data.events[2].time.timestamp - props.data.events[1].time.timestamp)}</Text>
|
|
|
- }
|
|
|
- </View>
|
|
|
- } */}
|
|
|
- {/* {
|
|
|
- props.isArchived && <View className="history_archived_row">
|
|
|
- <View className="history_archived" onClick={(e) => {
|
|
|
- if (process.env.TARO_ENV == 'weapp') {
|
|
|
- e.stopPropagation()
|
|
|
- }
|
|
|
- showActionSheet({
|
|
|
- showActionSheetWithOptions: showActionSheetWithOptions,
|
|
|
- title: 'Oprate Title',
|
|
|
- itemList: ['标记完成', '补记'],
|
|
|
- success: (res) => {
|
|
|
- // tapActionSheet(res)
|
|
|
- switch (res) {
|
|
|
- case 1:
|
|
|
- break;
|
|
|
- case 0:
|
|
|
- makeDone(props.data.window_id).then(res => {
|
|
|
- global.refreshWindow()
|
|
|
- global.refreshHistory()
|
|
|
- if (props.refresh)
|
|
|
- props.refresh()
|
|
|
- })
|
|
|
- break;
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- }}>
|
|
|
- <IconMore width={17} color="#b2b2b2" />
|
|
|
- </View>
|
|
|
- </View>
|
|
|
- } */}
|
|
|
- <View style={{ height: rpxToPx(0), flexShrink: 0 }} />
|
|
|
- {/* <View style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', height: rpxToPx(60), marginTop: rpxToPx(20) }}>
|
|
|
- <View style={{ flex: 1 }} />
|
|
|
- <NewButton type={NewButtonType.more}
|
|
|
- onClick={tapDel}
|
|
|
- />
|
|
|
- </View> */}
|
|
|
- </View>
|
|
|
- {/*
|
|
|
- {
|
|
|
- !props.hideLine && <View className="border_footer_line" />
|
|
|
- } */}
|
|
|
-
|
|
|
- </View>
|
|
|
- }
|
|
|
-
|
|
|
function singleItem(type, url, obj, key) {
|
|
|
return <View
|
|
|
onClick={(e) => {
|
|
|
@@ -573,28 +140,6 @@ export default function HistoryItem(props: {
|
|
|
if (props.data.texts.length == 0 && props.data.pics.length == 0) {
|
|
|
return <View />
|
|
|
}
|
|
|
- // if (props.data.pics.length == 0) {
|
|
|
- // return <View style={{ display: 'flex', flexDirection: 'row', marginBottom: rpxToPx(12), flex: 1 }}><View style={{
|
|
|
- // display: 'flex',
|
|
|
- // flex: 1,
|
|
|
- // flexShrink: 0,
|
|
|
- // flexDirection: 'column',
|
|
|
- // backgroundColor: '#fafafa',
|
|
|
- // paddingLeft: rpxToPx(20),
|
|
|
- // paddingRight: rpxToPx(20),
|
|
|
- // paddingTop: rpxToPx(12),
|
|
|
- // paddingBottom: rpxToPx(12)
|
|
|
- // }}>{props.data.text.map((detail, j) => {
|
|
|
- // return <TimeTitleDesc
|
|
|
- // key={j * 100}
|
|
|
- // className={'line2'}
|
|
|
- // time=''
|
|
|
- // title={detail.title}
|
|
|
- // desc={detail.description}
|
|
|
- // />
|
|
|
- // })}</View>
|
|
|
- // </View>
|
|
|
- // }
|
|
|
|
|
|
return <View style={{ display: 'flex', flexDirection: 'row',
|
|
|
// backgroundColor:'pink',
|
|
|
@@ -642,10 +187,6 @@ export default function HistoryItem(props: {
|
|
|
}
|
|
|
|
|
|
return <View className="history_item2" onClick={goDetail}>
|
|
|
- {/* <View className="cell_date" >
|
|
|
- <View className="h42 w500" style={{ lineHeight: rpxToPx(60) + 'px' }}>{historyDate()}</View>
|
|
|
- <View className="h24 w500" style={{ marginLeft: rpxToPx(6), marginTop: rpxToPx(13), lineHeight: rpxToPx(47) + 'px' }}>{historyMonth()}</View>
|
|
|
- </View> */}
|
|
|
<TimelineDate timestamp={props.data.window_range.start_timestamp}
|
|
|
pre_timestamp={props.preData?props.preData.window_range.start_timestamp:null}
|
|
|
/>
|
|
|
@@ -770,6 +311,10 @@ export default function HistoryItem(props: {
|
|
|
canvasId={`double_${props.data.windows[0].window_range.start_timestamp}`}
|
|
|
/>
|
|
|
}
|
|
|
+ {/* fast_sleep双环无法展示时,显示一个placeholder 骨架图 */}
|
|
|
+ {
|
|
|
+ props.type == 'FAST,SLEEP' && props.data.windows.length<2 && <View className='history_duration_bg' />
|
|
|
+ }
|
|
|
<View style={{ height: rpxToPx(0), flexShrink: 0 }} />
|
|
|
</View>
|
|
|
|