农产品种植管理(种子种苗监管、肥料使用监管)页面功能开发
This commit is contained in:
parent
504dbdcd0d
commit
421b8db946
75
sub-government-affairs-service/auto-imports.d.ts
vendored
Normal file
75
sub-government-affairs-service/auto-imports.d.ts
vendored
Normal file
@ -0,0 +1,75 @@
|
|||||||
|
/* eslint-disable */
|
||||||
|
/* prettier-ignore */
|
||||||
|
// @ts-nocheck
|
||||||
|
// noinspection JSUnusedGlobalSymbols
|
||||||
|
// Generated by unplugin-auto-import
|
||||||
|
export {}
|
||||||
|
declare global {
|
||||||
|
const EffectScope: typeof import('vue')['EffectScope']
|
||||||
|
const computed: typeof import('vue')['computed']
|
||||||
|
const createApp: typeof import('vue')['createApp']
|
||||||
|
const customRef: typeof import('vue')['customRef']
|
||||||
|
const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
|
||||||
|
const defineComponent: typeof import('vue')['defineComponent']
|
||||||
|
const effectScope: typeof import('vue')['effectScope']
|
||||||
|
const getCurrentInstance: typeof import('vue')['getCurrentInstance']
|
||||||
|
const getCurrentScope: typeof import('vue')['getCurrentScope']
|
||||||
|
const h: typeof import('vue')['h']
|
||||||
|
const inject: typeof import('vue')['inject']
|
||||||
|
const isProxy: typeof import('vue')['isProxy']
|
||||||
|
const isReactive: typeof import('vue')['isReactive']
|
||||||
|
const isReadonly: typeof import('vue')['isReadonly']
|
||||||
|
const isRef: typeof import('vue')['isRef']
|
||||||
|
const markRaw: typeof import('vue')['markRaw']
|
||||||
|
const nextTick: typeof import('vue')['nextTick']
|
||||||
|
const onActivated: typeof import('vue')['onActivated']
|
||||||
|
const onBeforeMount: typeof import('vue')['onBeforeMount']
|
||||||
|
const onBeforeRouteLeave: typeof import('vue-router')['onBeforeRouteLeave']
|
||||||
|
const onBeforeRouteUpdate: typeof import('vue-router')['onBeforeRouteUpdate']
|
||||||
|
const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
|
||||||
|
const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
|
||||||
|
const onDeactivated: typeof import('vue')['onDeactivated']
|
||||||
|
const onErrorCaptured: typeof import('vue')['onErrorCaptured']
|
||||||
|
const onMounted: typeof import('vue')['onMounted']
|
||||||
|
const onRenderTracked: typeof import('vue')['onRenderTracked']
|
||||||
|
const onRenderTriggered: typeof import('vue')['onRenderTriggered']
|
||||||
|
const onScopeDispose: typeof import('vue')['onScopeDispose']
|
||||||
|
const onServerPrefetch: typeof import('vue')['onServerPrefetch']
|
||||||
|
const onUnmounted: typeof import('vue')['onUnmounted']
|
||||||
|
const onUpdated: typeof import('vue')['onUpdated']
|
||||||
|
const onWatcherCleanup: typeof import('vue')['onWatcherCleanup']
|
||||||
|
const provide: typeof import('vue')['provide']
|
||||||
|
const reactive: typeof import('vue')['reactive']
|
||||||
|
const readonly: typeof import('vue')['readonly']
|
||||||
|
const ref: typeof import('vue')['ref']
|
||||||
|
const resolveComponent: typeof import('vue')['resolveComponent']
|
||||||
|
const shallowReactive: typeof import('vue')['shallowReactive']
|
||||||
|
const shallowReadonly: typeof import('vue')['shallowReadonly']
|
||||||
|
const shallowRef: typeof import('vue')['shallowRef']
|
||||||
|
const toRaw: typeof import('vue')['toRaw']
|
||||||
|
const toRef: typeof import('vue')['toRef']
|
||||||
|
const toRefs: typeof import('vue')['toRefs']
|
||||||
|
const toValue: typeof import('vue')['toValue']
|
||||||
|
const triggerRef: typeof import('vue')['triggerRef']
|
||||||
|
const unref: typeof import('vue')['unref']
|
||||||
|
const useAttrs: typeof import('vue')['useAttrs']
|
||||||
|
const useCssModule: typeof import('vue')['useCssModule']
|
||||||
|
const useCssVars: typeof import('vue')['useCssVars']
|
||||||
|
const useId: typeof import('vue')['useId']
|
||||||
|
const useLink: typeof import('vue-router')['useLink']
|
||||||
|
const useModel: typeof import('vue')['useModel']
|
||||||
|
const useRoute: typeof import('vue-router')['useRoute']
|
||||||
|
const useRouter: typeof import('vue-router')['useRouter']
|
||||||
|
const useSlots: typeof import('vue')['useSlots']
|
||||||
|
const useTemplateRef: typeof import('vue')['useTemplateRef']
|
||||||
|
const watch: typeof import('vue')['watch']
|
||||||
|
const watchEffect: typeof import('vue')['watchEffect']
|
||||||
|
const watchPostEffect: typeof import('vue')['watchPostEffect']
|
||||||
|
const watchSyncEffect: typeof import('vue')['watchSyncEffect']
|
||||||
|
}
|
||||||
|
// for type re-export
|
||||||
|
declare global {
|
||||||
|
// @ts-ignore
|
||||||
|
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
|
||||||
|
import('vue')
|
||||||
|
}
|
@ -11,6 +11,7 @@ declare module 'vue' {
|
|||||||
AreaSelect: typeof import('./src/components/AreaSelect/index.vue')['default']
|
AreaSelect: typeof import('./src/components/AreaSelect/index.vue')['default']
|
||||||
CodeDialog: typeof import('./src/components/code-dialog/index.vue')['default']
|
CodeDialog: typeof import('./src/components/code-dialog/index.vue')['default']
|
||||||
FileUploader: typeof import('./src/components/FileUploader/index.vue')['default']
|
FileUploader: typeof import('./src/components/FileUploader/index.vue')['default']
|
||||||
|
LandSelect: typeof import('./src/components/LandSelect.vue')['default']
|
||||||
RouterLink: typeof import('vue-router')['RouterLink']
|
RouterLink: typeof import('vue-router')['RouterLink']
|
||||||
RouterView: typeof import('vue-router')['RouterView']
|
RouterView: typeof import('vue-router')['RouterView']
|
||||||
TableComponent: typeof import('./src/components/tableComponent.vue')['default']
|
TableComponent: typeof import('./src/components/tableComponent.vue')['default']
|
||||||
|
@ -26,8 +26,8 @@ export function delSeedUseRegulatory(ids) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* 获取详情-通用,传入url和参数 */
|
/* 获取详情-通用,传入url和参数 */
|
||||||
export function getRowDetails({ url, id }) {
|
export function getRowDetails(url) {
|
||||||
return request(`${url}${id}`);
|
return request(url);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 肥料使用监管-列表 */
|
/* 肥料使用监管-列表 */
|
||||||
@ -79,3 +79,7 @@ export function editPesticideUseRegulatory(data) {
|
|||||||
export function delPesticideUseRegulatory(ids) {
|
export function delPesticideUseRegulatory(ids) {
|
||||||
return request(`/inputGoods/supervise/pesticide/delete/${ids}`);
|
return request(`/inputGoods/supervise/pesticide/delete/${ids}`);
|
||||||
}
|
}
|
||||||
|
/* 获取地块列表 */
|
||||||
|
export function getLandList() {
|
||||||
|
return request(`/land-resource/landManage/getLandList`);
|
||||||
|
}
|
||||||
|
@ -56,3 +56,11 @@ export function GetDictType(dictId) {
|
|||||||
method: 'GET',
|
method: 'GET',
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
/**
|
||||||
|
* @Title: 类型信息
|
||||||
|
*/
|
||||||
|
export function GetDictTypeInfo(dictId) {
|
||||||
|
return request(`/system/dict/data/type/${dictId}`, {
|
||||||
|
method: 'GET',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
240
sub-government-affairs-service/src/components/LandSelect.vue
Normal file
240
sub-government-affairs-service/src/components/LandSelect.vue
Normal file
@ -0,0 +1,240 @@
|
|||||||
|
<template>
|
||||||
|
<div class="land-select-container" :style="{ width: typeof width === 'number' ? `${width}px` : width }">
|
||||||
|
<el-form v-if="enableValidation" ref="formRef" :model="form" :rules="rules" :validate-on-rule-change="false">
|
||||||
|
<el-form-item :label="label" :prop="enableValidation ? 'selectedValue' : null">
|
||||||
|
<el-select
|
||||||
|
v-bind="$attrs"
|
||||||
|
v-model="selectedValue"
|
||||||
|
:placeholder="placeholder"
|
||||||
|
:size="size"
|
||||||
|
filterable
|
||||||
|
:filter-method="handleFilter"
|
||||||
|
:disabled="disabled"
|
||||||
|
clearable
|
||||||
|
style="flex: 1"
|
||||||
|
@change="handleChange"
|
||||||
|
@clear="handleClear"
|
||||||
|
>
|
||||||
|
<el-option v-for="item in filteredOptions" :key="item[valueKey]" :label="item[labelKey]" :value="item[valueKey]" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<div v-else>
|
||||||
|
<div v-if="showLabel" class="land-select-label">{{ label }}</div>
|
||||||
|
<el-select
|
||||||
|
v-bind="$attrs"
|
||||||
|
v-model="selectedValue"
|
||||||
|
:placeholder="placeholder"
|
||||||
|
:size="size"
|
||||||
|
filterable
|
||||||
|
:filter-method="handleFilter"
|
||||||
|
:disabled="disabled"
|
||||||
|
clearable
|
||||||
|
style="flex: 1"
|
||||||
|
@change="handleChange"
|
||||||
|
>
|
||||||
|
<el-option v-for="item in filteredOptions" :key="item[valueKey]" :label="item[labelKey]" :value="item[valueKey]" />
|
||||||
|
</el-select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, watch, onMounted, computed } from 'vue';
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
modelValue: {
|
||||||
|
type: [String, Number, Array],
|
||||||
|
default: '',
|
||||||
|
},
|
||||||
|
// 显示配置
|
||||||
|
showLabel: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true,
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
type: String,
|
||||||
|
default: '选择地块',
|
||||||
|
},
|
||||||
|
placeholder: {
|
||||||
|
type: String,
|
||||||
|
default: '请选择地块',
|
||||||
|
},
|
||||||
|
width: {
|
||||||
|
type: [Number, String],
|
||||||
|
default: 300,
|
||||||
|
},
|
||||||
|
size: {
|
||||||
|
type: String,
|
||||||
|
default: 'default',
|
||||||
|
validator: (value) => ['large', 'default', 'small'].includes(value),
|
||||||
|
},
|
||||||
|
// 数据配置
|
||||||
|
options: {
|
||||||
|
type: Array,
|
||||||
|
default: () => [],
|
||||||
|
},
|
||||||
|
// 字段映射配置
|
||||||
|
valueKey: {
|
||||||
|
type: String,
|
||||||
|
default: 'id',
|
||||||
|
},
|
||||||
|
labelKey: {
|
||||||
|
type: String,
|
||||||
|
default: 'landName',
|
||||||
|
},
|
||||||
|
searchKey: {
|
||||||
|
type: [String, Array],
|
||||||
|
default: () => ['id', 'landName'],
|
||||||
|
},
|
||||||
|
enableValidation: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true,
|
||||||
|
},
|
||||||
|
rules: {
|
||||||
|
type: [Object, Array],
|
||||||
|
default: () => ({
|
||||||
|
selectedValue: [{ required: true, message: '请选择地块', trigger: ['change', 'blur'] }],
|
||||||
|
}),
|
||||||
|
},
|
||||||
|
disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const emit = defineEmits(['update:modelValue', 'change', 'validate']);
|
||||||
|
const formRef = ref(null);
|
||||||
|
const selectedValue = ref(props.modelValue);
|
||||||
|
const form = ref({ selectedValue: props.modelValue });
|
||||||
|
|
||||||
|
const filteredOptions = ref([]);
|
||||||
|
const originalOptions = ref([]);
|
||||||
|
|
||||||
|
// 初始化选项数据
|
||||||
|
const initOptions = () => {
|
||||||
|
filteredOptions.value = [...props.options];
|
||||||
|
originalOptions.value = [...props.options];
|
||||||
|
};
|
||||||
|
|
||||||
|
// 筛选方法
|
||||||
|
const handleFilter = (query) => {
|
||||||
|
if (!query) {
|
||||||
|
filteredOptions.value = [...originalOptions.value];
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const lowerCaseQuery = query.toLowerCase();
|
||||||
|
const searchKeys = Array.isArray(props.searchKey) ? props.searchKey : [props.searchKey];
|
||||||
|
|
||||||
|
filteredOptions.value = originalOptions.value.filter((item) => {
|
||||||
|
// 检查所有搜索字段是否匹配
|
||||||
|
return searchKeys.some((key) => {
|
||||||
|
const fieldValue = item[key];
|
||||||
|
return fieldValue && String(fieldValue).toLowerCase().includes(lowerCaseQuery);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
// 新增清除处理方法
|
||||||
|
const handleClear = () => {
|
||||||
|
if (props.enableValidation) {
|
||||||
|
// 立即触发验证
|
||||||
|
setTimeout(() => {
|
||||||
|
formRef.value?.validateField('selectedValue');
|
||||||
|
}, 0);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 处理值变化
|
||||||
|
const handleChange = (value) => {
|
||||||
|
const oldValue = selectedValue.value;
|
||||||
|
selectedValue.value = value;
|
||||||
|
emit('update:modelValue', value);
|
||||||
|
|
||||||
|
// 只有值真实变化时才触发change
|
||||||
|
if (value !== oldValue) {
|
||||||
|
emit('change', value);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 单个字段验证
|
||||||
|
const validateField = async (value) => {
|
||||||
|
if (!props.enableValidation || !formRef.value) return true;
|
||||||
|
|
||||||
|
try {
|
||||||
|
await formRef.value.validateField('selectedValue');
|
||||||
|
emit('validate', { valid: true, value });
|
||||||
|
return true;
|
||||||
|
} catch (error) {
|
||||||
|
emit('validate', { valid: false, error, value });
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 暴露验证方法
|
||||||
|
defineExpose({
|
||||||
|
validate: async () => {
|
||||||
|
if (!props.enableValidation) return true;
|
||||||
|
return formRef.value?.validate();
|
||||||
|
},
|
||||||
|
resetFields: () => {
|
||||||
|
if (props.enableValidation) {
|
||||||
|
formRef.value?.resetFields();
|
||||||
|
}
|
||||||
|
selectedValue.value = '';
|
||||||
|
},
|
||||||
|
handleChange,
|
||||||
|
});
|
||||||
|
|
||||||
|
// 监听props变化
|
||||||
|
watch(
|
||||||
|
() => props.modelValue,
|
||||||
|
(newVal) => {
|
||||||
|
selectedValue.value = newVal;
|
||||||
|
form.value.selectedValue = newVal;
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
// 监听enableValidation变化
|
||||||
|
watch(
|
||||||
|
() => props.enableValidation,
|
||||||
|
(newVal) => {
|
||||||
|
if (!newVal && formRef.value) {
|
||||||
|
formRef.value.clearValidate();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.options,
|
||||||
|
() => {
|
||||||
|
initOptions();
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
// 监听selectedValue变化
|
||||||
|
watch(selectedValue, (newVal) => {
|
||||||
|
emit('update:modelValue', newVal);
|
||||||
|
emit('change', newVal);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 组件挂载时初始化
|
||||||
|
onMounted(() => {
|
||||||
|
initOptions();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.land-select-container {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.land-select-label {
|
||||||
|
margin-right: 12px;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #606266;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
</style>
|
@ -346,6 +346,9 @@
|
|||||||
.mr-20 {
|
.mr-20 {
|
||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
}
|
}
|
||||||
|
.mb-20 {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
// 弹窗表单样式-子元素一行2个列
|
// 弹窗表单样式-子元素一行2个列
|
||||||
.dialog-form-container {
|
.dialog-form-container {
|
||||||
@ -369,3 +372,4 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -25,21 +25,37 @@
|
|||||||
<div class="table-toolbar">
|
<div class="table-toolbar">
|
||||||
<el-button type="primary" icon="plus" @click="addItem()">新增</el-button>
|
<el-button type="primary" icon="plus" @click="addItem()">新增</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="table-statistics flex-left-center">
|
||||||
|
<el-icon class="mr-20" color="#409eff" size="16"><InfoFilled /></el-icon>
|
||||||
|
<div class="mr-20">
|
||||||
|
已选择 <span class="color-blue">{{ landNums }}</span> 个地块
|
||||||
|
</div>
|
||||||
|
<div class="mr-20">
|
||||||
|
面积总计(亩):<span class="color-blue">{{ totalArea }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="mr-20">
|
||||||
|
肥料总计(件):<span class="color-blue">{{ totalSeed }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="table-cont">
|
<div class="table-cont">
|
||||||
<tableComponent
|
<tableComponent
|
||||||
:table-data="tableData"
|
:table-data="tableData"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:show-selection="false"
|
:show-selection="true"
|
||||||
:loading="tableLoading"
|
:loading="tableLoading"
|
||||||
:total="tableTotal"
|
:total="tableTotal"
|
||||||
:current-page="formInline.current"
|
:current-page="formInline.current"
|
||||||
:page-size="formInline.size"
|
:page-size="formInline.size"
|
||||||
:show-sort="false"
|
:show-sort="false"
|
||||||
@page-change="handlePaginationChange"
|
@page-change="handlePaginationChange"
|
||||||
|
@selection-change="handleSelectionChange"
|
||||||
>
|
>
|
||||||
|
<!-- 自定义-操作 -->
|
||||||
|
<template #useNumber="slotProps">
|
||||||
|
<el-button text type="primary" @click="seeDetails(slotProps.row)">查看</el-button>
|
||||||
|
</template>
|
||||||
<!-- 自定义-操作 -->
|
<!-- 自定义-操作 -->
|
||||||
<template #action="slotProps">
|
<template #action="slotProps">
|
||||||
<el-button type="primary" @click="seeDetails(slotProps.row)">查看</el-button>
|
|
||||||
<el-button type="primary" @click="handleEdit(slotProps.row)">编辑</el-button>
|
<el-button type="primary" @click="handleEdit(slotProps.row)">编辑</el-button>
|
||||||
<el-button @click="handleDelete(slotProps.row)">删除</el-button>
|
<el-button @click="handleDelete(slotProps.row)">删除</el-button>
|
||||||
</template>
|
</template>
|
||||||
@ -140,6 +156,7 @@ const resetForm = () => {
|
|||||||
// 表格数据
|
// 表格数据
|
||||||
const tableData = ref([]);
|
const tableData = ref([]);
|
||||||
const selectedIds = ref([]);
|
const selectedIds = ref([]);
|
||||||
|
const selectedRows = ref([]);
|
||||||
const tableLoading = ref(false);
|
const tableLoading = ref(false);
|
||||||
const tableTotal = ref(0);
|
const tableTotal = ref(0);
|
||||||
const columns = ref([
|
const columns = ref([
|
||||||
@ -149,10 +166,10 @@ const columns = ref([
|
|||||||
{ prop: 'gridName', label: '网格名称' },
|
{ prop: 'gridName', label: '网格名称' },
|
||||||
{ prop: 'landId', label: '地块编码' },
|
{ prop: 'landId', label: '地块编码' },
|
||||||
{ prop: 'landName', label: '地块名称' },
|
{ prop: 'landName', label: '地块名称' },
|
||||||
{ prop: 'name', label: '姓名' },
|
{ prop: 'extent', label: '面积(亩)' },
|
||||||
{ prop: 'phone', label: '联系方式' },
|
{ prop: 'useNumber', label: '肥料需求', slotName: 'useNumber' },
|
||||||
{ prop: 'fertilizeId', label: '化肥编号' },
|
{ prop: 'businessEntityCode', label: '生产经营主体编码' },
|
||||||
{ prop: 'fertilizeName', label: '化肥名称' },
|
{ prop: 'businessEntityName', label: '生产经营主体名称' },
|
||||||
// { prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
|
// { prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
|
||||||
]);
|
]);
|
||||||
const handlePaginationChange = ({ page, pageSize }) => {
|
const handlePaginationChange = ({ page, pageSize }) => {
|
||||||
@ -160,6 +177,19 @@ const handlePaginationChange = ({ page, pageSize }) => {
|
|||||||
formInline.size = pageSize;
|
formInline.size = pageSize;
|
||||||
loadData();
|
loadData();
|
||||||
};
|
};
|
||||||
|
let landNums = ref(0);
|
||||||
|
let totalArea = computed(() => {
|
||||||
|
return selectedRows.value.reduce((sum, item) => sum + item.extent, 0);
|
||||||
|
});
|
||||||
|
let totalSeed = computed(() => {
|
||||||
|
return selectedRows.value.reduce((sum, item) => sum + item.useNumber, 0);
|
||||||
|
});
|
||||||
|
const handleSelectionChange = (selection, keys) => {
|
||||||
|
// console.log(selection, keys);
|
||||||
|
selectedRows.value = selection;
|
||||||
|
landNums.value = selection.length;
|
||||||
|
};
|
||||||
|
|
||||||
const loadData = async () => {
|
const loadData = async () => {
|
||||||
tableLoading.value = true;
|
tableLoading.value = true;
|
||||||
try {
|
try {
|
||||||
|
@ -25,21 +25,37 @@
|
|||||||
<div class="table-toolbar">
|
<div class="table-toolbar">
|
||||||
<el-button type="primary" icon="plus" @click="addItem()">新增</el-button>
|
<el-button type="primary" icon="plus" @click="addItem()">新增</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="table-statistics flex-left-center">
|
||||||
|
<el-icon class="mr-20" color="#409eff" size="16"><InfoFilled /></el-icon>
|
||||||
|
<div class="mr-20">
|
||||||
|
已选择 <span class="color-blue">{{ landNums }}</span> 个地块
|
||||||
|
</div>
|
||||||
|
<div class="mr-20">
|
||||||
|
面积总计(亩):<span class="color-blue">{{ totalArea }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="mr-20">
|
||||||
|
种子总计(件):<span class="color-blue">{{ totalSeed }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="table-cont">
|
<div class="table-cont">
|
||||||
<tableComponent
|
<tableComponent
|
||||||
:table-data="tableData"
|
:table-data="tableData"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:show-selection="false"
|
:show-selection="true"
|
||||||
:loading="tableLoading"
|
:loading="tableLoading"
|
||||||
:total="tableTotal"
|
:total="tableTotal"
|
||||||
:current-page="formInline.current"
|
:current-page="formInline.current"
|
||||||
:page-size="formInline.size"
|
:page-size="formInline.size"
|
||||||
:show-sort="false"
|
:show-sort="false"
|
||||||
@page-change="handlePaginationChange"
|
@page-change="handlePaginationChange"
|
||||||
|
@selection-change="handleSelectionChange"
|
||||||
>
|
>
|
||||||
|
<!-- 自定义-操作 -->
|
||||||
|
<template #useNumber="slotProps">
|
||||||
|
<el-button text type="primary" @click="seeDetails(slotProps.row)">查看</el-button>
|
||||||
|
</template>
|
||||||
<!-- 自定义-操作 -->
|
<!-- 自定义-操作 -->
|
||||||
<template #action="slotProps">
|
<template #action="slotProps">
|
||||||
<el-button type="primary" @click="seeDetails(slotProps.row)">查看</el-button>
|
|
||||||
<el-button type="primary" @click="handleEdit(slotProps.row)">编辑</el-button>
|
<el-button type="primary" @click="handleEdit(slotProps.row)">编辑</el-button>
|
||||||
<el-button @click="handleDelete(slotProps.row)">删除</el-button>
|
<el-button @click="handleDelete(slotProps.row)">删除</el-button>
|
||||||
</template>
|
</template>
|
||||||
@ -140,17 +156,20 @@ const resetForm = () => {
|
|||||||
// 表格数据
|
// 表格数据
|
||||||
const tableData = ref([]);
|
const tableData = ref([]);
|
||||||
const selectedIds = ref([]);
|
const selectedIds = ref([]);
|
||||||
|
const selectedRows = ref([]);
|
||||||
const tableLoading = ref(false);
|
const tableLoading = ref(false);
|
||||||
const tableTotal = ref(0);
|
const tableTotal = ref(0);
|
||||||
const columns = ref([
|
const columns = ref([
|
||||||
{ prop: 'name', label: '姓名' },
|
{ prop: 'regionCode', label: '行政区域编码' },
|
||||||
{ prop: 'phone', label: '联系方式' },
|
{ prop: 'regionName', label: '行政区域名称' },
|
||||||
{ prop: 'landName', label: '用药地块' },
|
{ prop: 'gridId', label: '网格编码' },
|
||||||
|
{ prop: 'gridName', label: '网格名称' },
|
||||||
{ prop: 'landId', label: '地块编码' },
|
{ prop: 'landId', label: '地块编码' },
|
||||||
{ prop: 'detectionTime', label: '检测时间' },
|
{ prop: 'landName', label: '地块名称' },
|
||||||
{ prop: 'detectionResult', label: '检测结果' },
|
{ prop: 'extent', label: '面积(亩)' },
|
||||||
{ prop: 'detectionUnit', label: '检测单位' },
|
{ prop: 'useNumber', label: '农药需求', slotName: 'useNumber' },
|
||||||
{ prop: 'isUpload', label: '检测报告(是否上传)' },
|
{ prop: 'businessEntityCode', label: '生产经营主体编码' },
|
||||||
|
{ prop: 'businessEntityName', label: '生产经营主体名称' },
|
||||||
// { prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
|
// { prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
|
||||||
]);
|
]);
|
||||||
const handlePaginationChange = ({ page, pageSize }) => {
|
const handlePaginationChange = ({ page, pageSize }) => {
|
||||||
@ -158,6 +177,18 @@ const handlePaginationChange = ({ page, pageSize }) => {
|
|||||||
formInline.size = pageSize;
|
formInline.size = pageSize;
|
||||||
loadData();
|
loadData();
|
||||||
};
|
};
|
||||||
|
let landNums = ref(0);
|
||||||
|
let totalArea = computed(() => {
|
||||||
|
return selectedRows.value.reduce((sum, item) => sum + item.extent, 0);
|
||||||
|
});
|
||||||
|
let totalSeed = computed(() => {
|
||||||
|
return selectedRows.value.reduce((sum, item) => sum + item.useNumber, 0);
|
||||||
|
});
|
||||||
|
const handleSelectionChange = (selection, keys) => {
|
||||||
|
// console.log(selection, keys);
|
||||||
|
selectedRows.value = selection;
|
||||||
|
landNums.value = selection.length;
|
||||||
|
};
|
||||||
const loadData = async () => {
|
const loadData = async () => {
|
||||||
tableLoading.value = true;
|
tableLoading.value = true;
|
||||||
try {
|
try {
|
||||||
|
@ -47,52 +47,53 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<el-dialog v-model="dialogFormVisible" :title="dialogTitle" width="800" :close-on-click-modal="false">
|
<el-dialog v-model="dialogFormVisible" :title="dialogTitle" width="800" :close-on-click-modal="false">
|
||||||
|
<el-form :inline="true" :label-width="'auto'">
|
||||||
|
<LandSelect
|
||||||
|
ref="landSelectRef"
|
||||||
|
v-model="dialogForm.landId"
|
||||||
|
:options="landSelectList"
|
||||||
|
:disabled="formDisabled"
|
||||||
|
:width="500"
|
||||||
|
@change="handleLandChange"
|
||||||
|
/>
|
||||||
|
</el-form>
|
||||||
|
<el-descriptions title="地块信息" border class="mb-20 custom-descriptions" :column="2">
|
||||||
|
<el-descriptions-item label="行政区域编码">{{ dialogForm.regionCode }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="行政区域名称">{{ dialogForm.regionName }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="网格编码">{{ dialogForm.gridId }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="网格名称">{{ dialogForm.gridName }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="地块编码">{{ dialogForm.landName }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="地块名称">{{ dialogForm.landId }}</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
<el-descriptions title="经营主体信息" border class="mb-20 custom-descriptions" :column="2">
|
||||||
|
<el-descriptions-item label="经营主体编码">{{ dialogForm.businessEntityCode }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item label="经营主体名称">{{ dialogForm.businessEntityName }}</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
<el-form
|
<el-form
|
||||||
ref="dialogRef"
|
ref="dialogRef"
|
||||||
:model="dialogForm"
|
:model="dialogForm"
|
||||||
:inline="true"
|
:inline="true"
|
||||||
:label-width="'120'"
|
:label-width="'80'"
|
||||||
:rules="dialogFormRules"
|
:rules="dialogFormRules"
|
||||||
:disabled="formDisabled"
|
:disabled="formDisabled"
|
||||||
class="dialog-form-container"
|
class="dialog-form-container"
|
||||||
>
|
>
|
||||||
<el-form-item label="种子种苗名称" prop="seedName" class="dialog-form-item">
|
<div class="dialog-form-title">农药用药详情</div>
|
||||||
<el-input v-model="dialogForm.seedName" clearable placeholder="请输入种子种苗名称" />
|
<el-form-item label="肥料编号" prop="fertilizeId" class="dialog-form-item">
|
||||||
|
<el-input v-model="dialogForm.fertilizeId" clearable placeholder="请输入肥料编号" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="品种名称" prop="varietyName" class="dialog-form-item">
|
<el-form-item label="肥料名称" prop="fertilizeName" class="dialog-form-item">
|
||||||
<el-input v-model="dialogForm.varietyName" clearable placeholder="请输入品种名称" />
|
<el-input v-model="dialogForm.fertilizeName" clearable placeholder="请输入肥料名称" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="品牌" prop="brand" class="dialog-form-item">
|
<el-form-item label="使用量" required prop="useNumber" class="dialog-form-item">
|
||||||
<el-input v-model="dialogForm.brand" clearable placeholder="请输入品牌" />
|
<el-input-number v-model="dialogForm.useNumber" :min="1" :controls="false" placeholder="请输入使用量" style="width: 150px" />
|
||||||
|
<el-select v-model="dialogForm.useUnit" placeholder="请选择" style="width: 80px">
|
||||||
|
<el-option v-for="el in unitList" :key="el.dictValue" :value="el.dictValue" :label="el.dictValue" />
|
||||||
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="生产厂家" prop="manufacturer" class="dialog-form-item">
|
<el-form-item label="使用时间" prop="detectionTime" class="dialog-form-item">
|
||||||
<el-input v-model="dialogForm.manufacturer" clearable placeholder="请输入生产厂家" />
|
<el-date-picker v-model="dialogForm.detectionTime" :clearable="false" type="date" value-format="YYYY-MM-DD" placeholder="请选择使用时间" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="蔬菜种苗" prop="classifyId" class="dialog-form-item">
|
|
||||||
<el-cascader
|
|
||||||
v-model="dialogForm.classifyId"
|
|
||||||
:options="seedTypeDialogList"
|
|
||||||
:props="cascaderProps"
|
|
||||||
placeholder="请选择"
|
|
||||||
@change="handleCascaderChange"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="产品规格" prop="productUnit" class="dialog-form-item">
|
|
||||||
<el-input v-model="dialogForm.productUnit" clearable placeholder="请输入产品规格" />
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<div style="display: flex">
|
|
||||||
<div style="width: 50%; display: inline-block">
|
|
||||||
<el-form-item label="种子种苗主图" prop="photoUrl" class="dialog-form-item" style="width: 100%">
|
|
||||||
<FileUploader v-model="dialogForm.photoUrl" :limit="1" />
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div style="width: 50%; display: inline-block">
|
|
||||||
<el-form-item label="种子种苗详情图" prop="photoUrlDetail" class="dialog-form-item" style="width: 100%">
|
|
||||||
<FileUploader v-model="dialogForm.photoUrlDetail" :limit="1" />
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
</el-form>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<div class="dialog-footer">
|
<div class="dialog-footer">
|
||||||
@ -116,8 +117,10 @@ import {
|
|||||||
fertilizeUseRegulatorySave,
|
fertilizeUseRegulatorySave,
|
||||||
editFertilizeUseRegulatory,
|
editFertilizeUseRegulatory,
|
||||||
delFertilizeUseRegulatory,
|
delFertilizeUseRegulatory,
|
||||||
getRowDetails,
|
getLandList,
|
||||||
} from '@/apis/inputSuppliesApi/supervisionOfInputs';
|
} from '@/apis/inputSuppliesApi/supervisionOfInputs';
|
||||||
|
import request from '@/utils/axios';
|
||||||
|
import { GetDictTypeInfo } from '@/apis/system/dictType';
|
||||||
import { useApp } from '@/hooks';
|
import { useApp } from '@/hooks';
|
||||||
const app = useApp();
|
const app = useApp();
|
||||||
|
|
||||||
@ -151,9 +154,9 @@ const columns = ref([
|
|||||||
{ prop: 'landName', label: '地块名称' },
|
{ prop: 'landName', label: '地块名称' },
|
||||||
{ prop: 'name', label: '姓名' },
|
{ prop: 'name', label: '姓名' },
|
||||||
{ prop: 'phone', label: '联系方式' },
|
{ prop: 'phone', label: '联系方式' },
|
||||||
{ prop: 'fertilizeId', label: '化肥编号' },
|
{ prop: 'fertilizeId', label: '肥料编号' },
|
||||||
{ prop: 'fertilizeName', label: '化肥名称' },
|
{ prop: 'fertilizeName', label: '肥料名称' },
|
||||||
// { prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
|
{ prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
|
||||||
]);
|
]);
|
||||||
const handlePaginationChange = ({ page, pageSize }) => {
|
const handlePaginationChange = ({ page, pageSize }) => {
|
||||||
formInline.current = page;
|
formInline.current = page;
|
||||||
@ -202,70 +205,89 @@ const dialogFormVisible = ref(false);
|
|||||||
const dialogRef = ref(null);
|
const dialogRef = ref(null);
|
||||||
const dialogTitle = ref('新增');
|
const dialogTitle = ref('新增');
|
||||||
const formDisabled = ref(false);
|
const formDisabled = ref(false);
|
||||||
|
const landSelectRef = ref(null);
|
||||||
const dialogForm = reactive({
|
const dialogForm = reactive({
|
||||||
id: '',
|
regionCode: '', //所属行政区域代码
|
||||||
seedName: '', //种子种苗名称
|
regionName: '', //所属行政区域名称
|
||||||
varietyName: '', //品种名称
|
gridId: '', //所属网格代码
|
||||||
brand: '', //品牌
|
gridName: '', //所属网格名称
|
||||||
manufacturer: '', //生产厂家
|
landId: '', //地块id
|
||||||
classifyId: '', //蔬菜种苗id
|
landName: '', //地块名称
|
||||||
classifyName: '', //蔬菜种苗名称
|
name: '', //姓名
|
||||||
productSpecification: '', //产品规格(number)
|
phone: '', //联系方式
|
||||||
productUnit: '', //产品规格单位
|
fertilizeId: '', //肥料名称id
|
||||||
productAttributes: '', //自定义商品属性
|
fertilizeName: '', //肥料名称
|
||||||
photoUrl: '', //种子种苗主图
|
useNumber: 1, //使用量
|
||||||
photoUrlDetail: '', //种子种苗详情图
|
useUnit: 'g', //使用量单位
|
||||||
|
detectionTime: '', //使用时间
|
||||||
|
businessEntityCode: '', //经营主体编码
|
||||||
|
businessEntityName: '', //经营主体名称
|
||||||
});
|
});
|
||||||
const dialogFormRules = ref({
|
const dialogFormRules = ref({
|
||||||
seedName: [{ required: true, message: '请输入种子种苗名称', trigger: 'blur' }],
|
fertilizeId: [{ required: true, message: '请输入肥料编号', trigger: 'blur' }],
|
||||||
varietyName: [{ required: true, message: '请输入品种名称', trigger: 'blur' }],
|
fertilizeName: [{ required: true, message: '请输入肥料名称', trigger: 'blur' }],
|
||||||
brand: [{ required: true, message: '请输入品牌', trigger: 'blur' }],
|
useNumber: [{ required: true, message: '请输入使用量', trigger: ['change', 'blur'] }],
|
||||||
manufacturer: [{ required: true, message: '请输入品牌', trigger: 'blur' }],
|
detectionTime: [{ required: true, message: '请选择使用时间', trigger: 'blur' }],
|
||||||
classifyId: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: '请选择蔬菜种苗',
|
|
||||||
trigger: ['change', 'blur'],
|
|
||||||
},
|
|
||||||
],
|
|
||||||
productUnit: [{ required: true, message: '请输入产品规格', trigger: 'blur' }],
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const addItem = async () => {
|
const addItem = async () => {
|
||||||
ElMessage.success('点击新增!');
|
restDialogForm();
|
||||||
// restDialogForm();
|
dialogTitle.value = '新增';
|
||||||
// dialogTitle.value = '新增';
|
formDisabled.value = false;
|
||||||
// formDisabled.value = false;
|
dialogFormVisible.value = true;
|
||||||
// dialogFormVisible.value = true;
|
|
||||||
};
|
};
|
||||||
const seeDetails = async (row) => {
|
const seeDetails = async (row) => {
|
||||||
ElMessage.success('点击查看详情!');
|
dialogTitle.value = '详情';
|
||||||
// dialogTitle.value = '详情';
|
formDisabled.value = true;
|
||||||
// setDialogForm(row);
|
dialogForm.landId = row.landId;
|
||||||
// formDisabled.value = true;
|
getDetails();
|
||||||
// dialogFormVisible.value = true;
|
dialogForm.fertilizeId = row.fertilizeId;
|
||||||
|
dialogForm.fertilizeName = row.fertilizeName;
|
||||||
|
dialogForm.useNumber = row.useNumber;
|
||||||
|
dialogForm.useUnit = row.useUnit;
|
||||||
|
dialogForm.detectionTime = row.useTime;
|
||||||
|
dialogFormVisible.value = true;
|
||||||
};
|
};
|
||||||
const handleEdit = (row) => {
|
const handleEdit = (row) => {
|
||||||
ElMessage.success('点击编辑!');
|
console.log('要编辑的行: ', row);
|
||||||
// console.log('要编辑的行: ', row);
|
dialogTitle.value = '编辑';
|
||||||
// dialogTitle.value = '编辑';
|
formDisabled.value = false;
|
||||||
// setDialogForm(row);
|
dialogForm.landId = row.landId;
|
||||||
// formDisabled.value = false;
|
getDetails();
|
||||||
// dialogFormVisible.value = true;
|
dialogForm.fertilizeId = row.fertilizeId;
|
||||||
|
dialogForm.fertilizeName = row.fertilizeName;
|
||||||
|
dialogForm.useNumber = row.useNumber;
|
||||||
|
dialogForm.useUnit = row.useUnit;
|
||||||
|
dialogForm.detectionTime = row.useTime;
|
||||||
|
dialogFormVisible.value = true;
|
||||||
};
|
};
|
||||||
const setDialogForm = (row) => {
|
const setDialogForm = (row) => {
|
||||||
dialogForm.id = row.id;
|
dialogForm.regionCode = row.gridAreaCode;
|
||||||
dialogForm.seedName = row.seedName;
|
dialogForm.regionName = row.fullRegionName;
|
||||||
dialogForm.varietyName = row.varietyName;
|
dialogForm.gridId = row.gridId;
|
||||||
dialogForm.brand = row.brand;
|
dialogForm.gridName = row.gridName;
|
||||||
dialogForm.manufacturer = row.manufacturer;
|
dialogForm.landId = row.id;
|
||||||
dialogForm.classifyId = row.classifyId;
|
dialogForm.landName = row.landName;
|
||||||
dialogForm.classifyName = row.classifyName;
|
dialogForm.name = row.propertyName;
|
||||||
dialogForm.productSpecification = row.productSpecification;
|
dialogForm.phone = row.propertyPhone;
|
||||||
dialogForm.productUnit = row.productUnit;
|
dialogForm.businessEntityCode = row.businessEntityCode ?? '';
|
||||||
dialogForm.productAttributes = row.productAttributes;
|
dialogForm.businessEntityName = row.businessEntityName ?? '';
|
||||||
dialogForm.photoUrl = row.photoUrl;
|
};
|
||||||
dialogForm.photoUrlDetail = row.photoUrlDetail;
|
// 获取地块信息
|
||||||
|
const getDetails = async () => {
|
||||||
|
let response = await request({
|
||||||
|
url: `/land-resource/landManage/getLandInfo?landId=${dialogForm.landId}`,
|
||||||
|
});
|
||||||
|
console.log(response);
|
||||||
|
if (response.code == 200) {
|
||||||
|
if (response.data) {
|
||||||
|
setDialogForm(response.data);
|
||||||
|
} else {
|
||||||
|
ElMessage.error('未查询到数据');
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
ElMessage.error(response.message);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
const handleDelete = (row) => {
|
const handleDelete = (row) => {
|
||||||
app
|
app
|
||||||
@ -298,12 +320,14 @@ const deleteGoods = async (ids) => {
|
|||||||
};
|
};
|
||||||
const onSaveCategory = () => {
|
const onSaveCategory = () => {
|
||||||
console.log(dialogForm);
|
console.log(dialogForm);
|
||||||
|
if (dialogForm.landId == '') {
|
||||||
|
landSelectRef.value.handleChange();
|
||||||
|
return;
|
||||||
|
}
|
||||||
dialogRef.value.validate(async (valid, fields) => {
|
dialogRef.value.validate(async (valid, fields) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
try {
|
try {
|
||||||
let param = { ...dialogForm };
|
let param = { ...dialogForm };
|
||||||
param.classifyId = dialogForm.classifyId.join(',');
|
|
||||||
param.classifyName = dialogForm.classifyName.join(',');
|
|
||||||
console.log(param);
|
console.log(param);
|
||||||
let response;
|
let response;
|
||||||
if (dialogTitle.value == '新增') {
|
if (dialogTitle.value == '新增') {
|
||||||
@ -334,18 +358,21 @@ const cancelDialog = async () => {
|
|||||||
};
|
};
|
||||||
const restDialogForm = () => {
|
const restDialogForm = () => {
|
||||||
Object.assign(dialogForm, {
|
Object.assign(dialogForm, {
|
||||||
id: '',
|
regionCode: '', //所属行政区域代码
|
||||||
seedName: '', //种子种苗名称
|
regionName: '', //所属行政区域名称
|
||||||
varietyName: '', //品种名称
|
gridId: '', //所属网格代码
|
||||||
brand: '', //品牌
|
gridName: '', //所属网格名称
|
||||||
manufacturer: '', //生产厂家
|
landId: '', //地块id
|
||||||
classifyId: '', //蔬菜种苗id
|
landName: '', //地块名称
|
||||||
classifyName: '', //蔬菜种苗名称
|
name: '', //姓名
|
||||||
productSpecification: '', //产品规格(number)
|
phone: '', //联系方式
|
||||||
productUnit: '', //产品规格单位
|
fertilizeId: '', //肥料名称id
|
||||||
productAttributes: '', //自定义商品属性
|
fertilizeName: '', //肥料名称
|
||||||
photoUrl: '', //种子种苗主图
|
useNumber: 1, //使用量
|
||||||
photoUrlDetail: '', //种子种苗详情图
|
useUnit: 'g', //使用量单位
|
||||||
|
useTime: '', //使用时间
|
||||||
|
businessEntityCode: '', //经营主体编码
|
||||||
|
businessEntityName: '', //经营主体名称
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -367,40 +394,46 @@ const getSeedTypeList = async () => {
|
|||||||
console.error(error);
|
console.error(error);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
// 级联选择器配置
|
|
||||||
const cascaderProps = ref({
|
|
||||||
label: 'dataName', // 选项标签字段名
|
|
||||||
value: 'id', // 选项值字段名
|
|
||||||
children: 'children', // 子选项字段名
|
|
||||||
emitPath: true,
|
|
||||||
expandTrigger: 'hover',
|
|
||||||
});
|
|
||||||
const handleCascaderChange = () => {
|
|
||||||
const selectedNames = getSelectedNames(dialogForm.classifyId);
|
|
||||||
console.log('对应的名称:', selectedNames); // 例如: ['花草类种子', '具体种子名称']
|
|
||||||
// 如果需要,可以将名称也保存到表单数据中
|
|
||||||
dialogForm.classifyName = selectedNames;
|
|
||||||
};
|
|
||||||
const getSelectedNames = (ids) => {
|
|
||||||
if (!ids || !ids.length) return [];
|
|
||||||
|
|
||||||
let names = [];
|
const unitList = ref([
|
||||||
let currentLevel = seedTypeDialogList.value;
|
{ dictCode: '52', dictValue: 'g' },
|
||||||
|
{ dictCode: '53', dictValue: 'kg' },
|
||||||
|
]);
|
||||||
|
|
||||||
for (const id of ids) {
|
const landSelectList = ref([]);
|
||||||
const foundItem = currentLevel.find((item) => item.id === id);
|
const getLandsList = async () => {
|
||||||
if (!foundItem) break;
|
let res = await getLandList();
|
||||||
|
if (res.code == 200) {
|
||||||
names.push(foundItem.dataName);
|
landSelectList.value = res.data;
|
||||||
currentLevel = foundItem.children || [];
|
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
const handleLandChange = (val) => {
|
||||||
|
console.log(val);
|
||||||
|
if (val) {
|
||||||
|
getDetails();
|
||||||
|
} else {
|
||||||
|
restDialogForm();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
return names;
|
const getEntityOptions = async () => {
|
||||||
|
let res = await GetDictTypeInfo('sys_use_supervise_number');
|
||||||
|
console.log(res);
|
||||||
|
if (res.code == 200) {
|
||||||
|
unitList.value = res.data;
|
||||||
|
} else {
|
||||||
|
unitList.value = [
|
||||||
|
{ dictCode: '52', dictValue: 'g' },
|
||||||
|
{ dictCode: '53', dictValue: 'kg' },
|
||||||
|
];
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
onSubmit();
|
onSubmit();
|
||||||
getSeedTypeList();
|
getLandsList();
|
||||||
|
getEntityOptions();
|
||||||
|
// getSeedTypeList();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@ -420,4 +453,23 @@ onMounted(() => {
|
|||||||
height: 100px;
|
height: 100px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 必须使用深度选择器 + 精确DOM层级 */
|
||||||
|
.custom-descriptions :deep(.el-descriptions__body) table.el-descriptions__table {
|
||||||
|
table-layout: fixed; /* 关键属性1:强制等宽 */
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.custom-descriptions :deep(.el-descriptions__label) {
|
||||||
|
width: 130px !important; /* 关键属性2:固定宽度 */
|
||||||
|
min-width: 130px !important;
|
||||||
|
max-width: 130px !important;
|
||||||
|
background: #f5f7fa;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: left;
|
||||||
|
padding-right: 20px;
|
||||||
|
}
|
||||||
|
.custom-descriptions :deep(.el-descriptions__content) {
|
||||||
|
width: calc(100% - 130px) !important; /* 自动填充剩余空间 */
|
||||||
|
word-break: break-word;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -151,7 +151,7 @@ const columns = ref([
|
|||||||
{ prop: 'detectionResult', label: '检测结果' },
|
{ prop: 'detectionResult', label: '检测结果' },
|
||||||
{ prop: 'detectionUnit', label: '检测单位' },
|
{ prop: 'detectionUnit', label: '检测单位' },
|
||||||
{ prop: 'isUpload', label: '检测报告(是否上传)' },
|
{ prop: 'isUpload', label: '检测报告(是否上传)' },
|
||||||
// { prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
|
{ prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
|
||||||
]);
|
]);
|
||||||
const handlePaginationChange = ({ page, pageSize }) => {
|
const handlePaginationChange = ({ page, pageSize }) => {
|
||||||
formInline.current = page;
|
formInline.current = page;
|
||||||
@ -238,10 +238,10 @@ const addItem = async () => {
|
|||||||
};
|
};
|
||||||
const seeDetails = async (row) => {
|
const seeDetails = async (row) => {
|
||||||
ElMessage.success('点击查看详情!');
|
ElMessage.success('点击查看详情!');
|
||||||
// dialogTitle.value = '详情';
|
dialogTitle.value = '详情';
|
||||||
// setDialogForm(row);
|
setDialogForm(row);
|
||||||
// formDisabled.value = true;
|
formDisabled.value = true;
|
||||||
// dialogFormVisible.value = true;
|
dialogFormVisible.value = true;
|
||||||
};
|
};
|
||||||
const handleEdit = (row) => {
|
const handleEdit = (row) => {
|
||||||
ElMessage.success('点击编辑!');
|
ElMessage.success('点击编辑!');
|
||||||
|
@ -48,21 +48,23 @@
|
|||||||
</div>
|
</div>
|
||||||
<el-dialog v-model="dialogFormVisible" :title="dialogTitle" width="800" :close-on-click-modal="false">
|
<el-dialog v-model="dialogFormVisible" :title="dialogTitle" width="800" :close-on-click-modal="false">
|
||||||
<el-form :inline="true" :label-width="'auto'">
|
<el-form :inline="true" :label-width="'auto'">
|
||||||
<el-form-item label="地块编号" prop="seedName">
|
<LandSelect
|
||||||
<el-input v-model="dialogForm.id" placeholder="请输入地块编号" clearable />
|
ref="landSelectRef"
|
||||||
</el-form-item>
|
v-model="dialogForm.landId"
|
||||||
<el-form-item label="">
|
:options="landSelectList"
|
||||||
<el-button type="primary" icon="Search" @click="getDetails">查询</el-button>
|
:disabled="formDisabled"
|
||||||
</el-form-item>
|
:width="500"
|
||||||
|
@change="handleLandChange"
|
||||||
|
/>
|
||||||
</el-form>
|
</el-form>
|
||||||
<el-descriptions title="地块信息" border>
|
<el-descriptions title="地块信息" border class="mb-20 custom-descriptions" :column="2">
|
||||||
<el-descriptions-item label="地块">kooriookami</el-descriptions-item>
|
<el-descriptions-item label="地块">{{ dialogForm.landName }}</el-descriptions-item>
|
||||||
<el-descriptions-item label="所属行政区">18100000000</el-descriptions-item>
|
<el-descriptions-item label="所属行政区">{{ dialogForm.regionName }}</el-descriptions-item>
|
||||||
<el-descriptions-item label="所属网格">Suzhou</el-descriptions-item>
|
<el-descriptions-item label="所属网格">{{ dialogForm.gridName }}</el-descriptions-item>
|
||||||
</el-descriptions>
|
</el-descriptions>
|
||||||
<el-descriptions title="经营主体信息" border>
|
<el-descriptions title="经营主体信息" border class="mb-20 custom-descriptions" :column="2">
|
||||||
<el-descriptions-item label="姓名">kooriookami</el-descriptions-item>
|
<el-descriptions-item label="姓名">{{ dialogForm.name }}</el-descriptions-item>
|
||||||
<el-descriptions-item label="联系方式">18100000000</el-descriptions-item>
|
<el-descriptions-item label="联系方式">{{ dialogForm.phone }}</el-descriptions-item>
|
||||||
</el-descriptions>
|
</el-descriptions>
|
||||||
<el-form
|
<el-form
|
||||||
ref="dialogRef"
|
ref="dialogRef"
|
||||||
@ -74,16 +76,16 @@
|
|||||||
class="dialog-form-container"
|
class="dialog-form-container"
|
||||||
>
|
>
|
||||||
<div class="dialog-form-title">农药用药详情</div>
|
<div class="dialog-form-title">农药用药详情</div>
|
||||||
<el-form-item label="种子编号" prop="name" class="dialog-form-item">
|
<el-form-item label="种子编号" prop="provenanceId" class="dialog-form-item">
|
||||||
<el-input v-model="dialogForm.name" clearable placeholder="请输入姓名" />
|
<el-input v-model="dialogForm.provenanceId" clearable placeholder="请输入种子编号" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="种子名称" prop="phone" class="dialog-form-item">
|
<el-form-item label="种子名称" prop="provenanceName" class="dialog-form-item">
|
||||||
<el-input v-model="dialogForm.phone" clearable placeholder="请输入联系方式" />
|
<el-input v-model="dialogForm.provenanceName" clearable placeholder="请输入种子名称" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="使用量" required prop="useNumber" class="dialog-form-item">
|
<el-form-item label="使用量" required prop="useNumber" class="dialog-form-item">
|
||||||
<el-input-number v-model="dialogForm.useNumber" :min="1" :controls="false" placeholder="请输入用药量" style="width: 150px" />
|
<el-input-number v-model="dialogForm.useNumber" :min="1" :controls="false" placeholder="请输入使用量" style="width: 150px" />
|
||||||
<el-select v-model="dialogForm.useUnit" placeholder="请选择" style="width: 80px">
|
<el-select v-model="dialogForm.useUnit" placeholder="请选择" style="width: 80px">
|
||||||
<el-option v-for="el in unitList" :key="el.unit" :value="el.unit" :label="el.unit" />
|
<el-option v-for="el in unitList" :key="el.dictValue" :value="el.dictValue" :label="el.dictValue" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="使用时间" prop="detectionTime" class="dialog-form-item">
|
<el-form-item label="使用时间" prop="detectionTime" class="dialog-form-item">
|
||||||
@ -104,6 +106,7 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { ref, reactive, computed, onMounted, onBeforeUnmount, nextTick } from 'vue';
|
import { ref, reactive, computed, onMounted, onBeforeUnmount, nextTick } from 'vue';
|
||||||
import tableComponent from '@/components/tableComponent.vue';
|
import tableComponent from '@/components/tableComponent.vue';
|
||||||
|
import LandSelect from '@/components/LandSelect.vue';
|
||||||
import { ElMessage } from 'element-plus';
|
import { ElMessage } from 'element-plus';
|
||||||
import inputSuppliesApi from '@/apis/inputSuppliesApi';
|
import inputSuppliesApi from '@/apis/inputSuppliesApi';
|
||||||
const { getMaterailTypes } = inputSuppliesApi;
|
const { getMaterailTypes } = inputSuppliesApi;
|
||||||
@ -112,8 +115,10 @@ import {
|
|||||||
seedUseRegulatorySave,
|
seedUseRegulatorySave,
|
||||||
editSeedUseRegulatory,
|
editSeedUseRegulatory,
|
||||||
delSeedUseRegulatory,
|
delSeedUseRegulatory,
|
||||||
getRowDetails,
|
getLandList,
|
||||||
} from '@/apis/inputSuppliesApi/supervisionOfInputs';
|
} from '@/apis/inputSuppliesApi/supervisionOfInputs';
|
||||||
|
import request from '@/utils/axios';
|
||||||
|
import { GetDictTypeInfo } from '@/apis/system/dictType';
|
||||||
import { useApp } from '@/hooks';
|
import { useApp } from '@/hooks';
|
||||||
const app = useApp();
|
const app = useApp();
|
||||||
|
|
||||||
@ -152,7 +157,7 @@ const columns = ref([
|
|||||||
{ prop: 'useTime', label: '使用时间' },
|
{ prop: 'useTime', label: '使用时间' },
|
||||||
{ prop: 'businessEntityCode', label: '生产经营主体编码' },
|
{ prop: 'businessEntityCode', label: '生产经营主体编码' },
|
||||||
{ prop: 'businessEntityName', label: '生产经营主体名称' },
|
{ prop: 'businessEntityName', label: '生产经营主体名称' },
|
||||||
// { prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
|
{ prop: 'action', label: '操作', slotName: 'action', width: 230, fixed: 'right' },
|
||||||
]);
|
]);
|
||||||
const handlePaginationChange = ({ page, pageSize }) => {
|
const handlePaginationChange = ({ page, pageSize }) => {
|
||||||
formInline.current = page;
|
formInline.current = page;
|
||||||
@ -201,77 +206,89 @@ const dialogFormVisible = ref(false);
|
|||||||
const dialogRef = ref(null);
|
const dialogRef = ref(null);
|
||||||
const dialogTitle = ref('新增');
|
const dialogTitle = ref('新增');
|
||||||
const formDisabled = ref(false);
|
const formDisabled = ref(false);
|
||||||
|
const landSelectRef = ref(null);
|
||||||
const dialogForm = reactive({
|
const dialogForm = reactive({
|
||||||
id: '',
|
regionCode: '', //所属行政区域代码
|
||||||
seedName: '', //种子种苗名称
|
regionName: '', //所属行政区域名称
|
||||||
varietyName: '', //品种名称
|
gridId: '', //所属网格代码
|
||||||
brand: '', //品牌
|
gridName: '', //所属网格名称
|
||||||
manufacturer: '', //生产厂家
|
landId: '', //地块id
|
||||||
classifyId: '', //蔬菜种苗id
|
landName: '', //地块名称
|
||||||
classifyName: '', //蔬菜种苗名称
|
name: '', //姓名
|
||||||
productSpecification: '', //产品规格(number)
|
phone: '', //联系方式
|
||||||
productUnit: '', //产品规格单位
|
provenanceId: '', //种子名称id
|
||||||
productAttributes: '', //自定义商品属性
|
provenanceName: '', //种子名称
|
||||||
photoUrl: '', //种子种苗主图
|
useNumber: 1, //使用量
|
||||||
photoUrlDetail: '', //种子种苗详情图
|
useUnit: 'g', //使用量单位
|
||||||
|
detectionTime: '', //使用时间
|
||||||
|
businessEntityCode: '', //经营主体编码
|
||||||
|
businessEntityName: '', //经营主体名称
|
||||||
});
|
});
|
||||||
const dialogFormRules = ref({
|
const dialogFormRules = ref({
|
||||||
seedName: [{ required: true, message: '请输入种子种苗名称', trigger: 'blur' }],
|
provenanceId: [{ required: true, message: '请输入种子编号', trigger: 'blur' }],
|
||||||
varietyName: [{ required: true, message: '请输入品种名称', trigger: 'blur' }],
|
provenanceName: [{ required: true, message: '请输入种子名称', trigger: 'blur' }],
|
||||||
brand: [{ required: true, message: '请输入品牌', trigger: 'blur' }],
|
useNumber: [{ required: true, message: '请输入使用量', trigger: ['change', 'blur'] }],
|
||||||
manufacturer: [{ required: true, message: '请输入品牌', trigger: 'blur' }],
|
detectionTime: [{ required: true, message: '请选择使用时间', trigger: 'blur' }],
|
||||||
classifyId: [{ required: true, message: '请选择蔬菜种苗', trigger: ['change', 'blur'] }],
|
|
||||||
productUnit: [{ required: true, message: '请输入产品规格', trigger: 'blur' }],
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const addItem = async () => {
|
const addItem = async () => {
|
||||||
ElMessage.success('点击新增!');
|
restDialogForm();
|
||||||
// restDialogForm();
|
dialogTitle.value = '新增';
|
||||||
// dialogTitle.value = '新增';
|
formDisabled.value = false;
|
||||||
// formDisabled.value = false;
|
dialogFormVisible.value = true;
|
||||||
// dialogFormVisible.value = true;
|
|
||||||
};
|
};
|
||||||
const seeDetails = async (row) => {
|
const seeDetails = async (row) => {
|
||||||
console.log('查看详情: ', row);
|
dialogTitle.value = '详情';
|
||||||
ElMessage.success('点击查看详情!');
|
console.log(row);
|
||||||
// dialogTitle.value = '详情';
|
formDisabled.value = true;
|
||||||
// setDialogForm(row);
|
dialogForm.landId = row.landId;
|
||||||
// formDisabled.value = true;
|
getDetails();
|
||||||
// dialogFormVisible.value = true;
|
dialogForm.provenanceId = row.provenanceId;
|
||||||
|
dialogForm.provenanceName = row.provenanceName;
|
||||||
|
dialogForm.useNumber = row.useNumber;
|
||||||
|
dialogForm.useUnit = row.useUnit;
|
||||||
|
dialogForm.detectionTime = row.useTime;
|
||||||
|
dialogFormVisible.value = true;
|
||||||
};
|
};
|
||||||
const handleEdit = (row) => {
|
const handleEdit = (row) => {
|
||||||
console.log('要编辑的行: ', row);
|
dialogTitle.value = '编辑';
|
||||||
ElMessage.success('点击编辑!');
|
console.log(row);
|
||||||
// dialogTitle.value = '编辑';
|
formDisabled.value = false;
|
||||||
// setDialogForm(row);
|
dialogForm.landId = row.landId;
|
||||||
// formDisabled.value = false;
|
getDetails();
|
||||||
// dialogFormVisible.value = true;
|
dialogForm.provenanceId = row.provenanceId;
|
||||||
|
dialogForm.provenanceName = row.provenanceName;
|
||||||
|
dialogForm.useNumber = row.useNumber;
|
||||||
|
dialogForm.useUnit = row.useUnit;
|
||||||
|
dialogForm.detectionTime = row.useTime;
|
||||||
|
dialogFormVisible.value = true;
|
||||||
};
|
};
|
||||||
|
// 获取地块信息
|
||||||
const getDetails = async () => {
|
const getDetails = async () => {
|
||||||
let response = await getRowDetails({
|
let response = await request({
|
||||||
url: '/inputGoods/supervise/provenance/getDetail/',
|
url: `/land-resource/landManage/getLandInfo?landId=${dialogForm.landId}`,
|
||||||
id: dialogForm.id,
|
|
||||||
});
|
});
|
||||||
console.log(response);
|
console.log(response);
|
||||||
if (response.code == 200) {
|
if (response.code == 200) {
|
||||||
|
if (response.data) {
|
||||||
setDialogForm(response.data);
|
setDialogForm(response.data);
|
||||||
|
} else {
|
||||||
|
ElMessage.error('未查询到数据');
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
ElMessage.error(response.message);
|
ElMessage.error(response.message);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
const setDialogForm = (row) => {
|
const setDialogForm = (row) => {
|
||||||
dialogForm.id = row.id;
|
dialogForm.regionCode = row.gridAreaCode;
|
||||||
dialogForm.seedName = row.seedName;
|
dialogForm.regionName = row.fullRegionName;
|
||||||
dialogForm.varietyName = row.varietyName;
|
dialogForm.gridId = row.gridId;
|
||||||
dialogForm.brand = row.brand;
|
dialogForm.gridName = row.gridName;
|
||||||
dialogForm.manufacturer = row.manufacturer;
|
dialogForm.landId = row.id;
|
||||||
dialogForm.classifyId = row.classifyId;
|
dialogForm.landName = row.landName;
|
||||||
dialogForm.classifyName = row.classifyName;
|
dialogForm.name = row.propertyName;
|
||||||
dialogForm.productSpecification = row.productSpecification;
|
dialogForm.phone = row.propertyPhone;
|
||||||
dialogForm.productUnit = row.productUnit;
|
dialogForm.businessEntityCode = row.businessEntityCode ?? '';
|
||||||
dialogForm.productAttributes = row.productAttributes;
|
dialogForm.businessEntityName = row.businessEntityName ?? '';
|
||||||
dialogForm.photoUrl = row.photoUrl;
|
|
||||||
dialogForm.photoUrlDetail = row.photoUrlDetail;
|
|
||||||
};
|
};
|
||||||
const handleDelete = (row) => {
|
const handleDelete = (row) => {
|
||||||
console.log('删除操作: ', row);
|
console.log('删除操作: ', row);
|
||||||
@ -305,17 +322,23 @@ const deleteGoods = async (ids) => {
|
|||||||
};
|
};
|
||||||
const onSaveCategory = () => {
|
const onSaveCategory = () => {
|
||||||
console.log(dialogForm);
|
console.log(dialogForm);
|
||||||
|
if (dialogForm.landId == '') {
|
||||||
|
landSelectRef.value.handleChange();
|
||||||
|
return;
|
||||||
|
}
|
||||||
dialogRef.value.validate(async (valid, fields) => {
|
dialogRef.value.validate(async (valid, fields) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
try {
|
try {
|
||||||
let param = { ...dialogForm };
|
let param = { ...dialogForm };
|
||||||
param.classifyId = dialogForm.classifyId.join(',');
|
param.useTime = dialogForm.detectionTime;
|
||||||
param.classifyName = dialogForm.classifyName.join(',');
|
|
||||||
console.log(param);
|
console.log(param);
|
||||||
|
// valid.businessEntityCode = dialogForm.businessEntityCode; //经营主体编码
|
||||||
|
// valid.businessEntityName = dialogForm.businessEntityName; //经营主体名称
|
||||||
let response;
|
let response;
|
||||||
if (dialogTitle.value == '新增') {
|
if (dialogTitle.value == '新增') {
|
||||||
response = await seedUseRegulatorySave(param);
|
response = await seedUseRegulatorySave(param);
|
||||||
} else {
|
} else {
|
||||||
|
param.id = dialogForm.id;
|
||||||
response = await editSeedUseRegulatory(param);
|
response = await editSeedUseRegulatory(param);
|
||||||
}
|
}
|
||||||
if (response.code == 200) {
|
if (response.code == 200) {
|
||||||
@ -341,18 +364,21 @@ const cancelDialog = async () => {
|
|||||||
};
|
};
|
||||||
const restDialogForm = () => {
|
const restDialogForm = () => {
|
||||||
Object.assign(dialogForm, {
|
Object.assign(dialogForm, {
|
||||||
id: '',
|
regionCode: '', //所属行政区域代码
|
||||||
seedName: '', //种子种苗名称
|
regionName: '', //所属行政区域名称
|
||||||
varietyName: '', //品种名称
|
gridId: '', //所属网格代码
|
||||||
brand: '', //品牌
|
gridName: '', //所属网格名称
|
||||||
manufacturer: '', //生产厂家
|
landId: '', //地块id
|
||||||
classifyId: '', //蔬菜种苗id
|
landName: '', //地块名称
|
||||||
classifyName: '', //蔬菜种苗名称
|
name: '', //姓名
|
||||||
productSpecification: '', //产品规格(number)
|
phone: '', //联系方式
|
||||||
productUnit: '', //产品规格单位
|
provenanceId: '', //种子名称id
|
||||||
productAttributes: '', //自定义商品属性
|
provenanceName: '', //种子名称
|
||||||
photoUrl: '', //种子种苗主图
|
useNumber: 1, //使用量
|
||||||
photoUrlDetail: '', //种子种苗详情图
|
useUnit: 'g', //使用量单位
|
||||||
|
useTime: '', //使用时间
|
||||||
|
businessEntityCode: '', //经营主体编码
|
||||||
|
businessEntityName: '', //经营主体名称
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -374,46 +400,45 @@ const getSeedTypeList = async () => {
|
|||||||
console.error(error);
|
console.error(error);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
// 级联选择器配置
|
|
||||||
const cascaderProps = ref({
|
|
||||||
label: 'dataName', // 选项标签字段名
|
|
||||||
value: 'id', // 选项值字段名
|
|
||||||
children: 'children', // 子选项字段名
|
|
||||||
emitPath: true,
|
|
||||||
expandTrigger: 'hover',
|
|
||||||
});
|
|
||||||
const handleCascaderChange = () => {
|
|
||||||
const selectedNames = getSelectedNames(dialogForm.classifyId);
|
|
||||||
console.log('对应的名称:', selectedNames); // 例如: ['花草类种子', '具体种子名称']
|
|
||||||
// 如果需要,可以将名称也保存到表单数据中
|
|
||||||
dialogForm.classifyName = selectedNames;
|
|
||||||
};
|
|
||||||
const getSelectedNames = (ids) => {
|
|
||||||
if (!ids || !ids.length) return [];
|
|
||||||
|
|
||||||
let names = [];
|
|
||||||
let currentLevel = seedTypeDialogList.value;
|
|
||||||
|
|
||||||
for (const id of ids) {
|
|
||||||
const foundItem = currentLevel.find((item) => item.id === id);
|
|
||||||
if (!foundItem) break;
|
|
||||||
|
|
||||||
names.push(foundItem.dataName);
|
|
||||||
currentLevel = foundItem.children || [];
|
|
||||||
}
|
|
||||||
|
|
||||||
return names;
|
|
||||||
};
|
|
||||||
|
|
||||||
const unitList = ref([
|
const unitList = ref([
|
||||||
{ id: '1', unit: 'kg' },
|
{ dictCode: '52', dictValue: 'g' },
|
||||||
{ id: '2', unit: 'g' },
|
{ dictCode: '53', dictValue: 'kg' },
|
||||||
{ id: '3', unit: 'L' },
|
|
||||||
{ id: '4', unit: 'ml' },
|
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
const landSelectList = ref([]);
|
||||||
|
const getLandsList = async () => {
|
||||||
|
let res = await getLandList();
|
||||||
|
if (res.code == 200) {
|
||||||
|
landSelectList.value = res.data;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const handleLandChange = (val) => {
|
||||||
|
console.log(val);
|
||||||
|
if (val) {
|
||||||
|
getDetails();
|
||||||
|
} else {
|
||||||
|
restDialogForm();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const getEntityOptions = async () => {
|
||||||
|
let res = await GetDictTypeInfo('sys_use_supervise_number');
|
||||||
|
console.log(res);
|
||||||
|
if (res.code == 200) {
|
||||||
|
unitList.value = res.data;
|
||||||
|
} else {
|
||||||
|
unitList.value = [
|
||||||
|
{ dictCode: '52', dictValue: 'g' },
|
||||||
|
{ dictCode: '53', dictValue: 'kg' },
|
||||||
|
];
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
onSubmit();
|
onSubmit();
|
||||||
|
getLandsList();
|
||||||
|
getEntityOptions();
|
||||||
// getSeedTypeList();
|
// getSeedTypeList();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
@ -434,4 +459,23 @@ onMounted(() => {
|
|||||||
height: 100px;
|
height: 100px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 必须使用深度选择器 + 精确DOM层级 */
|
||||||
|
.custom-descriptions :deep(.el-descriptions__body) table.el-descriptions__table {
|
||||||
|
table-layout: fixed; /* 关键属性1:强制等宽 */
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.custom-descriptions :deep(.el-descriptions__label) {
|
||||||
|
width: 130px !important; /* 关键属性2:固定宽度 */
|
||||||
|
min-width: 130px !important;
|
||||||
|
max-width: 130px !important;
|
||||||
|
background: #f5f7fa;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: left;
|
||||||
|
padding-right: 20px;
|
||||||
|
}
|
||||||
|
.custom-descriptions :deep(.el-descriptions__content) {
|
||||||
|
width: calc(100% - 130px) !important; /* 自动填充剩余空间 */
|
||||||
|
word-break: break-word;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user