SwtTt29
/
Review2
1
0
Fork 0
Code Issues Pull Requests 1 Projects Releases Wiki Activity
Browse Source

省份可单独修改

Boss
徐飞洋 2 weeks ago
parent
8f7c674222
commit
bb8eea306d
1 changed files with 48 additions and 215 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 261
      supply.html

261
supply.html
View File

@ -2138,10 +2138,9 @@
<div id="currentRegion" style="margin-top: 10px; padding: 8px 12px; background-color: #f0f8ff; border: 1px solid #91d5ff; border-radius: 4px; font-size: 12px; color: #1890ff;">当前选择: 未选择</div>
</div>
<div class="select-body" style="height: 400px;">
<div id="regionOptionsList" style="display: flex; gap: 10px; padding: 10px; height: 100%;">
<!-- 省市选择将通过JavaScript动态生成 -->
<div id="provinceList" style="flex: 1; overflow-y: auto; height: 350px;"></div>
<div id="cityList" style="flex: 1; overflow-y: auto; height: 350px;"></div>
<div id="regionOptionsList" style="padding: 10px; height: 100%;">
<!-- 省份选择将通过JavaScript动态生成 -->
<div id="provinceList" style="overflow-y: auto; height: 350px;"></div>
</div>
</div>
<div class="select-footer" style="padding: 16px 20px; display: flex; justify-content: space-between; border-top: 1px solid #f0f0f0; background-color: #fafafa;">
@ -2579,10 +2578,9 @@
<div id="editCurrentRegion" style="margin-top: 10px; padding: 8px 12px; background-color: #f0f8ff; border: 1px solid #91d5ff; border-radius: 4px; font-size: 12px; color: #1890ff;">当前选择: 未选择</div>
</div>
<div class="select-body" style="height: 400px;">
<div id="editRegionOptionsList" style="display: flex; gap: 10px; padding: 10px; height: 100%;">
<!-- 省市选择将通过JavaScript动态生成 -->
<div id="editProvinceList" style="flex: 1; overflow-y: auto; height: 350px;"></div>
<div id="editCityList" style="flex: 1; overflow-y: auto; height: 350px;"></div>
<div id="editRegionOptionsList" style="padding: 10px; height: 100%;">
<!-- 省份选择将通过JavaScript动态生成 -->
<div id="editProvinceList" style="overflow-y: auto; height: 350px;"></div>
</div>
</div>
<div class="select-footer" style="padding: 16px 20px; display: flex; justify-content: space-between; border-top: 1px solid #f0f0f0; background-color: #fafafa;">
@ -5368,7 +5366,6 @@
// 生成地区选项
function generateRegionOptions() {
const provinceList = document.getElementById('provinceList');
const cityList = document.getElementById('cityList');
// 使用文档片段减少DOM重绘
const provinceFragment = document.createDocumentFragment();
@ -5382,13 +5379,12 @@
selectedProvince = province.province;
selectedCity = '';
updateRegionDisplay();
// 生成城市选项
generateCityOptions(province.cities);
// 直接滚动城市列表到顶部
const cityList = document.getElementById('cityList');
setTimeout(() => {
cityList.scrollTop = 0;
}, 100);
// 直接确认选择
const regionString = selectedProvince;
document.getElementById('regionDisplayText').textContent = regionString;
document.getElementById('regionValue').value = regionString;
hideRegionSelectModal();
saveFormData();
};
provinceFragment.appendChild(option);
});
@ -5399,48 +5395,6 @@
}
// 生成城市选项
function generateCityOptions(cities) {
const cityList = document.getElementById('cityList');
// 使用文档片段减少DOM重绘
const cityFragment = document.createDocumentFragment();
cities.forEach(city => {
const option = document.createElement('div');
option.className = 'select-item';
option.textContent = city.city;
option.onclick = () => {
selectedCity = city.city;
updateRegionDisplay();
};
option.ondblclick = () => {
// 双击城市直接确认整个地区选择
selectedCity = city.city;
updateRegionDisplay();
// 构建完整的地区字符串
const regionString = `${selectedProvince} ${selectedCity}`;
// 设置到表单
document.getElementById('regionDisplayText').textContent = regionString;
document.getElementById('regionValue').value = regionString;
// 隐藏弹窗
hideRegionSelectModal();
saveFormData(); // 保存选择
};
cityFragment.appendChild(option);
});
// 一次性添加到DOM，减少重绘
cityList.innerHTML = '';
cityList.appendChild(cityFragment);
// 使用scrollIntoView滚动到第一个城市
setTimeout(() => {
const firstCity = cityList.querySelector('.select-item');
if (firstCity) {
firstCity.scrollIntoView({ behavior: 'auto', block: 'start' });
}
}, 50);
}
@ -5448,9 +5402,7 @@
function updateRegionDisplay() {
const currentRegion = document.getElementById('currentRegion');
let displayText = '当前选择: ';
if (selectedProvince && selectedCity) {
displayText += `${selectedProvince} ${selectedCity}`;
} else if (selectedProvince) {
if (selectedProvince) {
displayText += selectedProvince;
} else {
displayText += '未选择';
@ -5458,7 +5410,7 @@
currentRegion.textContent = displayText;
}
// 过滤地区选项并自动填充
// 过滤地区选项
function filterRegionOptions() {
const searchInput = document.getElementById('regionSearchInput');
const searchKeyword = searchInput.value.toLowerCase();
@ -5467,68 +5419,20 @@
selectedProvince = '';
selectedCity = '';
// 先尝试直接查找城市
let foundCity = false;
for (let i = 0; i < allRegionOptions.length; i++) {
const province = allRegionOptions[i];
for (let j = 0; j < province.cities.length; j++) {
const city = province.cities[j];
if (city.city.toLowerCase().includes(searchKeyword)) {
// 找到匹配的城市，自动填充省市
selectedProvince = province.province;
selectedCity = city.city;
foundCity = true;
break;
}
}
if (foundCity) break;
}
if (foundCity) {
// 如果找到城市，只显示对应的省份
filteredProvinces = allRegionOptions.filter(province => province.province === selectedProvince);
generateRegionOptions();
// 自动生成城市选项并选择
const cityList = document.getElementById('cityList');
cityList.innerHTML = '';
const province = allRegionOptions.find(p => p.province === selectedProvince);
if (province) {
province.cities.forEach(city => {
const option = document.createElement('div');
option.className = 'select-item';
option.textContent = city.city;
if (city.city === selectedCity) {
option.classList.add('selected');
}
option.onclick = () => {
selectedCity = city.city;
updateRegionDisplay();
};
cityList.appendChild(option);
});
// 使用scrollIntoView滚动到第一个城市
setTimeout(() => {
const firstCity = cityList.querySelector('.select-item');
if (firstCity) {
firstCity.scrollIntoView({ behavior: 'auto', block: 'start' });
}
}, 50);
}
} else {
// 否则按原逻辑过滤
filteredProvinces = allRegionOptions.filter(province => {
return province.province.toLowerCase().includes(searchKeyword) ||
province.cities.some(city => city.city.toLowerCase().includes(searchKeyword));
});
if (!searchKeyword) {
// 如果搜索关键词为空，显示所有省份
filteredProvinces = [...allRegionOptions];
generateRegionOptions();
// 清空城市选项
const cityList = document.getElementById('cityList');
cityList.innerHTML = '';
updateRegionDisplay();
return;
}
// 只根据省份名称过滤
filteredProvinces = allRegionOptions.filter(province => {
return province.province.toLowerCase().includes(searchKeyword);
});
generateRegionOptions();
updateRegionDisplay();
}
@ -5537,13 +5441,9 @@
if (selectedProvince) {
const regionDisplayText = document.getElementById('regionDisplayText');
const regionValue = document.getElementById('regionValue');
let regionText = selectedProvince;
if (selectedCity) {
regionText = `${selectedProvince} ${selectedCity}`;
}
regionDisplayText.textContent = regionText;
regionValue.value = regionText;
saveFormData(); // 保存选择
regionDisplayText.textContent = selectedProvince;
regionValue.value = selectedProvince;
saveFormData();
}
hideRegionSelectModal();
}
@ -9428,8 +9328,6 @@
// 生成编辑地区选项
function generateEditRegionOptions() {
const provinceList = document.getElementById('editProvinceList');
const cityList = document.getElementById('editCityList');
// 生成省份选项
provinceList.innerHTML = '';
@ -9444,65 +9342,24 @@
editSelectedProvince = province.province;
editSelectedCity = '';
updateEditRegionDisplay();
// 生成城市选项
generateEditCityOptions(province.cities);
// 直接滚动城市列表到顶部
setTimeout(() => {
cityList.scrollTop = 0;
}, 100);
};
provinceList.appendChild(option);
});
}
// 生成编辑城市选项
function generateEditCityOptions(cities) {
const cityList = document.getElementById('editCityList');
cityList.innerHTML = '';
cities.forEach(city => {
const option = document.createElement('div');
option.className = 'select-item';
option.textContent = city.city;
if (city.city === editSelectedCity) {
option.classList.add('selected');
}
option.onclick = () => {
editSelectedCity = city.city;
updateEditRegionDisplay();
};
option.ondblclick = () => {
// 双击城市直接确认整个地区选择
editSelectedCity = city.city;
updateEditRegionDisplay();
// 构建完整的地区字符串
const regionString = `${editSelectedProvince} ${editSelectedCity}`;
// 设置到表单
// 直接确认选择
const regionString = editSelectedProvince;
document.getElementById('editRegionDisplayText').textContent = regionString;
document.getElementById('editRegionValue').value = regionString;
// 隐藏弹窗
hideEditRegionSelectModal();
saveFormData(); // 保存选择
saveFormData();
};
cityList.appendChild(option);
provinceList.appendChild(option);
});
// 使用scrollIntoView滚动到第一个城市
setTimeout(() => {
const firstCity = cityList.querySelector('.select-item');
if (firstCity) {
firstCity.scrollIntoView({ behavior: 'auto', block: 'start' });
}
}, 50);
}
// 生成编辑城市选项
// 更新编辑地区显示
function updateEditRegionDisplay() {
const currentRegion = document.getElementById('editCurrentRegion');
let displayText = '当前选择: ';
if (editSelectedProvince && editSelectedCity) {
displayText += `${editSelectedProvince} ${editSelectedCity}`;
} else if (editSelectedProvince) {
if (editSelectedProvince) {
displayText += editSelectedProvince;
} else {
displayText += '未选择';
@ -9529,13 +9386,7 @@
// 过滤省份
const filteredProvinces = allRegionOptions.filter(province => {
// 检查省份名称是否匹配
if (province.province.toLowerCase().includes(searchKeyword)) {
return true;
}
// 检查该省份下是否有匹配的城市
return province.cities.some(city => {
return city.city.toLowerCase().includes(searchKeyword);
});
return province.province.toLowerCase().includes(searchKeyword);
});
// 生成省份选项
@ -9552,46 +9403,28 @@
editSelectedProvince = province.province;
editSelectedCity = '';
updateEditRegionDisplay();
// 生成城市选项
generateEditCityOptions(province.cities);
// 直接滚动城市列表到顶部
setTimeout(() => {
document.getElementById('editCityList').scrollTop = 0;
}, 100);
// 直接确认选择
const regionString = editSelectedProvince;
document.getElementById('editRegionDisplayText').textContent = regionString;
document.getElementById('editRegionValue').value = regionString;
hideEditRegionSelectModal();
saveFormData();
};
provinceList.appendChild(option);
});
// 自动选择第一个匹配的省份和城市
if (filteredProvinces.length > 0) {
editSelectedProvince = filteredProvinces[0].province;
// 查找第一个匹配的城市
const matchedCity = filteredProvinces[0].cities.find(city =>
city.city.toLowerCase().includes(searchKeyword)
);
if (matchedCity) {
editSelectedCity = matchedCity.city;
}
updateEditRegionDisplay();
generateEditCityOptions(filteredProvinces[0].cities);
}
}
// 确认编辑地区选择
function confirmEditRegionSelection() {
if (editSelectedProvince && editSelectedCity) {
if (editSelectedProvince) {
const regionDisplayText = document.getElementById('editRegionDisplayText');
const regionValue = document.getElementById('editRegionValue');
let regionText = editSelectedProvince;
if (editSelectedCity) {
regionText = `${editSelectedProvince} ${editSelectedCity}`;
}
regionDisplayText.textContent = regionText;
regionValue.value = regionText;
saveFormData(); // 保存选择
regionDisplayText.textContent = editSelectedProvince;
regionValue.value = editSelectedProvince;
saveFormData();
hideEditRegionSelectModal();
} else {
alert('请选择完整的地区信息');
alert('请选择省份');
}
}

Write Preview
Loading…
Cancel
Save