使用第三方时间格式化工具

This commit is contained in:
WindowBird 2025-09-19 10:17:06 +08:00
parent 6f5521dfff
commit 3f62ac47b4
2 changed files with 614 additions and 598 deletions

View File

@ -16,10 +16,16 @@
class="table-row" class="table-row"
@click="handleItemClick(item)" @click="handleItemClick(item)"
> >
<view class="table-cell worshiper-col">{{ item.worshiperName || '未知' }}</view> <view class="table-cell worshiper-col">{{
<view class="table-cell time-col">{{ formatDate(item.startDate) }}</view> item.worshiperName || "未知"
}}</view>
<view class="table-cell time-col">{{
formatDate(item.startDate)
}}</view>
<view class="table-cell time-col">{{ formatDate(item.endDate) }}</view> <view class="table-cell time-col">{{ formatDate(item.endDate) }}</view>
<view class="table-cell type-col">{{ item.thaliName || '未知类型' }}</view> <view class="table-cell type-col">{{
item.thaliName || "未知类型"
}}</view>
</view> </view>
</view> </view>
@ -42,10 +48,10 @@
</template> </template>
<script> <script>
import { getEnshrinedList } from '@/api/memorial/memorial.js' import { getEnshrinedList } from "@/api/memorial/memorial.js";
export default { export default {
name: 'EnshrinedList', name: "EnshrinedList",
props: { props: {
memorialId: { memorialId: {
type: [String, Number], type: [String, Number],
@ -53,7 +59,7 @@
}, },
searchKeyword: { searchKeyword: {
type: String, type: String,
default: '', default: "",
}, },
}, },
data() { data() {
@ -64,7 +70,7 @@
pageSize: 10, pageSize: 10,
total: 0, total: 0,
hasMore: true, hasMore: true,
} };
}, },
watch: { watch: {
// searchKeyword // searchKeyword
@ -77,139 +83,141 @@
// } // }
}, },
mounted() { mounted() {
this.loadData() this.loadData();
}, },
methods: { methods: {
// //
async loadData() { async loadData() {
if (this.loading) return if (this.loading) return;
this.loading = true this.loading = true;
try { try {
const params = { const params = {
memorialId: this.memorialId, memorialId: this.memorialId,
pageNum: this.pageNum, pageNum: this.pageNum,
pageSize: this.pageSize, pageSize: this.pageSize,
} };
// //
// if (this.searchKeyword) { // if (this.searchKeyword) {
// params.keyword = this.searchKeyword // params.keyword = this.searchKeyword
// } // }
const response = await getEnshrinedList(params) const response = await getEnshrinedList(params);
console.log('API 响应数据:', response) // console.log("API 响应数据:", response); //
// API: { code: 200, msg: "", data: [...] } // API: { code: 200, msg: "", data: [...] }
let total = 0 let total = 0;
let rows = [] let rows = [];
if (response && response.code === 200) { if (response && response.code === 200) {
// API // API
rows = response.rows || [] rows = response.rows || [];
total = rows.length // 使 total = rows.length; // 使
console.log('API 返回数据:', rows) console.log("API 返回数据:", rows);
} else { } else {
console.log('API 响应异常:', response) console.log("API 响应异常:", response);
// API使 // API使
rows = this.getMockData() rows = this.getMockData();
total = rows.length total = rows.length;
} }
this.total = total this.total = total;
if (this.pageNum === 1) { if (this.pageNum === 1) {
this.enshrinedList = rows || [] this.enshrinedList = rows || [];
} else { } else {
this.enshrinedList = [...this.enshrinedList, ...(rows || [])] this.enshrinedList = [...this.enshrinedList, ...(rows || [])];
} }
this.hasMore = this.enshrinedList.length < total this.hasMore = this.enshrinedList.length < total;
} catch (error) { } catch (error) {
console.error('加载供奉列表失败:', error) console.error("加载供奉列表失败:", error);
// 使 // 使
console.log('API 调用失败,使用模拟数据') console.log("API 调用失败,使用模拟数据");
const mockData = this.getMockData() const mockData = this.getMockData();
if (this.pageNum === 1) { if (this.pageNum === 1) {
this.enshrinedList = mockData this.enshrinedList = mockData;
} else { } else {
this.enshrinedList = [...this.enshrinedList, ...mockData] this.enshrinedList = [...this.enshrinedList, ...mockData];
} }
this.total = mockData.length this.total = mockData.length;
this.hasMore = false this.hasMore = false;
uni.showToast({ uni.showToast({
title: '网络异常,请稍后重试', title: "网络异常,请稍后重试",
icon: 'none', icon: "none",
}) });
} finally { } finally {
this.loading = false this.loading = false;
} }
}, },
// //
getMockData() { getMockData() {
return [] return [];
}, },
// //
resetList() { resetList() {
this.enshrinedList = [] this.enshrinedList = [];
this.pageNum = 1 this.pageNum = 1;
this.total = 0 this.total = 0;
this.hasMore = true this.hasMore = true;
}, },
// //
loadMore() { loadMore() {
if (this.hasMore && !this.loading) { if (this.hasMore && !this.loading) {
this.pageNum++ this.pageNum++;
this.loadData() this.loadData();
} }
}, },
// //
formatDate(dateStr) { formatDate(dateStr) {
if (!dateStr) return '未知' return this.$u.date(dateStr, "yyyy-mm-dd");
try { // if (!dateStr) return ''
// YYYY-MM-DD //
if (/^\d{4}-\d{2}-\d{2}$/.test(dateStr)) { // try {
return dateStr // // YYYY-MM-DD
} // if (/^\d{4}-\d{2}-\d{2}$/.test(dateStr)) {
// return dateStr
const date = new Date(dateStr) // }
if (isNaN(date.getTime())) { //
return dateStr // const date = new Date(dateStr)
} // if (isNaN(date.getTime())) {
// return dateStr
const year = date.getFullYear() // }
const month = String(date.getMonth() + 1).padStart(2, '0') //
const day = String(date.getDate()).padStart(2, '0') // const year = date.getFullYear()
// const month = String(date.getMonth() + 1).padStart(2, '0')
return `${year}-${month}-${day}` // const day = String(date.getDate()).padStart(2, '0')
} catch (error) { //
console.warn('日期格式化失败:', dateStr, error) // return `${year}-${month}-${day}`
return dateStr // } catch (error) {
} // console.warn(':', dateStr, error)
// return dateStr
// }
}, },
// //
handleItemClick(item) { handleItemClick(item) {
this.$emit('item-click', item) this.$emit("item-click", item);
}, },
// //
refresh() { refresh() {
this.resetList() this.resetList();
this.loadData() this.loadData();
}, },
}, },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.enshrined-list { .enshrined-list {
padding: 46rpx 0 30rpx 44rpx; padding: 46rpx 0 30rpx 44rpx;
width: 680rpx; width: 680rpx;
height: 858rpx; height: 858rpx;
@ -217,16 +225,16 @@
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
border: 1rpx solid #c7a26d; border: 1rpx solid #c7a26d;
margin-bottom: 12rpx; margin-bottom: 12rpx;
} }
.table-header { .table-header {
display: flex; display: flex;
border-radius: 12rpx 12rpx 0 0; border-radius: 12rpx 12rpx 0 0;
overflow: hidden; overflow: hidden;
justify-content: space-between; justify-content: space-between;
} }
.header-cell { .header-cell {
position: relative; position: relative;
font-weight: 400; font-weight: 400;
font-size: 28rpx; font-size: 28rpx;
@ -249,14 +257,14 @@
&.type-col { &.type-col {
flex: 2; flex: 2;
} }
} }
.table-body { .table-body {
border-radius: 0 0 12rpx 12rpx; border-radius: 0 0 12rpx 12rpx;
overflow: hidden; overflow: hidden;
} }
.table-row { .table-row {
display: flex; display: flex;
transition: background-color 0.2s ease; transition: background-color 0.2s ease;
margin-top: 30rpx; margin-top: 30rpx;
@ -279,9 +287,9 @@
// background-color: #f5f5f5; // background-color: #f5f5f5;
// } // }
//} //}
} }
.table-cell { .table-cell {
//padding: 20rpx 16rpx; //padding: 20rpx 16rpx;
word-break: break-all; word-break: break-all;
display: flex; display: flex;
@ -312,9 +320,9 @@
flex: 1; flex: 1;
color: #666666; color: #666666;
} }
} }
.empty-state { .empty-state {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
@ -323,20 +331,20 @@
background: #ffffff; background: #ffffff;
border-radius: 12rpx; border-radius: 12rpx;
margin-top: 20rpx; margin-top: 20rpx;
} }
.empty-icon { .empty-icon {
font-size: 80rpx; font-size: 80rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
opacity: 0.5; opacity: 0.5;
} }
.empty-text { .empty-text {
font-size: 28rpx; font-size: 28rpx;
color: #999999; color: #999999;
} }
.load-more { .load-more {
text-align: center; text-align: center;
padding: 30rpx 0; padding: 30rpx 0;
margin-top: 20rpx; margin-top: 20rpx;
@ -348,9 +356,9 @@
background: #ffffff; background: #ffffff;
border-radius: 24rpx; border-radius: 24rpx;
} }
} }
.loading-state { .loading-state {
text-align: center; text-align: center;
padding: 30rpx 0; padding: 30rpx 0;
background: #ffffff; background: #ffffff;
@ -361,5 +369,5 @@
font-size: 28rpx; font-size: 28rpx;
color: #999999; color: #999999;
} }
} }
</style> </style>

