|
@@ -59,13 +59,19 @@
|
|
|
</div>
|
|
</div>
|
|
|
<div class="create-btn">
|
|
<div class="create-btn">
|
|
|
<div class="btn-item sencond-btn" @click="resetForm(ruleFormRef)">{{ t('取消') }}</div>
|
|
<div class="btn-item sencond-btn" @click="resetForm(ruleFormRef)">{{ t('取消') }}</div>
|
|
|
- <div class="btn-item primary-btn" @click="submitForm(ruleFormRef)">
|
|
|
|
|
|
|
+ <div
|
|
|
|
|
+ class="btn-item primary-btn"
|
|
|
|
|
+ :class="{ 'is-disabled': isSubmitting }"
|
|
|
|
|
+ @click="submitForm(ruleFormRef)"
|
|
|
|
|
+ >
|
|
|
{{
|
|
{{
|
|
|
- paramsType === "client"
|
|
|
|
|
- ? "添加"
|
|
|
|
|
- : paramsType === "edit"
|
|
|
|
|
- ? "确认修改"
|
|
|
|
|
- : "立即创建"
|
|
|
|
|
|
|
+ isSubmitting
|
|
|
|
|
+ ? t('提交中...')
|
|
|
|
|
+ : paramsType === "client"
|
|
|
|
|
+ ? "添加"
|
|
|
|
|
+ : paramsType === "edit"
|
|
|
|
|
+ ? "确认修改"
|
|
|
|
|
+ : "立即创建"
|
|
|
}}
|
|
}}
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
@@ -165,6 +171,9 @@ const isFromEditMap = ref(false);
|
|
|
// 标记用户是否手动修改过农场名称
|
|
// 标记用户是否手动修改过农场名称
|
|
|
const isFarmNameManuallyModified = ref(false);
|
|
const isFarmNameManuallyModified = ref(false);
|
|
|
|
|
|
|
|
|
|
+/** 创建/提交接口请求中,防止重复点击 */
|
|
|
|
|
+const isSubmitting = ref(false);
|
|
|
|
|
+
|
|
|
/**
|
|
/**
|
|
|
* 根据中心点和亩数生成正方形地块WKT
|
|
* 根据中心点和亩数生成正方形地块WKT
|
|
|
* @param {Array} center - 中心点坐标 [lng, lat]
|
|
* @param {Array} center - 中心点坐标 [lng, lat]
|
|
@@ -226,25 +235,43 @@ onMounted(() => {
|
|
|
|
|
|
|
|
const polygonArr = ref(null);
|
|
const polygonArr = ref(null);
|
|
|
const paramsType = ref(null);
|
|
const paramsType = ref(null);
|
|
|
|
|
+
|
|
|
|
|
+/** 全新创建:带 isReload,且非编辑/小程序回流 */
|
|
|
|
|
+function isCreateFarmFullReload() {
|
|
|
|
|
+ return (
|
|
|
|
|
+ route.query.isReload &&
|
|
|
|
|
+ route.query.type !== "edit" &&
|
|
|
|
|
+ !route.query.miniJson
|
|
|
|
|
+ );
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
onActivated(() => {
|
|
onActivated(() => {
|
|
|
- const centerPointVal = sessionStorage.getItem('centerPoint') ? JSON.parse(sessionStorage.getItem('centerPoint')) : null;
|
|
|
|
|
paramsType.value = route.query.type;
|
|
paramsType.value = route.query.type;
|
|
|
|
|
|
|
|
- centerPoint.value = centerPointVal || store.state.home.miniUserLocationPoint;
|
|
|
|
|
- const arr = convertPointToArray(centerPoint.value);
|
|
|
|
|
- getLocationName(`${arr[1]},${arr[0]}`);
|
|
|
|
|
- // 仅在携带 isReload 标记、且不是编辑/小程序回流场景时,认为是一次全新创建,重置表单和地块,
|
|
|
|
|
- // 避免破坏原有自动生成农场名称等逻辑
|
|
|
|
|
- if (route.query.isReload && paramsType.value !== "edit" && !route.query.miniJson) {
|
|
|
|
|
- // 重置表单字段到初始值
|
|
|
|
|
- ruleFormRef.value && ruleFormRef.value.resetFields();
|
|
|
|
|
- // 重置与地块绘制相关的内部状态
|
|
|
|
|
|
|
+ if (isCreateFarmFullReload()) {
|
|
|
|
|
+ // 先清缓存与位置状态,避免沿用上次搜索的 centerPoint / 地址
|
|
|
|
|
+ sessionStorage.removeItem("centerPoint");
|
|
|
|
|
+ centerPoint.value = store.state.home.miniUserLocationPoint;
|
|
|
|
|
+ locationVal.value = null;
|
|
|
|
|
+ locationOptions.list = [];
|
|
|
|
|
+ pointAddress.value = null;
|
|
|
|
|
+ farmCity.value = null;
|
|
|
polygonArr.value = null;
|
|
polygonArr.value = null;
|
|
|
isFromEditMap.value = false;
|
|
isFromEditMap.value = false;
|
|
|
- // 重置农场名称手动修改标记,允许自动生成农场名称
|
|
|
|
|
isFarmNameManuallyModified.value = false;
|
|
isFarmNameManuallyModified.value = false;
|
|
|
- // 清空上一次地块缓存
|
|
|
|
|
|
|
+ ruleForm.farm_address = "";
|
|
|
|
|
+ ruleForm.farm_area = "";
|
|
|
|
|
+ ruleForm.farm_name = "";
|
|
|
|
|
+ ruleFormRef.value?.resetFields();
|
|
|
store.commit("home/SET_FARM_POLYGON", null);
|
|
store.commit("home/SET_FARM_POLYGON", null);
|
|
|
|
|
+ isSubmitting.value = false;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ const centerPointVal = sessionStorage.getItem("centerPoint")
|
|
|
|
|
+ ? JSON.parse(sessionStorage.getItem("centerPoint"))
|
|
|
|
|
+ : null;
|
|
|
|
|
+ centerPoint.value = centerPointVal || store.state.home.miniUserLocationPoint;
|
|
|
|
|
+ const arr = convertPointToArray(centerPoint.value);
|
|
|
|
|
+ getLocationName(`${arr[1]},${arr[0]}`);
|
|
|
}
|
|
}
|
|
|
// 确保地图已初始化,使用 nextTick 等待 DOM 更新
|
|
// 确保地图已初始化,使用 nextTick 等待 DOM 更新
|
|
|
nextTick(() => {
|
|
nextTick(() => {
|
|
@@ -273,7 +300,7 @@ onDeactivated(() => {
|
|
|
|
|
|
|
|
// 处理地图更新的逻辑
|
|
// 处理地图更新的逻辑
|
|
|
function handleMapUpdate() {
|
|
function handleMapUpdate() {
|
|
|
- if (route.query.isReload) {
|
|
|
|
|
|
|
+ if (isCreateFarmFullReload()) {
|
|
|
// 清除旧的地块数据
|
|
// 清除旧的地块数据
|
|
|
store.commit("home/SET_FARM_POLYGON", null);
|
|
store.commit("home/SET_FARM_POLYGON", null);
|
|
|
isFromEditMap.value = false; // 从home进入,可以手动输入
|
|
isFromEditMap.value = false; // 从home进入,可以手动输入
|
|
@@ -425,50 +452,47 @@ const rules = reactive({
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
const submitForm = (formEl) => {
|
|
const submitForm = (formEl) => {
|
|
|
- if (!formEl) return;
|
|
|
|
|
|
|
+ if (!formEl || isSubmitting.value) return;
|
|
|
formEl.validate((valid) => {
|
|
formEl.validate((valid) => {
|
|
|
- if (valid) {
|
|
|
|
|
- const cropItems = parseSelectedCropItems();
|
|
|
|
|
- if (!cropItems) {
|
|
|
|
|
- ElMessage.warning({ message: t('请先点击「种植作物」选择作物品类'), type: 'warning' });
|
|
|
|
|
- return;
|
|
|
|
|
- }
|
|
|
|
|
- const params = {
|
|
|
|
|
- ...ruleForm,
|
|
|
|
|
- farm_location: centerPoint.value,
|
|
|
|
|
- farm_variety: cropItems.map((item) => item.variety_code).join(","),
|
|
|
|
|
- farm_category: cropItems.map((item) => item.categorycode).join(","),
|
|
|
|
|
- // 编辑时geom不是数组,新增时是数组
|
|
|
|
|
- // geom:
|
|
|
|
|
- // route.query.type === "edit"
|
|
|
|
|
- // ? polygonArr.value && polygonArr.value.length > 0
|
|
|
|
|
- // ? polygonArr.value[0]
|
|
|
|
|
- // : null
|
|
|
|
|
- // : polygonArr.value,
|
|
|
|
|
- };
|
|
|
|
|
|
|
+ if (!valid) return;
|
|
|
|
|
+ const cropItems = parseSelectedCropItems();
|
|
|
|
|
+ if (!cropItems) {
|
|
|
|
|
+ ElMessage.warning({ message: t('请先点击「种植作物」选择作物品类'), type: 'warning' });
|
|
|
|
|
+ return;
|
|
|
|
|
+ }
|
|
|
|
|
+ const params = {
|
|
|
|
|
+ ...ruleForm,
|
|
|
|
|
+ farm_location: centerPoint.value,
|
|
|
|
|
+ varieties: cropItems.map(
|
|
|
|
|
+ (item) => `${item.variety_code}-${item.categorycode}`,
|
|
|
|
|
+ ),
|
|
|
|
|
+ farm_polygon:
|
|
|
|
|
+ polygonArr.value && polygonArr.value.length > 0
|
|
|
|
|
+ ? polygonArr.value[0]
|
|
|
|
|
+ : null,
|
|
|
|
|
+ };
|
|
|
|
|
|
|
|
- // 如果是编辑模式,添加农场ID
|
|
|
|
|
- if (route.query.type === "edit" && route.query.farmId) {
|
|
|
|
|
- params.id = route.query.farmId;
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ if (route.query.type === "edit" && route.query.farmId) {
|
|
|
|
|
+ params.id = route.query.farmId;
|
|
|
|
|
+ }
|
|
|
|
|
|
|
|
- if (route.query.type !== "edit") {
|
|
|
|
|
- // 处理 geom 参数,如果是数组需要序列化
|
|
|
|
|
- const queryParams = {
|
|
|
|
|
- ...params,
|
|
|
|
|
- };
|
|
|
|
|
- // 如果 geom 是数组,需要序列化为 JSON 字符串
|
|
|
|
|
- if (Array.isArray(queryParams.geom)) {
|
|
|
|
|
- queryParams.geom = JSON.stringify(queryParams.geom);
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ if (route.query.type !== "edit") {
|
|
|
|
|
+ const queryParams = { ...params };
|
|
|
|
|
+ if (Array.isArray(queryParams.geom)) {
|
|
|
|
|
+ queryParams.geom = JSON.stringify(queryParams.geom);
|
|
|
|
|
+ }
|
|
|
|
|
|
|
|
- VE_API.farm.createFarm(queryParams).then(({ data, code }) => {
|
|
|
|
|
|
|
+ isSubmitting.value = true;
|
|
|
|
|
+ VE_API.farm.createFarm(queryParams)
|
|
|
|
|
+ .then(({ code }) => {
|
|
|
if (code === 200) {
|
|
if (code === 200) {
|
|
|
- showPlantingReportPopup.value = true;
|
|
|
|
|
|
|
+ showPlantingReportPopup.value = true;
|
|
|
sessionStorage.removeItem(SESSION_SELECT_CROP_KEY);
|
|
sessionStorage.removeItem(SESSION_SELECT_CROP_KEY);
|
|
|
}
|
|
}
|
|
|
|
|
+ })
|
|
|
|
|
+ .finally(() => {
|
|
|
|
|
+ isSubmitting.value = false;
|
|
|
});
|
|
});
|
|
|
- }
|
|
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
|
};
|
|
};
|
|
@@ -596,8 +620,8 @@ function handleFarmNameInput() {
|
|
|
|
|
|
|
|
// 根据地址更新农场名称(如果满足条件)
|
|
// 根据地址更新农场名称(如果满足条件)
|
|
|
function updateFarmNameIfNeeded() {
|
|
function updateFarmNameIfNeeded() {
|
|
|
- // 只有在创建模式下且用户没有手动修改过农场名称时,才自动更新农场名称
|
|
|
|
|
- if (route.query.type !== "edit" && !isFarmNameManuallyModified.value && farmCity.value && !ruleForm.farm_name) {
|
|
|
|
|
|
|
+ // 创建模式且未手动改过名称时,地址变化后同步更新(含已有自动名称的场景)
|
|
|
|
|
+ if (route.query.type !== "edit" && !isFarmNameManuallyModified.value && farmCity.value) {
|
|
|
ruleForm.farm_name = farmCity.value + "农场";
|
|
ruleForm.farm_name = farmCity.value + "农场";
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
@@ -944,6 +968,11 @@ function handleMianjiInput(value) {
|
|
|
&.primary-btn {
|
|
&.primary-btn {
|
|
|
background: linear-gradient(180deg, #76c3ff, #2199f8);
|
|
background: linear-gradient(180deg, #76c3ff, #2199f8);
|
|
|
color: #fff;
|
|
color: #fff;
|
|
|
|
|
+
|
|
|
|
|
+ &.is-disabled {
|
|
|
|
|
+ opacity: 0.6;
|
|
|
|
|
+ pointer-events: none;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|