Skip to content

G
GaoQuYingJiH5-ASD
Commit 8bffbec9 authored by xinzhedeai's avatar xinzhedeai
Browse files
Options

检查单样式修改

parent 2cd1af3c
Hide whitespace changes
Inline Side-by-side
Showing with 608 additions and 592 deletions
src/_check_list.html
View file @ 8bffbec9
<!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 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> <style>
/* 基础样式 */ /* 基础样式 */
html, html,
body { body {
background-color: #fff; background-color: #fff;
} }
/* 通用工具类 */ /* 通用工具类 */
.pd-01rem { .pd-01rem {
padding-bottom: 0.1rem; padding-bottom: 0.1rem;
} }
/* 表单相关 */ /* 表单相关 */
.formValue { .formValue {
float: right; float: right;
} }
.formSubmitBtnWrapper { .formSubmitBtnWrapper {
display: flex; display: flex;
justify-content: center; justify-content: center;
margin-top: 0.2rem; margin-top: 0.2rem;
margin-bottom: 0.2rem; margin-bottom: 0.2rem;
} }
.formSubmitBtnWrapper .van-button { .formSubmitBtnWrapper .van-button {
width: 4rem; width: 4rem;
} }
/* 框架样式覆盖修改 */ /* 框架样式覆盖修改 */
.checklist-container .van-cell__value { .checklist-container .van-cell__value {
overflow: unset; overflow: unset;
background-color: #f5f6fa; background-color: #f5f6fa;
} }
.checklist-container .van-cell:after { .checklist-container .van-cell:after {
border-bottom: none; border-bottom: none;
} }
.checklist-container .van-radio-group--horizontal { .checklist-container .van-radio-group--horizontal {
float: left; float: left;
} }
.checklist-container .van-checkbox { .checklist-container .van-checkbox {
width: auto; width: auto;
} }
.checklist-container .van-checkbox__label, .checklist-container .van-checkbox__label,
.checklist-container .van-radio__label { .checklist-container .van-radio__label {
font-size: 0.28rem; font-size: 0.28rem;
} }
.checklist-container .van-checkbox__icon, .checklist-container .van-checkbox__icon,
.checklist-container .van-radio__icon { .checklist-container .van-radio__icon {
font-size: 0.34rem; font-size: 0.34rem;
background-color: #fff; background-color: #fff;
} }
.checklist-container .van-radio { .checklist-container .van-radio {
margin-right: 0.8rem; margin: .2rem 0 0.2rem 0.8rem;
margin-top: 0.2rem; }
}
.checklist-container .van-cell {
.checklist-container .van-cell { background: #f5f6fa;
background: #f5f6fa; margin-top: 0.2rem;
margin-top: 0.2rem; padding: 0;
padding: 0; }
}
.checklist-container .van-cell-group {
.checklist-container .van-cell-group { background-color: #f5f6fa;
background-color: #f5f6fa; }
}
.checklist-container textarea {
.checklist-container textarea { background-color: #fff !important;
background-color: #fff !important; }
}
.checklist-container .van-uploader__upload {
.checklist-container .van-uploader__upload { background-color: #fff;
background-color: #fff; }
}
.limit_date_wrapper .van-field__label {
.limit_date_wrapper .van-field__label { width: 1.3rem;
width: 1.3rem; }
}
.checklist-container .van-icon-apps-o:before,
.checklist-container .van-icon-apps-o:before, .checklist-container .van-icon-fire-o:before {
.checklist-container .van-icon-fire-o:before { font-size: 0.32rem;
font-size: 0.32rem; }
}
/* 检查清单容器 */
/* 检查清单容器 */ .checklist-container {
.checklist-container { /* padding: 12px; */
padding: 12px; background: #fff;
background: #fff; overflow: hidden;
overflow: hidden; padding-bottom: 1rem;
padding-bottom: 1rem; }
}
/* 检查项 */
/* 检查项 */ .check-item {
.check-item { background: white;
width: 88vw; float: left;
padding: 12px; }
background: white;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); .item-header {
float: left; display: flex;
} align-items: center;
margin: .3rem 0px .1rem .3rem;
.item-header { }
display: flex;
align-items: center; .item-number {}
margin-bottom: 8px;
} .item-title {
font-size: 0.28rem;
.item-number {} }
.item-title { .item_title {
font-size: 0.28rem; font-size: 0.3rem;
} color: #1081E3;
font-weight: bold;
.item_title { position: relative;
font-size: 0.3rem; padding-left: 0.2rem;
color: #1081E3; }
font-weight: bold;
position: relative; .item_title::before {
padding-left: 0.2rem; content: '';
} display: block;
width: 0.05rem;
.item_title::before { height: 0.32rem;
content: ''; background-color: #1081E3;
display: block; position: absolute;
width: 0.05rem; left: 0;
height: 0.32rem; top: 0;
background-color: #1081E3; }
position: absolute;
left: 0; /* 展开部分 */
top: 0; .expand-section {
} width: calc(7.5rem - 0.6rem);
float: left;
/* 展开部分 */ background: #f5f6fa;
.expand-section { padding: 0.1rem 0.3rem;
width: 77.5vw; }
margin-top: 12px;
float: left; /* 子复选框组 */
background: #f5f6fa; .sub-checkbox-group {
padding: 0.4rem; display: flex;
} flex-wrap: wrap;
gap: 0.2rem;
/* 子复选框组 */ margin: .2rem 0 .3rem 0;
.sub-checkbox-group { }
display: flex;
flex-wrap: wrap; /* 上传器 */
gap: 0.2rem; .uploader-wrapper {
margin: 8px 0; --van-uploader-size: 80px;
} }
/* 上传器 */ /* 截止日期选择器 */
.uploader-wrapper { .deadline-picker {
--van-uploader-size: 80px; display: flex;
} gap: 12px;
margin: 12px 0;
/* 截止日期选择器 */ }
.deadline-picker {
display: flex; /* 检查清单头部 */
gap: 12px; .checklist-header p {
margin: 12px 0; background-color: rgb(25, 137, 250);
} color: rgb(255, 255, 255);
font-size: 0.26rem;
/* 检查清单头部 */ padding: 0.2rem 0.3rem 0.2rem;
.checklist-header p { line-height: 0.39999rem;
background-color: rgb(25, 137, 250); margin: 0;
color: rgb(255, 255, 255); }
font-size: 0.26rem;
padding: 0.2rem 0.3rem 0.2rem; .checklist-header h5 {
line-height: 0.39999rem; font-size: 0.32rem;
margin: 0; text-align: center;
} }
.checklist-header h5 { /* 必填标题 */
font-size: 0.32rem; .title_require {
text-align: center; position: relative;
} padding: 0;
margin: 0;
/* 必填标题 */ margin-top: 0.1rem;
.title_require { padding-left: 0.2rem;
position: relative; font-size: .28rem;
padding: 0; }
margin: 0;
margin-top: 0.1rem; .title_require::before {
padding-left: 0.2rem; position: absolute;
} content: '*';
color: #ee0a24;
.title_require::before { font-size: inherit;
position: absolute; left: 0;
content: '*'; top: 50%;
color: #ee0a24; transform: translateY(-50%);
font-size: 0.3rem; }
left: 0;
top: 50%; /* 底部栏 */
transform: translateY(-50%); .bottom_bar {
} display: flex;
justify-content: space-between;
/* 底部栏 */ position: fixed;
.bottom_bar { align-items: center;
display: flex; bottom: 0.5rem;
justify-content: space-between; left: 50%;
position: fixed; transform: translateX(-50%);
align-items: center; width: 83vw;
bottom: 0.5rem; /* border: 1px solid; */
left: 50%; background: #FFFFFF;
transform: translateX(-50%); box-shadow: 2px -5px 21px 0px rgba(103, 103, 103, 0.14);
width: 83vw; padding-top: 0.2rem;
/* border: 1px solid; */ padding-bottom: 0.2rem;
background: #FFFFFF; padding-left: 0.2rem;
box-shadow: 2px -5px 21px 0px rgba(103,103,103,0.14); padding-right: 0.2rem;
padding-top: 0.2rem; }
padding-bottom: 0.2rem;
padding-left: 0.2rem; .bottom_bar button {
padding-right: 0.2rem; float: right;
} }
.bottom_bar button { .day_select{
float: right; border-color: rgb(191, 191, 191);
} margin-right: 0.1rem;
</style> width: 1rem;
</head> padding-left: .2rem;
background-color: #fff;
<body> }
<!-- 原 HTML 主体内容保持不变 --> </style>
<div id="app"> </head>
<div class="checklist-header">
<p> <body>
1.不合格或不满足等选择“否”的检查项，需将问题进行拍照上传，并描述问题详情。<br> <!-- 原 HTML 主体内容保持不变 -->
2.检查人员对管辖范围内企业安全情况负责，需如实上报。 <div id="app">
</p> <div class="checklist-header">
<h5>九小场所安全检查清单</h5> <p>
</div> 1.不合格或不满足等选择“否”的检查项，需将问题进行拍照上传，并描述问题详情。<br>
<div class="checklist-container"> 2.检查人员对管辖范围内企业安全情况负责，需如实上报。
<div class="item_title"> </p>
{{ checkData[checkPageIndex].title }} <h5>九小场所安全检查清单</h5>
</div> </div>
<div v-for="(item, index) in checkData[checkPageIndex]['checkList']" :key="item.id" class="check-item"> <div class="checklist-container">
<div class="item-header"> <div class="item_title">
<!-- <div class="item-number">{{ index + 1 }}</div> --> {{ checkData[checkPageIndex].title }}
<div class="item-title">{{ index + 1 }}.{{ item.title }}</div> </div>
</div> <div v-for="(item, index) in checkData[checkPageIndex]['checkList']" :key="item.id" class="check-item">
<div class="item-header">
<!-- 单选按钮组 --> <!-- <div class="item-number">{{ index + 1 }}</div> -->
<van-radio-group v-model="item.selected" @change="handleSelectionChange(item)" direction="horizontal"> <div class="item-title">{{ index + 1 }}.{{ item.title }}</div>
<van-radio name="yes">是</van-radio> </div>
<van-radio name="no">否</van-radio>
<van-radio name="na">不涉及</van-radio> <!-- 单选按钮组 -->
</van-radio-group> <van-radio-group v-model="item.selected" @change="handleSelectionChange(item)"
direction="horizontal">
<!-- 否选项扩展内容 --> <van-radio name="yes">是</van-radio>
<div v-show="item.selected !== 'no'" class="expand-section"> <van-radio name="no">否</van-radio>
<div> <van-radio name="na">不涉及</van-radio>
<!-- 子检查项 --> </van-radio-group>
<div class="sub-checkbox-group">
<van-checkbox v-for="(subItem, subIndex) in item.subChecks" :key="subIndex" <!-- 否选项扩展内容 -->
v-model="subItem.checked" shape="square"> <div v-show="item.selected !== 'no'" class="expand-section">
隐患点{{ subIndex + 1 }} <div>
</van-checkbox> <!-- 子检查项 -->
</div> <div class="sub-checkbox-group">
<van-checkbox v-for="(subItem, subIndex) in item.subChecks" :key="subIndex"
<!-- 隐患描述 --> v-model="subItem.checked" shape="square">
<van-cell-group> 隐患点{{ subIndex + 1 }}
<p style="font-size:0.2rem" class="title_require">请输入隐患描述</p> </van-checkbox>
<van-field v-model="item.description" type="textarea" rows="1"></van-field> </div>
</van-cell-group>
<!-- 隐患描述 -->
<!-- 照片上传 --> <van-cell-group>
<van-cell-group> <p class="title_require">请输入隐患描述</p>
<van-cell>*请上传隐患图片:<span style="color: red;">(格式png/jpg/jpeg)</span> <van-field v-model="item.description" type="textarea" rows="1"></van-field>
<div> </van-cell-group>
<van-uploader style="width: 80px; height:80px;" v-model="item.photos"
:max-count="3" :after-read="handleFileUpload" class="uploader-wrapper" /> <!-- 照片上传 -->
</div> <van-cell-group>
</van-cell> <van-cell><span class="title_require">请上传隐患图片:</span><span style="color: red;">(格式png/jpg/jpeg,最多4张)</span>
</van-cell-group> <div>
<van-uploader style="width: 80px; height:80px;" v-model="item.photos"
<!-- 整改期限 --> :max-count="3" :after-read="handleFileUpload" class="uploader-wrapper" />
<van-cell-group> </div>
<van-cell> </van-cell>
<div class="limit_date_wrapper"> </van-cell-group>
<van-field label-align="left" readonly clickable label="整改期限"
:value="`${item.deadlineDays}天 截至整改日期：${item.deadlineDate}`" <!-- 整改期限 -->
@click="showDeadlinePicker = true; currentItem=item" /> <van-cell-group>
</div> <van-cell>
</van-cell>
</van-cell-group> <div class="limit_date_wrapper">
</div> <span class="title_require">整改期限:</span>
</div> <select class="day_select" name="" v-model="item.deadlineDays" @change="handleDeadlineConfirm($event, item)">
</div> <option value="1">1</option>
<option value="3">3</option>
<!-- 底部栏 --> <option value="5">5</option>
<div class="bottom_bar"> <option value="7">7</option>
<div style="display: inline-block; margin-bottom: 0.2rem;"> </select>
<van-icon name="apps-o" color="blue" /> <span> 截止整改日期: {{item.deadlineDate}}</span>
<span </div>
style="color: #545454;font-size: 0.28rem;margin-right: 1rem;margin-left: 0.2rem;">{{ notNullCount }}/{{totalItems}}</span> </van-cell>
<van-icon name="fire-o" color="#ee0a24" /> </van-cell-group>
<span style="color: #545454;font-size: 0.28rem;margin-left: 0.2rem;">{{noCount}} 隐患</span> </div>
</div> </div>
<van-button type="info" size="small" @click="navTo1" v-show="checkPageIndex===3">完成检查</van-button> </div>
<van-button v-show="checkPageIndex<3" type="info" size="small"
@click="checkPageIndex++">下一项</van-button> <!-- 底部栏 -->
</div> <div class="bottom_bar">
<div style="display: inline-block; margin-bottom: 0.2rem;">
<!-- 整改天数选择器 --> <van-icon name="apps-o" color="blue" />
<van-popup v-model="showDeadlinePicker" position="bottom"> <span
<van-picker :columns="deadlineOptions" @confirm="handleDeadlineConfirm" show-toolbar style="color: #545454;font-size: 0.28rem;margin-right: 1rem;margin-left: 0.2rem;">{{ notNullCount }}/{{totalItems}}</span>
title="选择整改天数" /> <van-icon name="fire-o" color="#ee0a24" />
</van-popup> <span style="color: #545454;font-size: 0.28rem;margin-left: 0.2rem;">{{noCount}} 隐患</span>
</div> </div>
<van-button type="info" size="small" @click="navTo1" v-show="checkPageIndex===3">完成检查</van-button>
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script> <van-button v-show="checkPageIndex<3" type="info" size="small"
<script src="https://cdn.jsdelivr.net/npm/vant@2/lib/vant.min.js"></script> @click="checkPageIndex++">下一项</van-button>
</div>
<script>
// 原 JavaScript 代码保持不变 <!-- 整改天数选择器 -->
const checkData = [{ <van-popup v-model="showDeadlinePicker" position="bottom">
id: 1, <van-picker :columns="deadlineOptions" @confirm="handleDeadlineConfirm" show-toolbar
title: '消防安全检查', title="选择整改天数" />
checkList: [{ </van-popup>
id: 1, </div>
title: '检查项目 1', <script>
selected: null, window.onload = function() {
subChecks: [{
id: 1,
checked: false // 原 JavaScript 代码保持不变
}, const checkData = [{
{ id: 1,
id: 2, title: '消防安全检查',
checked: false checkList: [{
}, id: 1,
{ title: '检查项目 1',
id: 3, selected: null,
checked: false subChecks: [{
}, id: 1,
{ checked: false
id: 4, },
checked: false {
} id: 2,
], checked: false
description: '', },
photos: [], {
deadlineDays: '', id: 3,
deadlineDate: '' checked: false
}, { },
id: 1, {
title: '检查项目 2', id: 4,
selected: null, checked: false
subChecks: [{ }
id: 1, ],
checked: false description: '',
}, photos: [],
{ deadlineDays: '',
id: 2, deadlineDate: ''
checked: false }, {
}, id: 1,
{ title: '检查项目 2',
id: 3, selected: null,
checked: false subChecks: [{
}, id: 1,
{ checked: false
id: 4, },
checked: false {
} id: 2,
], checked: false
description: '', },
photos: [], {
deadlineDays: '', id: 3,
deadlineDate: '' checked: false
}], },
}, {
{ id: 4,
id: 2, checked: false
title: '用电安全检查', }
checkList: [{ ],
id: 1, description: '',
title: '检查项目 1', photos: [],
selected: null, deadlineDays: '',
subChecks: [{ deadlineDate: ''
id: 1, }],
checked: false },
}, {
{ id: 2,
id: 2, title: '用电安全检查',
checked: false checkList: [{
}, id: 1,
{ title: '检查项目 1',
id: 3, selected: null,
checked: false subChecks: [{
}, id: 1,
{ checked: false
id: 4, },
checked: false {
} id: 2,
], checked: false
description: '', },
photos: [], {
deadlineDays: '', id: 3,
deadlineDate: '' checked: false
}], },
}, {
{ id: 4,
id: 3, checked: false
title: '用电安全检查2', }
checkList: [{ ],
id: 1, description: '',
title: '检查项目 1', photos: [],
selected: null, deadlineDays: '',
subChecks: [{ deadlineDate: ''
id: 1, }],
checked: false },
}, {
{ id: 3,
id: 2, title: '用电安全检查2',
checked: false checkList: [{
}, id: 1,
{ title: '检查项目 1',
id: 3, selected: null,
checked: false subChecks: [{
}, id: 1,
{ checked: false
id: 4, },
checked: false {
} id: 2,
], checked: false
description: '', },
photos: [], {
deadlineDays: '', id: 3,
deadlineDate: '' checked: false
}], },
}, {
{ id: 4,
id: 4, checked: false
title: '用电安全检查4', }
checkList: [{ ],
id: 1, description: '',
title: '检查项目 1', photos: [],
selected: null, deadlineDays: '',
subChecks: [{ deadlineDate: ''
id: 1, }],
checked: false },
}, {
{ id: 4,
id: 2, title: '用电安全检查4',
checked: false checkList: [{
}, id: 1,
{ title: '检查项目 1',
id: 3, selected: null,
checked: false subChecks: [{
}, id: 1,
{ checked: false
id: 4, },
checked: false {
} id: 2,
], checked: false
description: '', },
photos: [], {
deadlineDays: '', id: 3,
deadlineDate: '' checked: false
}], },
}, {
]; id: 4,
checked: false
function countSelectedNo(result) { }
// 获取 checkList 中 selected 为 'no' 的对象个数 ],
return result.reduce((total, category) => { description: '',
return total + category.checkList.filter(item => item.selected === 'no').length; photos: [],
}, 0); deadlineDays: '',
} deadlineDate: ''
}],
function getTotalCheckListItems(result) { },
// 获取所有 checkList 子元素的总数 ];
return result.reduce((total, category) => {
console.log(category, 'category'); function countSelectedNo(result) {
return total + category.checkList.length; // 获取 checkList 中 selected 为 'no' 的对象个数
}, 0); return result.reduce((total, category) => {
} return total + category.checkList.filter(item => item.selected === 'no').length;
}, 0);
function countSelectedNotNull(result) { }
// 获取 checkList 中 selected 不为 null 的个数
return result.reduce((total, category) => { function getTotalCheckListItems(result) {
return total + category.checkList.filter(item => item.selected !== null).length; // 获取所有 checkList 子元素的总数
}, 0); return result.reduce((total, category) => {
} console.log(category, 'category');
return total + category.checkList.length;
// 统计各个状态数量 }, 0);
const noCount = countSelectedNo(checkData); // selected=no 的个数 }
const totalItems = getTotalCheckListItems(checkData); // checkList 子元素总数
const notNullCount = countSelectedNotNull(checkData); // selected 不为 null 的个数 function countSelectedNotNull(result) {
// 获取 checkList 中 selected 不为 null 的个数
// 初始化检查项数据结构 return result.reduce((total, category) => {
function createCheckItem(id) { return total + category.checkList.filter(item => item.selected !== null).length;
return { }, 0);
id: id, }
title: `检查项目 ${id}`,
selected: null, // 统计各个状态数量
subChecks: Array.from({ length: 10 }, (_, i) => ({ const noCount = countSelectedNo(checkData); // selected=no 的个数
id: i + 1, const totalItems = getTotalCheckListItems(checkData); // checkList 子元素总数
checked: false const notNullCount = countSelectedNotNull(checkData); // selected 不为 null 的个数
})),
description: '', // 初始化检查项数据结构
photos: [], function createCheckItem(id) {
deadlineDays: '', return {
deadlineDate: '' id: id,
}; title: `检查项目 ${id}`,
} selected: null,
subChecks: Array.from({
new Vue({ length: 10
el: '#app', }, (_, i) => ({
data: { id: i + 1,
showDeadlinePicker: false, checked: false
deadlineOptions: ['1', '3', '5', '7'], })),
currentEditingItem: null, description: '',
checkList: Array.from({ length: 40 }, (_, i) => createCheckItem(i + 1)), photos: [],
checkData, // 提交给后端，图片使用vant结构，base64，后端处理，不走爱山东中台。（数据量大！） deadlineDays: '',
checkPageIndex: 0, deadlineDate: ''
currentItem: null, };
noCount, }
totalItems,
notNullCount new Vue({
}, el: '#app',
watch: { data: {
checkData: { showDeadlinePicker: false,
handler(newVal) { deadlineOptions: ['1', '3', '5', '7'],
const snapshot = JSON.parse(JSON.stringify(newVal)); currentEditingItem: null,
console.log('全量变化:', snapshot); checkList: Array.from({
this.noCount = countSelectedNo(newVal); // selected=no 的个数 length: 40
this.totalItems = getTotalCheckListItems(newVal); // checkList 子元素总数 }, (_, i) => createCheckItem(i + 1)),
this.notNullCount = countSelectedNotNull(newVal); // selected 不为 null 的个数 checkData, // 提交给后端，图片使用vant结构，base64，后端处理，不走爱山东中台。（数据量大！）
}, checkPageIndex: 0,
deep: true currentItem: null,
} noCount,
}, totalItems,
methods: { notNullCount
navTo1() { },
lightAppJssdk.navigation.show({ watch: {
url: '_shanghu_detail.html', checkData: {
title: '高区应急扫描', handler(newVal) {
isgoback: '0', const snapshot = JSON.parse(JSON.stringify(newVal));
success: function (data) { console.log('全量变化:', snapshot);
// 成功回调 this.noCount = countSelectedNo(newVal); // selected=no 的个数
}, this.totalItems = getTotalCheckListItems(newVal); // checkList 子元素总数
fail: function (data) { this.notNullCount = countSelectedNotNull(newVal); // selected 不为 null 的个数
// 错误返回 },
} deep: true
}); }
}, },
// 处理单选变化 methods: {
handleSelectionChange(item) { navTo1() {
if (item.selected !== 'no') { lightAppJssdk.navigation.show({
this.$set(item, 'description', ''); url: '_shanghu_detail.html',
this.$set(item, 'photos', []); title: '高区应急扫描',
this.$set(item, 'deadlineDays', ''); isgoback: '0',
this.$set(item, 'deadlineDate', ''); success: function(data) {
} // 成功回调
}, },
// 文件上传处理 fail: function(data) {
handleFileUpload(file) { // 错误返回
console.log('上传文件:', file); }
// 此处可添加实际文件上传逻辑 });
}, },
// 整改天数确认 // 处理单选变化
handleDeadlineConfirm(value) { handleSelectionChange(item) {
const days = parseInt(value); if (item.selected !== 'no') {
const currentItem = this.currentItem; this.$set(item, 'description', '');
if (currentItem) { this.$set(item, 'photos', []);
currentItem.deadlineDays = days; this.$set(item, 'deadlineDays', '');
const deadlineDate = new Date(); this.$set(item, 'deadlineDate', '');
deadlineDate.setDate(deadlineDate.getDate() + days); }
currentItem.deadlineDate = this.formatDate(deadlineDate); },
} // 文件上传处理
this.showDeadlinePicker = false; handleFileUpload(file) {
}, console.log('上传文件:', file);
// 日期格式化 // 此处可添加实际文件上传逻辑
formatDate(date) { },
return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`; // 整改天数确认
} handleDeadlineConfirm(event, item) {
} console.log('select选择' , event.target.value)
}); const value = event.target.value;
</script> if (value) {
</div> const days = parseInt(value);
</body> item.deadlineDays = days;
const deadlineDate = new Date();
deadlineDate.setDate(deadlineDate.getDate() + days);
item.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>
</div>
</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