zy-asrs.git - Gitblit

			@@ -1,9 +1,8 @@
			<!DOCTYPE html>
			<html lang="en">

			<head>
			<meta charset="UTF-8">
			<title>硫化罐设备</title>
			<title>主表与子表详情页面</title>
			<link rel="stylesheet" href="../../static/css/element.css">
			<link rel="stylesheet" href="../../static/css/element-ui.css">
			<link rel="icon" href="../../static/images/favicon.ico" type="image/x-icon">
			@@ -11,107 +10,857 @@
			<script type="text/javascript" src="../../static/js/common.js"></script>
			<script type="text/javascript" src="../../static/js/vue.min.js"></script>
			<script type="text/javascript" src="../../static/js/element.js"></script>
			<style>
			.container {
			padding: 20px;
			width: 100%;
			max-width: 1200px;
			margin: 0 auto;
			}
			.table-container {
			margin-bottom: 20px;
			box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
			border-radius: 4px;
			overflow: hidden;
			}
			.detail-dialog .el-dialog__body {
			padding: 20px;
			}
			.pagination-container {
			margin-top: 15px;
			text-align: right;
			}
			.operation-cell {
			display: flex;
			justify-content: center;
			gap: 8px;
			}
			/* 搜索栏样式 */
			.search-container {
			background: #f5f7fa;
			padding: 15px;
			margin-bottom: 20px;
			border-radius: 4px;
			box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
			}
			.search-form {
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			gap: 15px;
			}
			.search-item {
			display: flex;
			align-items: center;
			margin-right: 15px;
			}
			.search-label {
			min-width: 80px;
			text-align: right;
			margin-right: 10px;
			font-size: 14px;
			color: #606266;
			}
			.search-actions {
			display: flex;
			gap: 10px;
			margin-left: auto;
			}
			/* 确认上报按钮样式 */
			.confirm-report-btn {
			border: 2px solid #F56C6C;
			color: #F56C6C;
			font-weight: bold;
			background-color: transparent;
			padding: 10px 20px;
			}
			.confirm-report-btn:hover {
			background-color: #F56C6C;
			color: white;
			}
			.dialog-footer {
			display: flex;
			justify-content: flex-end;
			align-items: center;
			gap: 10px;
			margin-top: 20px;
			}
			/* 二次确认对话框样式 */
			.confirm-dialog .el-message-box__message {
			text-align: center;
			font-size: 16px;
			line-height: 1.5;
			}
			.confirm-dialog .el-message-box__status {
			font-size: 24px !important;
			}
			</style>
			</head>
			<style scoped>

			</style>

			<body>
			<div id="app" style="display: flex;justify-content: center;flex-wrap: wrap;">
			<div style="width: 100%;">
			<el-table border ref="singleTable" :data="tableData" highlight-current-row
			max-height="350" style="width: 100%">
			<el-table-column property="category" label="类别">
			</el-table-column>
			<el-table-column property="equipmentNo" label="设备号">
			</el-table-column>
			<el-table-column property="categoryOther" label="相关设备类别">
			</el-table-column>
			<el-table-column property="equipmentNoOther" label="相关设备号">
			</el-table-column>
			<el-table-column property="errorM" label="异常描述">
			</el-table-column>
			</el-table>
			</div>
			<div style="width: 100%;">
			<el-table border ref="singleTable" :data="adjacentLocMast" highlight-current-row
			max-height="350" style="width: 100%">
			<el-table-column property="category" label="当前库位">
			</el-table-column>
			<el-table-column property="equipmentNo" label="当前库位状态">
			</el-table-column>
			<el-table-column property="categoryOther" label="相邻库位">
			</el-table-column>
			<el-table-column property="equipmentNoOther" label="相邻库位状态">
			</el-table-column>
			<el-table-column property="errorM" label="异常描述">
			</el-table-column>
			</el-table>
			</div>

			<div id="app" style="display: flex;justify-content: center;flex-wrap: wrap;">
			<!-- 搜索栏 -->
			<div class="search-container" style="width: 100%;">
			<el-form :inline="true" class="search-form">
			<div class="search-item">
			<span class="search-label">组货单号:</span>
			<el-input
			v-model="searchForm.itemName"
			placeholder="请输入组货单号"
			clearable
			style="width: 150px;"
			@keyup.enter.native="handleSearch"
			></el-input>
			</div>
			<div class="search-item">
			<span class="search-label">客户名称:</span>
			<el-input
			v-model="searchForm.cstmrName"
			placeholder="请输入客户名称"
			clearable
			style="width: 180px;"
			@keyup.enter.native="handleSearch"
			></el-input>
			</div>
			<div class="search-item">
			<span class="search-label">状态:</span>
			<el-select
			v-model="searchForm.settle"
			placeholder="请选择状态"
			clearable
			style="width: 150px;"
			>
			<el-option label="全部" value=""></el-option>
			<el-option label="待处理" value="10"></el-option>
			<el-option label="检验中" value="11"></el-option>
			<el-option label="出库中" value="12"></el-option>
			<el-option label="存在不合格" value="13"></el-option>
			<el-option label="待上报" value="15"></el-option>
			<el-option label="上报完成" value="16"></el-option>
			<el-option label="上报失败" value="17"></el-option>
			<el-option label="异常" value="98"></el-option>
			<el-option label="废弃" value="99"></el-option>
			</el-select>
			</div>
			<div class="search-actions">
			<el-button type="primary" icon="el-icon-search" @click="handleSearch">搜索</el-button>
			<el-button icon="el-icon-refresh" @click="handleReset">重置</el-button>
			</div>
			</el-form>
			</div>
			<script>
			var app = new Vue({
			el: '#app',
			data: {
			tableData: [],
			adjacentLocMast: []
			},
			created() {
			this.init()
			},
			watch: {
			},
			methods: {
			init() {
			this.getTableData()
			this.getAdjacentLocMast()

			setInterval(() => {
			this.getTableData()
			this.getAdjacentLocMast()
			// this.demoStatus()
			}, 1000)
			},
			confirmEvent() {
			},
			cancelEvent() {
			},
			getTableData() {
			let that = this;
			$.ajax({
			url: baseUrl + "/error/device/task/depthAndShallowness",
			headers: {
			'token': localStorage.getItem('token')
			},
			data: {},
			dataType: 'json',
			contentType: 'application/json;charset=UTF-8',
			method: 'post',
			success: function (res) {
			that.tableData = res.data
			<!-- 主表A -->
			<div class="table-container" style="width: 100%;">
			<el-table
			border
			ref="mainTable"
			:data="tableDataA"
			highlight-current-row
			style="width: 100%"
			v-loading="loading"
			@sort-change="handleSortChange">
			<el-table-column prop="itemName" label="组货单号" width="240" align="center" sortable="custom"></el-table-column>
			<el-table-column prop="cstmrName" label="客户名称" min-width="120" align="center"></el-table-column>
			<el-table-column prop="orderCount" label="组货单数" width="80" align="center"></el-table-column>
			<el-table-column prop="settle" label="状态" min-width="100" align="center" :formatter="formatStatus"></el-table-column>
			<el-table-column prop="createTime" label="日期" min-width="100" align="center" :formatter="formatDateColumn"></el-table-column>
			<el-table-column prop="updateTime" label="更新日期" min-width="100" align="center" :formatter="formatDateColumn"></el-table-column>
			<el-table-column label="操作" width="150" align="center" fixed="right">
			<template slot-scope="scope">
			<div class="operation-cell">
			<el-button
			type="primary"
			size="mini"
			@click="showDetail(scope.row)">
			明细查看
			</el-button>
			</div>
			</template>
			</el-table-column>
			</el-table>

			<!-- 分页控件 -->
			<div class="pagination-container">
			<el-pagination
			@size-change="handleSizeChange"
			@current-change="handleCurrentChange"
			:current-page="currentPage"
			:page-sizes="[10, 20, 50, 100]"
			:page-size="pageSize"
			layout="total, sizes, prev, pager, next, jumper"
			:total="total">
			</el-pagination>
			</div>
			</div>

			<!-- 子表B详情弹窗 -->
			<el-dialog
			title="明细"
			:visible.sync="detailDialogVisible"
			width="80%"
			class="detail-dialog"
			@close="closeDetailDialog">
			<div v-if="currentRow">
			<h3>组货单主表 (组货单号: {{ currentRow.itemName }})</h3>
			<el-descriptions :column="2" border>
			<el-descriptions-item label="客户名称">{{ currentRow.cstmrName }}</el-descriptions-item>
			<el-descriptions-item label="状态">{{ formatStatus(currentRow)}}</el-descriptions-item>
			<el-descriptions-item label="创建时间">{{ formatDate(currentRow.createTime) }}</el-descriptions-item>
			<el-descriptions-item label="备注">{{ currentRow.memo \|\| '无' }}</el-descriptions-item>
			</el-descriptions>

			<h3 style="margin-top: 20px;">组货单明细</h3>
			<el-table
			border
			:data="tableDataB"
			style="width: 100%"
			v-loading="detailLoading">
			<el-table-column prop="matnr" label="规格" min-width="120" align="center"></el-table-column>
			<el-table-column prop="batch" label="箱号" min-width="80" align="center"></el-table-column>
			<el-table-column prop="model" label="卷号" min-width="100" align="center" ></el-table-column>
			<el-table-column prop="origin" label="位置" min-width="100" align="center"></el-table-column>
			<el-table-column prop="danger" label="待判" min-width="100" align="center"></el-table-column>
			<el-table-column prop="memo" label="备注" min-width="100" align="center"></el-table-column>
			<el-table-column prop="status" label="状态" min-width="100" align="center" :formatter="formatStatusB"></el-table-column>
			<!-- 新增操作列，根据status值控制显示 -->
			<el-table-column label="是否上报" width="120" align="center" fixed="right">
			<template slot-scope="scope">
			<div class="operation-cell">
			<el-button v-if="scope.row.status === 2"
			type="primary"
			size="mini"
			@click="handleModifyN(scope.row)">
			否
			</el-button>
			<el-button v-if="scope.row.status === 1"
			type="primary"
			size="mini"
			@click="handleModifyY(scope.row)">
			是
			</el-button>
			</div>
			</template>
			</el-table-column>
			</el-table>

			<!-- 子表分页 -->
			<div class="pagination-container">
			<el-pagination
			@size-change="handleDetailSizeChange"
			@current-change="handleDetailCurrentChange"
			:current-page="detailCurrentPage"
			:page-sizes="[5, 10, 20]"
			:page-size="detailPageSize"
			layout="total, sizes, prev, pager, next, jumper"
			:total="detailTotal">
			</el-pagination>
			</div>
			</div>

			<div slot="footer" class="dialog-footer">
			<el-button
			class="confirm-report-btn"
			@click="showConfirmDialog"
			:loading="reportLoading">
			<!-- 直接在模板中判断 -->
			{{ settleA === 17 ? '再次上报' : '确认上报' }}
			</el-button>
			<el-button @click="closeDetailDialog">关闭</el-button>
			</div>
			</el-dialog>
			</div>

			<script>
			var app = new Vue({
			el: '#app',
			data: {
			// 搜索表单
			searchForm: {
			item_name: '',
			cstmr_name: '',
			settle: '',
			order_no: ''
			},
			// 排序相关
			orderByField: '',
			orderByType: 'asc',
			// 主表A数据
			tableDataA: [],
			// 子表B数据
			tableDataB: [],
			// 分页相关
			currentPage: 1,
			pageSize: 10,
			total: 0,
			// 详情弹窗控制
			detailDialogVisible: false,
			currentRow: null,
			// 子表分页
			detailCurrentPage: 1,
			settleA: 1,
			detailPageSize: 5,
			detailTotal: 0,
			// 加载状态
			loading: false,
			detailLoading: false,
			reportLoading: false
			},
			created() {
			this.init();
			},
			methods: {
			init() {
			this.getTableDataA();

			// 每5秒自动刷新数据
			setInterval(() => {
			this.getTableDataA();
			}, 10000);
			},

			// 获取主表A数据 - 使用新的API
			getTableDataA() {
			let that = this;
			that.loading = true;

			// 构建请求参数
			let params = {
			curr: that.currentPage,
			limit: that.pageSize
			};

			// 添加排序参数
			if (that.orderByField) {
			params.orderByField = that.orderByField;
			params.orderByType = that.orderByType;
			}

			// 添加搜索参数
			Object.keys(that.searchForm).forEach(key => {
			if (that.searchForm[key] !== '') {
			if (key === 'orderNo'){
			params['order_no'] = that.searchForm[key];
			} else if (key === 'itemName'){
			params['item_name'] = that.searchForm[key];
			} else if (key === 'cstmrName'){
			params['cstmr_name'] = that.searchForm[key];
			} else {
			params[key] = that.searchForm[key];
			}
			});
			},
			getAdjacentLocMast() {
			let that = this;
			$.ajax({
			url: baseUrl + "/error/device/locSts/adjacentLocMast",
			headers: {
			'token': localStorage.getItem('token')
			},
			data: {},
			dataType: 'json',
			contentType: 'application/json;charset=UTF-8',
			method: 'post',
			success: function (res) {
			that.adjacentLocMast = res.data
			}
			});

			$.ajax({
			url: baseUrl + "/order/pakout/order/cargo/grouping/auth/v1",
			headers: {
			'token': localStorage.getItem('token')
			},
			data: params,
			dataType: 'json',
			method: 'get',
			success: function (res) {
			if (res.code === 200 \|\| res.success) {
			that.tableDataA = res.data.records \|\| [];
			that.total = res.data.total \|\| 0;
			} else {
			that.$message.error(res.message \|\| '获取数据失败');
			that.tableDataA = [];
			that.total = 0;
			}
			that.loading = false;
			},
			error: function(xhr, status, error) {
			that.loading = false;
			that.$message.error('网络请求失败');
			console.error('API调用失败:', error);
			// 模拟数据（实际项目中应删除）
			that.mockTableAData();
			}
			});
			},

			// 获取子表B数据（根据实际业务调整）
			getTableDataB(itemName) {
			let that = this;
			that.detailLoading = true;

			// 构建请求参数
			let params = {
			item_name: itemName,
			curr: that.detailCurrentPage,
			limit: that.detailPageSize
			};

			// 模拟API调用 - 根据实际业务调整API地址
			$.ajax({
			url: baseUrl + "/order/pakout/orderDetl/cargo/grouping/auth",
			headers: {
			'token': localStorage.getItem('token')
			},
			data: params,
			dataType: 'json',
			contentType: 'application/json;charset=UTF-8',
			method: 'get',
			success: function (res) {
			if (res.code === 200 \|\| res.success) {
			that.tableDataB = res.data.records \|\| [];
			that.detailTotal = res.data.total \|\| 0;
			} else {
			that.$message.error(res.message \|\| '获取数据失败');
			that.tableDataB = [];
			that.detailTotal = 0;
			}
			that.detailLoading = false;
			},
			error: function() {
			that.detailLoading = false;
			// 实际项目中应使用真实API，这里使用模拟数据
			that.mockTableBData(itemName);
			}
			});
			},

			// 处理修改按钮点击事件
			handleModifyY(row) {
			if (!this.currentRow) {
			this.$message.error('没有选择主表数据');
			return;
			}

			const groupOrderNo = this.currentRow.itemName; // 组货单号
			const batch = row.batch; // 箱号
			const status = 2; // 箱号

			this.$confirm(
			`确定将组货单号： <strong style="color: #409EFF;">${groupOrderNo}</strong> 中的箱号： <strong style="color: #409EFF;">${batch}</strong> 添加到上报列吗？`,
			'确认修改',
			{
			confirmButtonText: '确认修改',
			cancelButtonText: '取消',
			type: 'warning',
			dangerouslyUseHTMLString: true
			}
			).then(() => {
			this.submitModify(groupOrderNo, batch, status);
			}).catch(() => {
			this.$message({
			type: 'info',
			message: '已取消修改'
			});
			});
			},

			// 处理修改按钮点击事件
			handleModifyN(row) {
			if (!this.currentRow) {
			this.$message.error('没有选择主表数据');
			return;
			}

			const groupOrderNo = this.currentRow.itemName; // 组货单号
			const batch = row.batch; // 箱号
			const status = 1; // 箱号

			this.$confirm(
			`确定将组货单号： <strong style="color: #409EFF;">${groupOrderNo}</strong> 、箱号： <strong style="color: #409EFF;">${batch}</strong> 添加到上报列吗？`,
			'确认修改',
			{
			confirmButtonText: '确认修改',
			cancelButtonText: '取消',
			type: 'warning',
			dangerouslyUseHTMLString: true
			}
			).then(() => {
			this.submitModify(groupOrderNo, batch, status);
			}).catch(() => {
			this.$message({
			type: 'info',
			message: '已取消修改'
			});
			});
			},

			// 提交修改到后台
			submitModify(groupOrderNo, batch, status) {
			// 显示加载状态
			const loadingInstance = this.$loading({
			lock: true,
			text: '提交修改中...',
			spinner: 'el-icon-loading',
			background: 'rgba(0, 0, 0, 0.7)'
			});

			$.ajax({
			url: baseUrl + "/order/pakout/orderDetl/batch/report/auth",
			headers: {'token': localStorage.getItem('token')},
			data: top.reObject({
			item_name: groupOrderNo, // 组货单号
			batch: batch, // 箱号
			status: status // 箱号
			}),
			method: 'POST',
			success: (res) => {
			loadingInstance.close();

			if (res.code === 200 \|\| res.success) {
			this.$message({
			message: `修改成功！组货单号: ${groupOrderNo}, 箱号: ${batch}`,
			type: 'success',
			duration: 3000
			});

			this.getTableDataB(groupOrderNo);
			} else {
			this.$message.error(res.message \|\| '修改失败');
			}
			},
			error: (error) => {
			loadingInstance.close();
			console.error('修改失败:', error);
			this.$message.error('修改失败，请检查网络连接');
			}
			});
			},

			// 表格排序变化
			handleSortChange(column) {
			if (column.prop) {
			this.orderByField = column.prop;
			this.orderByType = column.order === 'ascending' ? 'asc' : 'desc';
			} else {
			this.orderByField = '';
			this.orderByType = 'asc';
			}
			this.currentPage = 1;
			this.getTableDataA();
			},

			showConfirmDialog() {
			if (!this.currentRow) {
			this.$message.error('没有选择要上报的数据');
			return;
			}

			const groupOrderNo = this.currentRow.itemName;

			this.$confirm(
			`是否确认开始上报组货单号 <strong style="color: #F56C6C; font-size: 16px;">${groupOrderNo}</strong>?<br/><br/>将生成实际组货单，单一组货单号只能操作一次!!!`,
			'确认上报',
			{
			confirmButtonText: '确认上报',
			cancelButtonText: '取消',
			type: 'warning',
			dangerouslyUseHTMLString: true,
			customClass: 'confirm-dialog',
			confirmButtonClass: 'confirm-report-btn',
			beforeClose: (action, instance, done) => {
			if (action === 'confirm') {
			instance.confirmButtonLoading = true;
			this.confirmReport(groupOrderNo, done);
			} else {
			done();
			}
			}
			}
			).then(() => {
			// 确认上报后的处理在beforeClose中完成
			}).catch(() => {
			this.$message({
			type: 'info',
			message: '已取消操作'
			});
			});
			},

			// 确认上报
			confirmReport(groupOrderNo, done) {
			this.reportLoading = true;

			// 调用后台API上报数据
			$.ajax({
			url: baseUrl + "/order/pakout/actual/shipment/order/report/auth",
			headers: {'token': localStorage.getItem('token')},
			data: {
			itemName: groupOrderNo // 传递组货单号
			},
			method: 'POST',
			success: (res) => {
			this.reportLoading = false;
			if (typeof done === 'function') {
			done();
			}
			if (res.code === 200 \|\| res.success) {
			this.$message({
			message: `组货单号 ${groupOrderNo} 上报成功`,
			type: 'success',
			duration: 3000
			});
			// 上报成功后关闭弹窗并刷新数据
			setTimeout(() => {
			this.closeDetailDialog();
			this.getTableDataA(); // 刷新主表数据
			}, 1500);
			} else {
			this.$message.error(res.message \|\| '上报失败');
			}
			},
			error: (error) => {
			this.reportLoading = false;
			if (typeof done === 'function') {
			done();
			}
			console.error('上报失败:', error);
			this.$message.error('上报失败，请检查网络连接');
			}
			});
			},

			// 搜索处理
			handleSearch() {
			this.currentPage = 1;
			this.orderByField = '';
			this.orderByType = 'asc';
			this.getTableDataA();
			},

			// 重置搜索条件
			handleReset() {
			this.searchForm = {
			item_name: '',
			cstmr_name: '',
			settle: '',
			order_no: ''
			};
			this.orderByField = '';
			this.orderByType = 'asc';
			this.currentPage = 1;
			this.getTableDataA();
			},

			// 显示详情弹窗
			showDetail(row) {
			this.currentRow = row;
			this.detailDialogVisible = true;
			this.detailCurrentPage = 1;
			this.settleA = row.settle;
			this.getTableDataB(row.itemName);
			},

			// 关闭详情弹窗
			closeDetailDialog() {
			this.detailDialogVisible = false;
			this.currentRow = null;
			this.tableDataB = [];
			this.reportLoading = false;
			},

			// 主表分页大小改变
			handleSizeChange(val) {
			this.pageSize = val;
			this.currentPage = 1;
			this.getTableDataA();
			},

			// 主表页码改变
			handleCurrentChange(val) {
			this.currentPage = val;
			this.getTableDataA();
			},

			// 子表分页大小改变
			handleDetailSizeChange(val) {
			this.detailPageSize = val;
			this.detailCurrentPage = 1;
			if (this.currentRow) {
			this.getTableDataB(this.currentRow.itemName);
			}
			},

			// 子表页码改变
			handleDetailCurrentChange(val) {
			this.detailCurrentPage = val;
			if (this.currentRow) {
			this.getTableDataB(this.currentRow.itemName);
			}
			},

			// 格式化状态显示
			formatStatus(row) {
			if (row.settle === 10) {
			return '待处理';
			} else if (row.settle === 11) {
			return '检验中';
			} else if (row.settle === 12) {
			return '出库中';
			} else if (row.settle === 13) {
			return '存在不合格';
			} else if (row.settle === 15) {
			return '待上报';
			} else if (row.settle === 16) {
			return '上报完成';
			} else if (row.settle === 17) {
			return '上报失败';
			} else if (row.settle === 98) {
			return '异常';
			} else if (row.settle === 99) {
			return '废弃';
			} else {
			return row.settle \|\| '未知';
			}
			},

			// 格式化状态显示
			formatStatusB(row) {
			if (row.status === 0) {
			return '异常';
			} else if (row.status === 1) {
			return '不上报';
			} else if (row.status === 2) {
			return '待上报';
			} else if (row.status === 3) {
			return '已上报';
			} else {
			return row.status \|\| '未知';
			}
			},

			// 格式化金额显示
			formatCurrency(row) {
			if (row.totalFee) {
			return '¥' + parseFloat(row.totalFee).toFixed(2);
			}
			return '¥0.00';
			},

			// 模拟主表数据 - 实际项目中应删除
			mockTableAData() {
			this.tableDataA = [
			{
			itemName: 'zh20251110',
			orderNo: 'ORDER2024001',
			cstmrName: 'zh20251110',
			settle: 10,
			totalFee: 1500.00,
			createTime: '2025-11-10T09:50:16.343+0000',
			memo: '测试数据'
			}
			];
			this.total = 1;
			this.loading = false;
			},

			// 模拟子表数据 - 实际项目中应删除
			mockTableBData(itemName) {
			this.tableDataB = [
			{
			matnr: '6μm×436mm',
			batch: 'L241034114',
			model: '24092501D01A6',
			origin: '1',
			danger: '1',
			memo: '',
			status: 1 // 状态为1，会显示修改按钮
			}
			];
			this.detailTotal = 1;
			this.detailLoading = false;
			},

			// 为表格列添加格式化方法
			formatDateColumn(row, column, cellValue) {
			return this.formatDate(cellValue);
			},



			// // 格式化日期显示
			// formatDate(dateStr) {
			// if (!dateStr) return '';
			// // 简单的日期格式化，可以根据实际格式调整
			// return dateStr;
			// },

			// 在Vue实例的methods中添加或修改formatDate方法
			formatDate(dateStr) {
			if (!dateStr) return '';

			try {
			// 创建Date对象
			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 hours = String(date.getHours()).padStart(2, '0');
			const minutes = String(date.getMinutes()).padStart(2, '0');
			const seconds = String(date.getSeconds()).padStart(2, '0');

			// 返回格式化后的字符串：YYYY-MM-DD HH:mm:ss
			return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
			} catch (error) {
			console.error('日期格式化错误:', error);
			return dateStr; // 如果出错，返回原字符串
			}
			},

			//本地时区的时间
			formatDate2(dateStr) {
			if (!dateStr) return '';

			try {
			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 hours = String(date.getHours()).padStart(2, '0');
			const minutes = String(date.getMinutes()).padStart(2, '0');
			const seconds = String(date.getSeconds()).padStart(2, '0');

			return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
			} catch (error) {
			console.error('日期格式化错误:', error);
			return dateStr;
			}
			},
			//保持UTC时间但转换为更易读的格式
			formatDate3(dateStr) {
			if (!dateStr) return '';

			try {
			// 直接解析字符串，不转换时区
			const date = new Date(dateStr);

			if (isNaN(date.getTime())) {
			return dateStr;
			}

			// 使用UTC时间组件
			const year = date.getUTCFullYear();
			const month = String(date.getUTCMonth() + 1).padStart(2, '0');
			const day = String(date.getUTCDate()).padStart(2, '0');
			const hours = String(date.getUTCHours()).padStart(2, '0');
			const minutes = String(date.getUTCMinutes()).padStart(2, '0');
			const seconds = String(date.getUTCSeconds()).padStart(2, '0');

			return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
			} catch (error) {
			console.error('日期格式化错误:', error);
			return dateStr;
			}
			}
			})
			</script>
			}
			});
			</script>
			</body>

			</html>