View File

@ -16,10 +16,16 @@
class="table-row" class="table-row"
@click="handleItemClick(item)" @click="handleItemClick(item)"
> >
<view class="table-cell worshiper-col">{{ item.worshiperName || '未知' }}</view> <view class="table-cell worshiper-col">{{
<view class="table-cell time-col">{{ formatDate(item.startDate) }}</view> item.worshiperName || "未知"
}}</view>
<view class="table-cell time-col">{{
formatDate(item.startDate)
}}</view>
<view class="table-cell time-col">{{ formatDate(item.endDate) }}</view> <view class="table-cell time-col">{{ formatDate(item.endDate) }}</view>
<view class="table-cell type-col">{{ item.thaliName || '未知类型' }}</view> <view class="table-cell type-col">{{
item.thaliName || "未知类型"
}}</view>
</view> </view>
</view> </view>
@ -42,10 +48,10 @@
</template> </template>
<script> <script>
import { getEnshrinedList } from '@/api/memorial/index.js' import { getEnshrinedList } from "@/api/memorial/index.js";
export default { export default {
name: 'EnshrinedList', name: "EnshrinedList",
props: { props: {
memorialId: { memorialId: {
type: [String, Number], type: [String, Number],
@ -53,7 +59,7 @@
}, },
searchKeyword: { searchKeyword: {
type: String, type: String,
default: '', default: "",
}, },
}, },
data() { data() {
@ -64,7 +70,7 @@
pageSize: 10, pageSize: 10,
total: 0, total: 0,
hasMore: true, hasMore: true,
} };
}, },
watch: { watch: {
// searchKeyword // searchKeyword
@ -77,139 +83,141 @@
// } // }
}, },
mounted() { mounted() {
this.loadData() this.loadData();
}, },
methods: { methods: {
// //
async loadData() { async loadData() {
if (this.loading) return if (this.loading) return;
this.loading = true this.loading = true;
try { try {
const params = { const params = {
memorialId: this.memorialId, memorialId: this.memorialId,
pageNum: this.pageNum, pageNum: this.pageNum,
pageSize: this.pageSize, pageSize: this.pageSize,
} };
// //
// if (this.searchKeyword) { // if (this.searchKeyword) {
// params.keyword = this.searchKeyword // params.keyword = this.searchKeyword
// } // }
const response = await getEnshrinedList(params) const response = await getEnshrinedList(params);
console.log('API 响应数据:', response) // console.log("API 响应数据:", response); //
// API: { code: 200, msg: "", data: [...] } // API: { code: 200, msg: "", data: [...] }
let total = 0 let total = 0;
let rows = [] let rows = [];
if (response && response.code === 200) { if (response && response.code === 200) {
// API // API
rows = response.data || [] rows = response.data || [];
total = rows.length // 使 total = rows.length; // 使
console.log('API 返回数据:', rows) console.log("API 返回数据:", rows);
} else { } else {
console.log('API 响应异常:', response) console.log("API 响应异常:", response);
// API使 // API使
rows = this.getMockData() rows = this.getMockData();
total = rows.length total = rows.length;
} }
this.total = total this.total = total;
if (this.pageNum === 1) { if (this.pageNum === 1) {
this.enshrinedList = rows || [] this.enshrinedList = rows || [];
} else { } else {
this.enshrinedList = [...this.enshrinedList, ...(rows || [])] this.enshrinedList = [...this.enshrinedList, ...(rows || [])];
} }
this.hasMore = this.enshrinedList.length < total this.hasMore = this.enshrinedList.length < total;
} catch (error) { } catch (error) {
console.error('加载供奉列表失败:', error) console.error("加载供奉列表失败:", error);
// 使 // 使
console.log('API 调用失败,使用模拟数据') console.log("API 调用失败,使用模拟数据");
const mockData = this.getMockData() const mockData = this.getMockData();
if (this.pageNum === 1) { if (this.pageNum === 1) {
this.enshrinedList = mockData this.enshrinedList = mockData;
} else { } else {
this.enshrinedList = [...this.enshrinedList, ...mockData] this.enshrinedList = [...this.enshrinedList, ...mockData];
} }
this.total = mockData.length this.total = mockData.length;
this.hasMore = false this.hasMore = false;
uni.showToast({ uni.showToast({
title: '网络异常,请稍后重试', title: "网络异常,请稍后重试",
icon: 'none', icon: "none",
}) });
} finally { } finally {
this.loading = false this.loading = false;
} }
}, },
// //
getMockData() { getMockData() {
return [] return [];
}, },
// //
resetList() { resetList() {
this.enshrinedList = [] this.enshrinedList = [];
this.pageNum = 1 this.pageNum = 1;
this.total = 0 this.total = 0;
this.hasMore = true this.hasMore = true;
}, },
// //
loadMore() { loadMore() {
if (this.hasMore && !this.loading) { if (this.hasMore && !this.loading) {
this.pageNum++ this.pageNum++;
this.loadData() this.loadData();
} }
}, },
// //
formatDate(dateStr) { formatDate(dateStr) {
if (!dateStr) return '未知' return this.$u.date(dateStr, "yyyy-mm-dd");
try { // if (!dateStr) return ''
// YYYY-MM-DD
if (/^\d{4}-\d{2}-\d{2}$/.test(dateStr)) {
return dateStr
}
const date = new Date(dateStr) // try {
if (isNaN(date.getTime())) { // // YYYY-MM-DD
return dateStr // if (/^\d{4}-\d{2}-\d{2}$/.test(dateStr)) {
} // return dateStr
// }
const year = date.getFullYear() //
const month = String(date.getMonth() + 1).padStart(2, '0') // const date = new Date(dateStr)
const day = String(date.getDate()).padStart(2, '0') // if (isNaN(date.getTime())) {
// return dateStr
return `${year}-${month}-${day}` // }
} catch (error) { //
console.warn('日期格式化失败:', dateStr, error) // const year = date.getFullYear()
return dateStr // const month = String(date.getMonth() + 1).padStart(2, '0')
} // const day = String(date.getDate()).padStart(2, '0')
//
// return `${year}-${month}-${day}`
// } catch (error) {
// console.warn(':', dateStr, error)
// return dateStr
// }
}, },
// //
handleItemClick(item) { handleItemClick(item) {
this.$emit('item-click', item) this.$emit("item-click", item);
}, },
// //
refresh() { refresh() {
this.resetList() this.resetList();
this.loadData() this.loadData();
}, },
}, },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.enshrined-list { .enshrined-list {
padding: 46rpx 0 30rpx 44rpx; padding: 46rpx 0 30rpx 44rpx;
width: 680rpx; width: 680rpx;
height: 858rpx; height: 858rpx;
@ -217,16 +225,16 @@
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
border: 1rpx solid #c7a26d; border: 1rpx solid #c7a26d;
margin-bottom: 12rpx; margin-bottom: 12rpx;
} }
.table-header { .table-header {
display: flex; display: flex;
border-radius: 12rpx 12rpx 0 0; border-radius: 12rpx 12rpx 0 0;
overflow: hidden; overflow: hidden;
justify-content: space-between; justify-content: space-between;
} }
.header-cell { .header-cell {
position: relative; position: relative;
font-weight: 400; font-weight: 400;
font-size: 28rpx; font-size: 28rpx;
@ -249,14 +257,14 @@
&.type-col { &.type-col {
flex: 2; flex: 2;
} }
} }
.table-body { .table-body {
border-radius: 0 0 12rpx 12rpx; border-radius: 0 0 12rpx 12rpx;
overflow: hidden; overflow: hidden;
} }
.table-row { .table-row {
display: flex; display: flex;
transition: background-color 0.2s ease; transition: background-color 0.2s ease;
margin-top: 30rpx; margin-top: 30rpx;
@ -279,9 +287,9 @@
// background-color: #f5f5f5; // background-color: #f5f5f5;
// } // }
//} //}
} }
.table-cell { .table-cell {
//padding: 20rpx 16rpx; //padding: 20rpx 16rpx;
word-break: break-all; word-break: break-all;
display: flex; display: flex;
@ -312,9 +320,9 @@
flex: 1; flex: 1;
color: #666666; color: #666666;
} }
} }
.empty-state { .empty-state {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
@ -323,20 +331,20 @@
background: #ffffff; background: #ffffff;
border-radius: 12rpx; border-radius: 12rpx;
margin-top: 20rpx; margin-top: 20rpx;
} }
.empty-icon { .empty-icon {
font-size: 80rpx; font-size: 80rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
opacity: 0.5; opacity: 0.5;
} }
.empty-text { .empty-text {
font-size: 28rpx; font-size: 28rpx;
color: #999999; color: #999999;
} }
.load-more { .load-more {
text-align: center; text-align: center;
padding: 30rpx 0; padding: 30rpx 0;
margin-top: 20rpx; margin-top: 20rpx;
@ -348,9 +356,9 @@
background: #ffffff; background: #ffffff;
border-radius: 24rpx; border-radius: 24rpx;
} }
} }
.loading-state { .loading-state {
text-align: center; text-align: center;
padding: 30rpx 0; padding: 30rpx 0;
background: #ffffff; background: #ffffff;
@ -361,5 +369,5 @@
font-size: 28rpx; font-size: 28rpx;
color: #999999; color: #999999;
} }
} }
</style> </style>