|
@@ -19,55 +19,64 @@
|
|
|
</div>
|
|
</div>
|
|
|
<div class="price-info">
|
|
<div class="price-info">
|
|
|
<div class="info-title">施肥方式</div>
|
|
<div class="info-title">施肥方式</div>
|
|
|
- <div class="info-val">叶面肥</div>
|
|
|
|
|
|
|
+ <div class="info-val">{{ detailData?.usageMode }}</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="medicine-wrap">
|
|
<div class="medicine-wrap">
|
|
|
- <div class="medicine-box" v-for="(item) in 2" :key="item">
|
|
|
|
|
- <div class="item-title">肥药{{ item }}</div>
|
|
|
|
|
- <div class="box-wrap">
|
|
|
|
|
- <div class="medicine-item">
|
|
|
|
|
- <div class="item-name">肥药名称</div>
|
|
|
|
|
- <div class="item-val">乙烯利</div>
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="medicine-item">
|
|
|
|
|
- <div class="item-name">肥药品牌</div>
|
|
|
|
|
- <div class="item-val">
|
|
|
|
|
- <el-select
|
|
|
|
|
- class="select-item"
|
|
|
|
|
- v-model="brandVal"
|
|
|
|
|
- placeholder="肥药品牌"
|
|
|
|
|
- style="width: 132px"
|
|
|
|
|
- >
|
|
|
|
|
- <el-option
|
|
|
|
|
- v-for="(item, index) in brandList"
|
|
|
|
|
- :key="index"
|
|
|
|
|
- :label="item.name"
|
|
|
|
|
- :value="item.value"
|
|
|
|
|
|
|
+ <template v-for="(prescription, pIndex) in detailData?.prescriptionList" :key="pIndex">
|
|
|
|
|
+ <div class="medicine-box" v-for="(pesticide, mIndex) in prescription.pesticideFertilizerList" :key="mIndex">
|
|
|
|
|
+ <div class="item-title">肥药{{ mIndex + 1 }}</div>
|
|
|
|
|
+ <div class="box-wrap">
|
|
|
|
|
+ <div class="medicine-item">
|
|
|
|
|
+ <div class="item-name">肥药名称</div>
|
|
|
|
|
+ <div class="item-val">{{ pesticide.pesticideFertilizerName }}</div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="medicine-item">
|
|
|
|
|
+ <div class="item-name">肥药品牌</div>
|
|
|
|
|
+ <div class="item-val">
|
|
|
|
|
+ <el-input v-model="pesticide.brand" placeholder="肥药品牌" style="width: 132px" />
|
|
|
|
|
+ <!-- <el-select
|
|
|
|
|
+ class="select-item"
|
|
|
|
|
+ v-model="pesticide.brand"
|
|
|
|
|
+ placeholder="肥药品牌"
|
|
|
|
|
+ style="width: 132px"
|
|
|
|
|
+ >
|
|
|
|
|
+ <el-option
|
|
|
|
|
+ v-for="(brand, bIndex) in brandList"
|
|
|
|
|
+ :key="bIndex"
|
|
|
|
|
+ :label="brand.name"
|
|
|
|
|
+ :value="brand.value"
|
|
|
|
|
+ />
|
|
|
|
|
+ </el-select> -->
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="medicine-item mt-8">
|
|
|
|
|
+ <div class="item-name">肥药单价</div>
|
|
|
|
|
+ <div class="item-val">
|
|
|
|
|
+ <el-input-number
|
|
|
|
|
+ style="width: 132px"
|
|
|
|
|
+ v-model="pesticide.price"
|
|
|
|
|
+ :min="0"
|
|
|
|
|
+ :precision="2"
|
|
|
/>
|
|
/>
|
|
|
- </el-select>
|
|
|
|
|
|
|
+ <!-- <span class="price-unit">元/{{ pesticide.unit }}</span> -->
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
- <div class="medicine-item mt-8">
|
|
|
|
|
- <div class="item-name">肥药单价</div>
|
|
|
|
|
- <div class="item-val">
|
|
|
|
|
- <el-input-number style="width: 132px" v-model="priceVal" :min="1" />
|
|
|
|
|
|
|
+ <div class="medicine-item">
|
|
|
|
|
+ <div class="item-name">单亩用量</div>
|
|
|
|
|
+ <div class="item-val">{{ pesticide.muUsage }}{{ pesticide.unit }}</div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="medicine-item">
|
|
|
|
|
+ <div class="item-name">亩数</div>
|
|
|
|
|
+ <div class="item-val">{{ detailData?.area }}亩</div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="medicine-item">
|
|
|
|
|
+ <div class="item-total">总计:</div>
|
|
|
|
|
+ <div class="item-price">{{ getPesticideTotal(pesticide) }}<span class="item-unit">元</span></div>
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
- <div class="medicine-item">
|
|
|
|
|
- <div class="item-name">单亩用量</div>
|
|
|
|
|
- <div class="item-val">500斤</div>
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="medicine-item">
|
|
|
|
|
- <div class="item-name">亩数</div>
|
|
|
|
|
- <div class="item-val">50亩</div>
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="medicine-item">
|
|
|
|
|
- <div class="item-total">总计:</div>
|
|
|
|
|
- <div class="item-price">1582<span class="item-unit">元</span></div>
|
|
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
|
|
+ </template>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="service-wrap">
|
|
<div class="service-wrap">
|
|
|
<div class="medicine-box">
|
|
<div class="medicine-box">
|
|
@@ -94,16 +103,22 @@
|
|
|
<div class="medicine-item mt-8">
|
|
<div class="medicine-item mt-8">
|
|
|
<div class="item-name">亩单价</div>
|
|
<div class="item-name">亩单价</div>
|
|
|
<div class="item-val">
|
|
<div class="item-val">
|
|
|
- <el-input-number style="width: 132px" v-model="priceVal" :min="1" />
|
|
|
|
|
|
|
+ <el-input-number
|
|
|
|
|
+ style="width: 132px"
|
|
|
|
|
+ v-model="servicePricePerMu"
|
|
|
|
|
+ :min="0"
|
|
|
|
|
+ :precision="2"
|
|
|
|
|
+ />
|
|
|
|
|
+ <!-- <span class="price-unit">元/亩</span> -->
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="medicine-item">
|
|
<div class="medicine-item">
|
|
|
<div class="item-name">亩数</div>
|
|
<div class="item-name">亩数</div>
|
|
|
- <div class="item-val">50亩</div>
|
|
|
|
|
|
|
+ <div class="item-val">{{ detailData?.area }}亩</div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="medicine-item">
|
|
<div class="medicine-item">
|
|
|
<div class="item-total">总计:</div>
|
|
<div class="item-total">总计:</div>
|
|
|
- <div class="item-price">1582<span class="item-unit">元</span></div>
|
|
|
|
|
|
|
+ <div class="item-price">{{ getServiceTotal() }}<span class="item-unit">元</span></div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
@@ -111,31 +126,133 @@
|
|
|
</div>
|
|
</div>
|
|
|
<div class="bottom-btn">
|
|
<div class="bottom-btn">
|
|
|
<div class="bottom-l">
|
|
<div class="bottom-l">
|
|
|
- 合计:<span class="main-val">1258</span>元
|
|
|
|
|
|
|
+ 合计:<span class="main-val">{{ getTotalCost() }}</span>元
|
|
|
</div>
|
|
</div>
|
|
|
- <div class="bottom-r">确认报价</div>
|
|
|
|
|
|
|
+ <div class="bottom-r" @click="confirmPrice">确认报价</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
|
import customHeader from "@/components/customHeader.vue";
|
|
import customHeader from "@/components/customHeader.vue";
|
|
|
-import { ref } from "vue";
|
|
|
|
|
-const executeDate = ref(null);
|
|
|
|
|
|
|
+import { ElMessage } from "element-plus";
|
|
|
|
|
+import { ref, onMounted } from "vue";
|
|
|
|
|
+import { useRoute, useRouter } from "vue-router";
|
|
|
|
|
|
|
|
-const brandVal = ref(null)
|
|
|
|
|
-const brandList = ref([
|
|
|
|
|
- {name: "国光", value: "国光"},
|
|
|
|
|
- {name: "国光1", value: "国光1"},
|
|
|
|
|
- {name: "国光2", value: "国光2"},
|
|
|
|
|
-])
|
|
|
|
|
|
|
+const router = useRouter();
|
|
|
|
|
+const executeDate = ref(null);
|
|
|
|
|
+const query = useRoute().query;
|
|
|
|
|
+const detailData = ref(JSON.parse(query.data));
|
|
|
|
|
+const priceData = ref({});
|
|
|
|
|
|
|
|
-const priceVal = ref(null)
|
|
|
|
|
-const modeVal = ref(null)
|
|
|
|
|
|
|
+const servicePricePerMu = ref(0);
|
|
|
|
|
+const modeVal = ref(null);
|
|
|
const modeList = ref([
|
|
const modeList = ref([
|
|
|
- {name: "无人机", value: "无人机"},
|
|
|
|
|
- {name: "人工", value: "人工"},
|
|
|
|
|
|
|
+ {name: "无人机", value: 1},
|
|
|
|
|
+ {name: "人工", value: 2},
|
|
|
])
|
|
])
|
|
|
|
|
+
|
|
|
|
|
+// 初始化数据
|
|
|
|
|
+onMounted(() => {
|
|
|
|
|
+ console.log("query", query);
|
|
|
|
|
+ executeDate.value = detailData.value.executeDate;
|
|
|
|
|
+ priceData.value = JSON.parse(query?.priceData || '{}');
|
|
|
|
|
+
|
|
|
|
|
+ // 从 priceData 中匹配价格和品牌到对应的药肥
|
|
|
|
|
+ if (priceData.value.itemsList && detailData.value.prescriptionList) {
|
|
|
|
|
+ detailData.value.prescriptionList.forEach(prescription => {
|
|
|
|
|
+ if (prescription.pesticideFertilizerList) {
|
|
|
|
|
+ prescription.pesticideFertilizerList.forEach(pesticide => {
|
|
|
|
|
+ const priceItem = priceData.value.itemsList.find(
|
|
|
|
|
+ item => item.pesticideFertilizerId === pesticide.pesticideFertilizerId
|
|
|
|
|
+ );
|
|
|
|
|
+ if (priceItem) {
|
|
|
|
|
+ pesticide.price = priceItem.price || 0;
|
|
|
|
|
+ pesticide.brand = priceItem.brand || '';
|
|
|
|
|
+ } else {
|
|
|
|
|
+ pesticide.price = 0;
|
|
|
|
|
+ pesticide.brand = '';
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 初始化服务费用
|
|
|
|
|
+ if (priceData.value.farmWorkServiceCost && detailData.value.area) {
|
|
|
|
|
+ servicePricePerMu.value = Number((priceData.value.farmWorkServiceCost / detailData.value.area).toFixed(2));
|
|
|
|
|
+ }
|
|
|
|
|
+});
|
|
|
|
|
+
|
|
|
|
|
+// 计算单个药肥的总计:单价 * 单亩用量 * 亩数
|
|
|
|
|
+const getPesticideTotal = (pesticide) => {
|
|
|
|
|
+ if (!pesticide.price || !pesticide.muUsage || !detailData.value.area) return '0.00';
|
|
|
|
|
+ const total = (pesticide.price * pesticide.muUsage * detailData.value.area).toFixed(2);
|
|
|
|
|
+ return total;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 计算服务费用总计:亩单价 * 亩数
|
|
|
|
|
+const getServiceTotal = () => {
|
|
|
|
|
+ if (!servicePricePerMu.value || !detailData.value.area) return '0.00';
|
|
|
|
|
+ const total = (servicePricePerMu.value * detailData.value.area).toFixed(2);
|
|
|
|
|
+ return total;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 计算总合计:所有药肥总计 + 服务费用总计
|
|
|
|
|
+const getTotalCost = () => {
|
|
|
|
|
+ let pesticideTotal = 0;
|
|
|
|
|
+ if (detailData.value.prescriptionList) {
|
|
|
|
|
+ detailData.value.prescriptionList.forEach(prescription => {
|
|
|
|
|
+ if (prescription.pesticideFertilizerList) {
|
|
|
|
|
+ prescription.pesticideFertilizerList.forEach(pesticide => {
|
|
|
|
|
+ if (pesticide.price && pesticide.muUsage && detailData.value.area) {
|
|
|
|
|
+ pesticideTotal += pesticide.price * pesticide.muUsage * detailData.value.area;
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ const serviceTotal = servicePricePerMu.value && detailData.value.area
|
|
|
|
|
+ ? servicePricePerMu.value * detailData.value.area
|
|
|
|
|
+ : 0;
|
|
|
|
|
+
|
|
|
|
|
+ return (pesticideTotal + serviceTotal).toFixed(2);
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+const confirmPrice = () => {
|
|
|
|
|
+ if (!modeVal.value) {
|
|
|
|
|
+ ElMessage.error("请选择执行方式");
|
|
|
|
|
+ return;
|
|
|
|
|
+ }
|
|
|
|
|
+ const pesticideFertilizerQuoteList = [];
|
|
|
|
|
+ if (detailData.value?.prescriptionList) {
|
|
|
|
|
+ detailData.value.prescriptionList.forEach(prescription => {
|
|
|
|
|
+ (prescription.pesticideFertilizerList || []).forEach(pesticide => {
|
|
|
|
|
+ pesticideFertilizerQuoteList.push({
|
|
|
|
|
+ pesticideFertilizerId: pesticide.pesticideFertilizerId,
|
|
|
|
|
+ price: Number(pesticide.price || 0),
|
|
|
|
|
+ brand: pesticide.brand || ''
|
|
|
|
|
+ });
|
|
|
|
|
+ })
|
|
|
|
|
+ })
|
|
|
|
|
+ }
|
|
|
|
|
+ const payload = {
|
|
|
|
|
+ farmWorkRecordId: detailData.value?.id,
|
|
|
|
|
+ pesticideFertilizerQuoteList,
|
|
|
|
|
+ servicePrice: servicePricePerMu.value,
|
|
|
|
|
+ executionMethod: modeVal.value,
|
|
|
|
|
+ };
|
|
|
|
|
+ console.log('confirmPrice payload =>', payload);
|
|
|
|
|
+ VE_API.z_farm_work_record.acceptFarmWorkRecord(payload).then(({ data }) => {
|
|
|
|
|
+ if (data) {
|
|
|
|
|
+ ElMessage.success("确认报价成功");
|
|
|
|
|
+ router.push({
|
|
|
|
|
+ path: "/home",
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+}
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
@@ -154,8 +271,13 @@ const modeList = ref([
|
|
|
.el-input__wrapper, .el-select__wrapper {
|
|
.el-input__wrapper, .el-select__wrapper {
|
|
|
box-shadow: 0 0 0 1px rgba(33, 153, 248, 0.3) inset;
|
|
box-shadow: 0 0 0 1px rgba(33, 153, 248, 0.3) inset;
|
|
|
}
|
|
}
|
|
|
- .el-input__inner, .el-select__placeholder {
|
|
|
|
|
|
|
+ .el-input__inner {
|
|
|
color: #2199f8;
|
|
color: #2199f8;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ }
|
|
|
|
|
+ .el-select__placeholder {
|
|
|
|
|
+ color: rgba(33, 153, 248, 0.6);
|
|
|
|
|
+ text-align: center;
|
|
|
}
|
|
}
|
|
|
.el-input__prefix {
|
|
.el-input__prefix {
|
|
|
color: #2199f8;
|
|
color: #2199f8;
|
|
@@ -164,7 +286,7 @@ const modeList = ref([
|
|
|
color: #2199f8;
|
|
color: #2199f8;
|
|
|
}
|
|
}
|
|
|
.el-input {
|
|
.el-input {
|
|
|
- --el-input-placeholder-color: #2199f8;
|
|
|
|
|
|
|
+ --el-input-placeholder-color: rgba(33, 153, 248, 0.6);
|
|
|
}
|
|
}
|
|
|
.el-input-number__decrease, .el-input-number__increase {
|
|
.el-input-number__decrease, .el-input-number__increase {
|
|
|
display: none;
|
|
display: none;
|
|
@@ -216,6 +338,15 @@ const modeList = ref([
|
|
|
min-width: 142px;
|
|
min-width: 142px;
|
|
|
text-align: center;
|
|
text-align: center;
|
|
|
color: #474747;
|
|
color: #474747;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ justify-content: center;
|
|
|
|
|
+ gap: 4px;
|
|
|
|
|
+ .price-unit {
|
|
|
|
|
+ font-size: 12px;
|
|
|
|
|
+ color: rgba(0, 0, 0, 0.4);
|
|
|
|
|
+ white-space: nowrap;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
.item-total {
|
|
.item-total {
|
|
|
font-size: 16px;
|
|
font-size: 16px;
|