Commit 6d04e774 authored by xinzhedeai's avatar xinzhedeai

feature: css代码记过优化

parent d0667754
<!DOCTYPE html> <!DOCTYPE html>
<html lang="zh-CN"> <html lang="zh-CN">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="UTF-8"> <meta name="viewport"
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0, viewprot-fit:cover">
content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0, viewprot-fit:cover"> <title>消防安全检查清单</title>
<title>消防安全检查清单</title> <script type="text/javascript" src="../sdk/includeHead.js"></script>
<script type="text/javascript" src="../sdk/includeHead.js"></script> <style>
</head> /* 基础样式 */
html,
<head> body {
background-color: #fff;
}
<style>
html, /* 通用工具类 */
body { .pd-01rem {
background-color: #fff; padding-bottom: 0.1rem;
} }
.pd-01rem { /* 表单相关 */
padding-bottom: 0.1rem; .formValue {
} float: right;
}
/* 表单相关 */
.formValue { .formSubmitBtnWrapper {
float: right; display: flex;
} justify-content: center;
margin-top: 0.2rem;
.formSubmitBtnWrapper { margin-bottom: 0.2rem;
display: flex; }
justify-content: center;
margin-top: 0.2rem; .formSubmitBtnWrapper .van-button {
margin-bottom: 0.2rem; width: 4rem;
} }
.formSubmitBtnWrapper .van-button { /* 框架样式覆盖修改 */
width: 4rem; .checklist-container .van-cell__value {
} overflow: unset;
background-color: #f5f6fa;
/** }
* 框架样式覆盖修改
*/ .checklist-container .van-cell:after {
.van-cell__value { border-bottom: none;
overflow: unset; }
}
.checklist-container .van-radio-group--horizontal {
.van-cell:after { float: left;
border-bottom: none; }
}
.checklist-container .van-checkbox {
.van-radio-group--horizontal { width: auto;
float: right; }
}
.checklist-container .van-checkbox__label,
.checklist-container { .checklist-container .van-radio__label {
padding: 12px; font-size: 0.28rem;
background: #fff; }
overflow: hidden;
padding-bottom: 1rem; .checklist-container .van-checkbox__icon,
} .checklist-container .van-radio__icon {
font-size: 0.34rem;
.check-item { background-color: #fff;
width: 88vw; }
padding: 12px;
background: white; .checklist-container .van-radio {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); margin-right: 0.8rem;
} margin-top: 0.2rem;
}
.item-header {
display: flex; .checklist-container .van-cell {
align-items: center; background: #f5f6fa;
margin-bottom: 8px; margin-top: 0.2rem;
} padding: 0;
}
.item-number {
/* width: 28px; .checklist-container .van-cell-group {
height: 28px; background-color: #f5f6fa;
line-height: 28px; }
text-align: center;
background: #1989fa; .checklist-container textarea {
color: white; background-color: #fff !important;
border-radius: 50%; }
margin-right: 12px; */
} .checklist-container .van-uploader__upload {
background-color: #fff;
.expand-section { }
width: 77.5vw;
margin-top: 12px; .limit_date_wrapper .van-field__label {
/* border: 2px solid #000; */ width: 1.3rem;
float: left; }
background: #f5f6fa;
padding: 0.4rem; .checklist-container .van-icon-apps-o:before,
} .checklist-container .van-icon-fire-o:before {
font-size: 0.32rem;
.sub-checkbox-group { }
display: grid;
grid-template-columns: repeat(2, 1fr); /* 检查清单容器 */
gap: 8px; .checklist-container {
margin: 8px 0; padding: 12px;
} background: #fff;
overflow: hidden;
.uploader-wrapper { padding-bottom: 1rem;
--van-uploader-size: 80px; }
}
/* 检查项 */
.deadline-picker { .check-item {
display: flex; width: 88vw;
gap: 12px; padding: 12px;
margin: 12px 0; background: white;
} box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
float: left;
.check-item { }
float: left;
} .item-header {
display: flex;
.van-radio-group--horizontal { align-items: center;
float: left; margin-bottom: 8px;
} }
/* 样式优化 */ .item-number {}
.checklist-container.item_title {}
.item-title {
.checklist-header p { font-size: 0.28rem;
background-color: rgb(25, 137, 250); }
color: rgb(255, 255, 255);
font-size: 0.26rem; .item_title {
padding: 0.2rem .3rem .2rem; font-size: 0.3rem;
line-height: .39999rem; color: #1081E3;
margin: 0; font-weight: bold;
} position: relative;
padding-left: 0.2rem;
.checklist-header h5 { }
font-size: .32rem;
text-align: center; .item_title::before {
} content: '';
display: block;
.item_title { width: 0.05rem;
font-size: .3rem; height: 0.32rem;
color: #1081E3; background-color: #1081E3;
font-weight: bold; position: absolute;
position: relative; left: 0;
padding-left: .2rem; top: 0;
} }
.item_title::before { /* 展开部分 */
content: ''; .expand-section {
display: block; width: 77.5vw;
width: 0.05rem; margin-top: 12px;
height: 0.32rem; float: left;
background-color: #1081E3; background: #f5f6fa;
margin-right: 0.2rem; padding: 0.4rem;
position: absolute; }
left: 0;
top: 0; /* 子复选框组 */
.sub-checkbox-group {
} display: flex;
flex-wrap: wrap;
.van-checkbox { gap: 0.2rem;
width: auto; margin: 8px 0;
} }
.van-cell { /* 上传器 */
background: #f5f6fa; .uploader-wrapper {
margin-top: 0.2rem; --van-uploader-size: 80px;
} }
.sub-checkbox-group { /* 截止日期选择器 */
display: flex; .deadline-picker {
flex-wrap: wrap; display: flex;
gap: .2rem; gap: 12px;
} margin: 12px 0;
}
.van-cell-group {
background-color: #f5f6fa; /* 检查清单头部 */
} .checklist-header p {
background-color: rgb(25, 137, 250);
.van-radio { color: rgb(255, 255, 255);
margin-right: 0.8rem; font-size: 0.26rem;
margin-top: .2rem; padding: 0.2rem 0.3rem 0.2rem;
} line-height: 0.39999rem;
margin: 0;
.van-radio__label { }
font-size: 0.28rem;
} .checklist-header h5 {
font-size: 0.32rem;
textarea { text-align: center;
/* background: #f5f6fa !important; */ }
background-color: #fff !important;
} /* 必填标题 */
.title_require {
.van-cell__value { position: relative;
background-color: #f5f6fa; padding: 0;
} margin: 0;
margin-top: 0.1rem;
.van-uploader__upload { padding-left: 0.2rem;
background-color: #fff; }
}
.title_require::before {
.title_require { position: absolute;
position: relative; content: '*';
padding: 0; color: #ee0a24;
margin: 0; font-size: 0.3rem;
margin-top: 0.1rem; left: 0;
/* padding-top: 0.1rem; */ top: 50%;
padding-left: 0.2rem; transform: translateY(-50%);
} }
.title_require::before { /* 底部栏 */
position: absolute; .bottom_bar {
content: '*'; position: fixed;
color: #ee0a24; bottom: 0;
font-size: 0.3rem; left: 50%;
left: 0rem; transform: translateX(-50%);
top: 50%; width: 78vw;
transform: translateY(-50%); border: 1px solid;
} }
.van-cell { .bottom_bar button {
padding: 0; float: right;
} }
</style>
.van-checkbox__label { </head>
font-size: 0.28rem;
} <body>
<!-- 原 HTML 主体内容保持不变 -->
.van-checkbox__icon, <div id="app">
.van-radio__icon { <div class="checklist-header">
font-size: 0.34rem; <p>
background-color: #fff; 1.不合格或不满足等选择“否”的检查项,需将问题进行拍照上传,并描述问题详情。<br>
} 2.检查人员对管辖范围内企业安全情况负责,需如实上报。
</p>
.limit_date_wrapper .van-field__label { <h5>九小场所安全检查清单</h5>
width: 1.3rem; </div>
} <div class="checklist-container">
<div class="item_title">
.item-title { {{ checkData[checkPageIndex].title }}
font-size: 0.28rem; </div>
} <div v-for="(item, index) in checkData[checkPageIndex]['checkList']" :key="item.id" class="check-item">
<div class="item-header">
.bottom_bar { <!-- <div class="item-number">{{ index + 1 }}</div> -->
position: fixed; <div class="item-title">{{ index + 1 }}.{{ item.title }}</div>
bottom: 0; </div>
left: 50%;
transform: translateX(-50%); <!-- 单选按钮组 -->
width: 78vw; <van-radio-group v-model="item.selected" @change="handleSelectionChange(item)" direction="horizontal">
border: 1px solid; <van-radio name="yes"></van-radio>
} <van-radio name="no"></van-radio>
<van-radio name="na">不涉及</van-radio>
.bottom_bar button { </van-radio-group>
float: right;
} <!-- 否选项扩展内容 -->
<div v-show="item.selected !== 'no'" class="expand-section">
.van-icon-apps-o:before, <div>
.van-icon-fire-o:before { <!-- 子检查项 -->
font-size: .32rem; <div class="sub-checkbox-group">
} <van-checkbox v-for="(subItem, subIndex) in item.subChecks" :key="subIndex"
</style> v-model="subItem.checked" shape="square">
</head> 隐患点{{ subIndex + 1 }}
</van-checkbox>
<body> </div>
<div id="app">
<div class="checklist-header"> <!-- 隐患描述 -->
<p> <van-cell-group>
1.不合格或不满足等选择“否”的检查项,需将问题进行拍照上传,并描述问题详情。<br> <p style="font-size:0.2rem" class="title_require">请输入隐患描述</p>
2.检查人员对管辖范围内企业安全情况负责,需如实上报。 <van-field v-model="item.description" type="textarea" rows="1"></van-field>
</p> </van-cell-group>
<h5>九小场所安全检查清单</h5>
<!-- 照片上传 -->
</div> <van-cell-group>
<div class="checklist-container"> <van-cell>*请上传隐患图片:<span style="color: red;">(格式png/jpg/jpeg)</span>
<div class="item_title"> <div>
{{ checkData[checkPageIndex].title }} <van-uploader style="width: 80px; height:80px;" v-model="item.photos"
</div> :max-count="3" :after-read="handleFileUpload" class="uploader-wrapper" />
<div v-for="(item, index) in checkData[checkPageIndex]['checkList']" :key="item.id" class="check-item"> </div>
<div class="item-header"> </van-cell>
<!-- <div class="item-number">{{ index + 1 }}</div> --> </van-cell-group>
<div class="item-title">{{ index + 1 }}.{{ item.title }}</div>
</div> <!-- 整改期限 -->
<van-cell-group>
<!-- 单选按钮组 --> <van-cell>
<van-radio-group v-model="item.selected" @change="handleSelectionChange(item)" <div class="limit_date_wrapper">
direction="horizontal"> <van-field label-align="left" readonly clickable label="整改期限"
<van-radio name="yes"></van-radio> :value="`${item.deadlineDays}天 截至整改日期:${item.deadlineDate}`"
<van-radio name="no"></van-radio> @click="showDeadlinePicker = true; currentItem=item" />
<van-radio name="na">不涉及</van-radio> </div>
</van-radio-group> </van-cell>
</van-cell-group>
<!-- 否选项扩展内容 --> </div>
<div v-show="item.selected !== 'no'" class="expand-section"> </div>
<div> </div>
<!-- 子检查项 -->
<div class="sub-checkbox-group"> <!-- 底部栏 -->
<van-checkbox v-for="(subItem, subIndex) in item.subChecks" :key="subIndex" <div class="bottom_bar">
v-model="subItem.checked" shape="square"> <div style="display: inline-block;">
隐患点{{ subIndex + 1 }} <van-icon name="apps-o" color="blue" />
<span
</van-checkbox> style="color: #545454;font-size: 0.28rem;margin-right: 1rem;margin-left: 0.2rem;">{{ notNullCount }}/{{totalItems}}</span>
</div> <van-icon name="fire-o" color="#ee0a24" />
<span style="color: #545454;font-size: 0.28rem;margin-left: 0.2rem;">{{noCount}} 隐患</span>
<!-- 隐患描述 --> </div>
<!-- <van-field <van-button type="info" size="small" @click="navTo1" v-show="checkPageIndex===3">完成检查</van-button>
v-model="item.description" <van-button v-show="checkPageIndex<3" type="info" size="small"
type="textarea" @click="checkPageIndex++">下一项</van-button>
rows="2" </div>
placeholder="请填写具体隐患情况"
label="隐患描述" <!-- 整改天数选择器 -->
/> --> <van-popup v-model="showDeadlinePicker" position="bottom">
<van-picker :columns="deadlineOptions" @confirm="handleDeadlineConfirm" show-toolbar
<van-cell-group> title="选择整改天数" />
<p style="font-size:0.2rem" class="title_require">请输入隐患描述</p> </van-popup>
<van-field v-model="item.description" type="textarea" rows="1"></van-field> </div>
</van-cell-group> <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
<script src="https://cdn.jsdelivr.net/npm/vant@2/lib/vant.min.js"></script>
<!-- 照片上传 -->
<van-cell-group> <script>
<van-cell>*请上传隐患图片:<span style="color: red;">(格式png/jpg/jpeg)</span> // 原 JavaScript 代码保持不变
<div> const checkData = [{
<van-uploader style="width: 80px; height:80px;" v-model="item.photos" id: 1,
:max-count="3" :after-read="handleFileUpload" class="uploader-wrapper" /> title: '消防安全检查',
</div> checkList: [{
</van-cell> id: 1,
</van-cell-group> title: '检查项目 1',
<!-- <van-uploader selected: null,
style="width: 80px; height:80px;" subChecks: [{
v-model="item.photos" id: 1,
:max-count="3" checked: false
:after-read="handleFileUpload" },
class="uploader-wrapper" {
/> --> id: 2,
checked: false
},
<van-cell-group> {
<van-cell> id: 3,
<div class="limit_date_wrapper"> checked: false
<van-field label-align="left" readonly clickable label="整改期限" },
:value="`${item.deadlineDays}天 截至整改日期:${item.deadlineDate}`" {
@click="showDeadlinePicker = true; currentItem=item" /> id: 4,
</div> checked: false
</van-cell> }
</van-cell-group> ],
description: '',
photos: [],
</div> deadlineDays: '',
</div> deadlineDate: ''
}, {
</div> id: 1,
title: '检查项目 2',
<!-- <div> selected: null,
<div><span class="title">检查人员</span><span class="content">xxxxxx</span></div> subChecks: [{
<div><span class="title">检查人员</span><span class="content">xxxxxx</span></div> id: 1,
</div> --> checked: false
<div class="bottom_bar"> },
{
id: 2,
<div style="display: inline-block;"> checked: false
<van-icon name="apps-o" color="blue" /> },
<span {
style="color: #545454;font-size: 0.28rem;margin-right: 1rem;margin-left: 0.2rem;">{{ notNullCount }}/{{totalItems}}</span> id: 3,
<van-icon name="fire-o" color="#ee0a24" /> checked: false
<span style="color: #545454;font-size: 0.28rem;margin-left: 0.2rem;">{{noCount}} 隐患</span> },
</div> {
<van-button type="info" size="small" @click="navTo1" v-show="checkPageIndex===3">完成检查</van-button> id: 4,
<van-button v-show="checkPageIndex<3" type="info" size="small" checked: false
@click="checkPageIndex++">下一项</van-button> }
</div> ],
<!-- 整改天数选择器 --> description: '',
<van-popup v-model="showDeadlinePicker" position="bottom"> photos: [],
<van-picker :columns="deadlineOptions" @confirm="handleDeadlineConfirm" show-toolbar deadlineDays: '',
title="选择整改天数" /> deadlineDate: ''
</van-popup> }],
</div> },
{
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script> id: 2,
<script src="https://cdn.jsdelivr.net/npm/vant@2/lib/vant.min.js"></script> title: '用电安全检查',
checkList: [{
<script> id: 1,
const checkData = [{ title: '检查项目 1',
id: 1, selected: null,
title: '消防安全检查', subChecks: [{
checkList: [{ id: 1,
id: 1, checked: false
title: '检查项目 1', },
selected: null, {
subChecks: [{ id: 2,
id: 1, checked: false
checked: false },
}, {
{ id: 3,
id: 2, checked: false
checked: false },
}, {
{ id: 4,
id: 3, checked: false
checked: false }
}, ],
{ description: '',
id: 4, photos: [],
checked: false deadlineDays: '',
} deadlineDate: ''
], }],
description: '', },
photos: [], {
deadlineDays: '', id: 3,
deadlineDate: '' title: '用电安全检查2',
}, { checkList: [{
id: 1, id: 1,
title: '检查项目 2', title: '检查项目 1',
selected: null, selected: null,
subChecks: [{ subChecks: [{
id: 1, id: 1,
checked: false checked: false
}, },
{ {
id: 2, id: 2,
checked: false checked: false
}, },
{ {
id: 3, id: 3,
checked: false checked: false
}, },
{ {
id: 4, id: 4,
checked: false checked: false
} }
], ],
description: '', description: '',
photos: [], photos: [],
deadlineDays: '', deadlineDays: '',
deadlineDate: '' deadlineDate: ''
}], }],
}, },
{ {
id: 2, id: 4,
title: '用电安全检查', title: '用电安全检查4',
checkList: [{ checkList: [{
id: 1, id: 1,
title: '检查项目 1', title: '检查项目 1',
selected: null, selected: null,
subChecks: [{ subChecks: [{
id: 1, id: 1,
checked: false checked: false
}, },
{ {
id: 2, id: 2,
checked: false checked: false
}, },
{ {
id: 3, id: 3,
checked: false checked: false
}, },
{ {
id: 4, id: 4,
checked: false checked: false
} }
], ],
description: '', description: '',
photos: [], photos: [],
deadlineDays: '', deadlineDays: '',
deadlineDate: '' deadlineDate: ''
}], }],
}, },
{ ];
id: 3,
title: '用电安全检查2', function countSelectedNo(result) {
checkList: [{ // 获取 checkList 中 selected 为 'no' 的对象个数
id: 1, return result.reduce((total, category) => {
title: '检查项目 1', return total + category.checkList.filter(item => item.selected === 'no').length;
selected: null, }, 0);
subChecks: [{ }
id: 1,
checked: false function getTotalCheckListItems(result) {
}, // 获取所有 checkList 子元素的总数
{ return result.reduce((total, category) => {
id: 2, console.log(category, 'category');
checked: false return total + category.checkList.length;
}, }, 0);
{ }
id: 3,
checked: false function countSelectedNotNull(result) {
}, // 获取 checkList 中 selected 不为 null 的个数
{ return result.reduce((total, category) => {
id: 4, return total + category.checkList.filter(item => item.selected !== null).length;
checked: false }, 0);
} }
],
description: '', // 统计各个状态数量
photos: [], const noCount = countSelectedNo(checkData); // selected=no 的个数
deadlineDays: '', const totalItems = getTotalCheckListItems(checkData); // checkList 子元素总数
deadlineDate: '' const notNullCount = countSelectedNotNull(checkData); // selected 不为 null 的个数
}],
}, // 初始化检查项数据结构
{ function createCheckItem(id) {
id: 4, return {
title: '用电安全检查4', id: id,
checkList: [{ title: `检查项目 ${id}`,
id: 1, selected: null,
title: '检查项目 1', subChecks: Array.from({ length: 10 }, (_, i) => ({
selected: null, id: i + 1,
subChecks: [{ checked: false
id: 1, })),
checked: false description: '',
}, photos: [],
{ deadlineDays: '',
id: 2, deadlineDate: ''
checked: false };
}, }
{
id: 3, new Vue({
checked: false el: '#app',
}, data: {
{ showDeadlinePicker: false,
id: 4, deadlineOptions: ['1', '3', '5', '7'],
checked: false currentEditingItem: null,
} checkList: Array.from({ length: 40 }, (_, i) => createCheckItem(i + 1)),
], checkData, // 提交给后端,图片使用vant结构,base64,后端处理,不走爱山东中台。(数据量大!)
description: '', checkPageIndex: 0,
photos: [], currentItem: null,
deadlineDays: '', noCount,
deadlineDate: '' totalItems,
}], notNullCount
}, },
watch: {
] checkData: {
handler(newVal) {
function countSelectedNo(result) { // 获取 checkList 中 selected 为 'no' 的对象个数 const snapshot = JSON.parse(JSON.stringify(newVal));
return result.reduce((total, category) => { console.log('全量变化:', snapshot);
return total + category.checkList.filter(item => item.selected === 'no').length; this.noCount = countSelectedNo(newVal); // selected=no 的个数
}, 0); this.totalItems = getTotalCheckListItems(newVal); // checkList 子元素总数
} this.notNullCount = countSelectedNotNull(newVal); // selected 不为 null 的个数
},
function getTotalCheckListItems(result) { // 获取所有 checkList 子元素的总数 deep: true
return result.reduce((total, category) => { }
console.log(category, 'category') },
return total + category.checkList.length; methods: {
}, 0); navTo1() {
} lightAppJssdk.navigation.show({
url: '_shanghu_detail.html',
function countSelectedNotNull(result) { // 获取 checkList 中 selected 不为 null 的个数 title: '高区应急扫描',
return result.reduce((total, category) => { isgoback: '0',
return total + category.checkList.filter(item => item.selected !== null).length; success: function (data) {
}, 0); // 成功回调
} },
// 统计各个状态数量 fail: function (data) {
// 调用方法 // 错误返回
const noCount = countSelectedNo(checkData); // selected=no 的个数 }
const totalItems = getTotalCheckListItems(checkData); // checkList 子元素总数 });
const notNullCount = countSelectedNotNull(checkData); // selected 不为 null 的个数 },
// 处理单选变化
handleSelectionChange(item) {
// 初始化检查项数据结构 if (item.selected !== 'no') {
function createCheckItem(id) { this.$set(item, 'description', '');
return { this.$set(item, 'photos', []);
id: id, this.$set(item, 'deadlineDays', '');
title: `检查项目 ${id}`, this.$set(item, 'deadlineDate', '');
selected: null, }
subChecks: Array.from({ },
length: 10 // 文件上传处理
}, (_, i) => ({ handleFileUpload(file) {
id: i + 1, console.log('上传文件:', file);
checked: false // 此处可添加实际文件上传逻辑
})), },
description: '', // 整改天数确认
photos: [], handleDeadlineConfirm(value) {
deadlineDays: '', const days = parseInt(value);
deadlineDate: '', const currentItem = this.currentItem;
if (currentItem) {
currentItem.deadlineDays = days;
const deadlineDate = new Date();
} deadlineDate.setDate(deadlineDate.getDate() + days);
} currentItem.deadlineDate = this.formatDate(deadlineDate);
}
new Vue({ this.showDeadlinePicker = false;
el: '#app', },
data: { // 日期格式化
showDeadlinePicker: false, formatDate(date) {
deadlineOptions: ['1', '3', '5', '7'], return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`;
currentEditingItem: null, }
checkList: Array.from({ }
length: 40 });
}, (_, i) => createCheckItem(i + 1)), </script>
checkData, // 提交给后端,图片使用vant结构,base64,后端处理,不走爱山东中台。(数据量大!) </div>
checkPageIndex: 0, </body>
currentItem: null,
noCount,
totalItems,
notNullCount,
},
watch: {
checkData: {
handler(newVal) {
const snapshot = JSON.parse(JSON.stringify(newVal));
// const snapshot = JSON.stringify(newVal);
console.log('全量变化:', snapshot);
this.noCount = countSelectedNo(newVal); // selected=no 的个数
this.totalItems = getTotalCheckListItems(newVal); // checkList 子元素总数
this.notNullCount = countSelectedNotNull(newVal); // selected 不为 null 的个数
},
deep: true
},
},
methods: {
navTo1() {
lightAppJssdk.navigation.show({
url: '_shanghu_detail.html',
title: '高区应急扫描',
isgoback: '0',
success: function(data) {
//成功回调
},
fail: function(data) {
//错误返回
}
});
},
// 处理单选变化
handleSelectionChange(item) {
if (item.selected !== 'no') {
this.$set(item, 'description', '')
this.$set(item, 'photos', [])
this.$set(item, 'deadlineDays', '')
this.$set(item, 'deadlineDate', '')
}
},
// 文件上传处理
handleFileUpload(file) {
console.log('上传文件:', file)
// 此处可添加实际文件上传逻辑
},
// 整改天数确认
handleDeadlineConfirm(value) {
const days = parseInt(value)
// const currentItem = this.checkList.find(
// item => item.selected === 'no' && !item.deadlineDays
// )
const currentItem = this.currentItem
if (currentItem) {
currentItem.deadlineDays = days
const deadlineDate = new Date()
deadlineDate.setDate(deadlineDate.getDate() + days)
currentItem.deadlineDate = this.formatDate(deadlineDate)
}
this.showDeadlinePicker = false
},
// 日期格式化
formatDate(date) {
return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`
}
}
})
</script>
</body>
</html> </html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment