geg-gas/geg-gas-web
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

上下载点

Browse Source
This commit is contained in:
‘huanghaiixia’
2025-10-28 13:54:40 +08:00
parent c028a6fcc6
commit a2c499e65d
11 changed files with 301 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Form/src/componentMap.ts
View File

@ -22,6 +22,7 @@ import ApiTreeSelect from './components/ApiTreeSelect.vue';
import ApiCascader from './components/ApiCascader.vue';
import SelectDepartment from './components/SelectDepartment.vue';
import SelectDepartmentV2 from './components/SelectDepartmentV2.vue';
import SelectPipeline from './components/SelectPipeline.vue';
import SelectUser from './components/SelectUser.vue';
import SelectUserV2 from './components/SelectUserV2.vue';
import SelectUserShowTree from './components/SelectUserShowTree.vue';
@ -105,6 +106,7 @@ componentMap.set('Slider', Slider);
componentMap.set('Rate', Rate);
componentMap.set('DeptTree', SelectDepartment);
componentMap.set('Dept', SelectDepartmentV2);
componentMap.set('SelectPipeline', SelectPipeline);
componentMap.set('User', SelectUserV2);
componentMap.set('UserTree', SelectUserShowTree);
componentMap.set('Info', CommonInfo);

214
src/components/Form/src/components/SelectPipeline.vue Normal file
View File

@ -0,0 +1,214 @@
<template>
<div class="depart-select" style="width: 100%" @click="show">
<div v-if="disabled && !disabledShowBorder" :class="wordWrap ? '' : 'field-readonly'" :title="departNames">
{{ departNames }}
</div>
<a-input v-model:value="departNames" v-if="disabledShowBorder || !disabled" :bordered="bordered" :disabled="disabled" :placeholder="placeholder" :size="size" readonly>
<template v-if="prefix" #prefix>
<Icon :icon="prefix" />
</template>
<template v-if="suffix" #suffix>
<Icon :icon="suffix" />
</template>
</a-input>
<ModalPanel title="选择管道" :visible="visible" :width="1000" class="depart-select-dialog" @close="close" @submit="submit">
<BasicTable @register="registerTable" ref="tableRef" ></BasicTable>
</ModalPanel>
</div>
</template>
<script lang="ts" setup>
import { onMounted, ref, watch,reactive } from 'vue';
import Icon from '/@/components/Icon/index';
import { getLngBPngLinePage} from '/@/api/mdm/PipelineGgasLine';
import { useI18n } from '/@/hooks/web/useI18n';
import { camelCaseString } from '/@/utils/stringUtil';
import { ModalPanel } from '/@/components/ModalPanel/index';
import { BasicTable, useTable, TableAction, ActionItem } from '/@/components/Table';
import {columns} from '/@/views/mdm/Bank/components/config'
const emits = defineEmits(['change', 'changeNames', 'close', 'options-change', 'update:value']);
const selectedKeys = ref<string[]>([]);
const selectedValues = ref([]);
const [registerTable, { reload, }] = useTable({
api: getLngBPngLinePage,
rowKey: 'code',
columns: columns,
formConfig: {
schemas: [],
fieldMapToTime: [],
showResetButton: false,
showSubmitButton: false
},
beforeFetch: (params) => {
return { ...params, PK: 'id' };
},
useSearchForm: false,
showTableSetting: true,
striped: false,
rowSelection: {
type: 'radio',
onChange: onSelectChange
},
tableSetting: {
size: false,
setting: false,
},
});
function onSelectChange(rowKeys: string[], e) {
selectedKeys.value = rowKeys;
selectedValues.value = e
}
const visible = ref(false);
const departNames = ref();
const valChanged = ref(false);
const props = defineProps({
prefix: String,
suffix: String,
placeholder: String,
readonly: Boolean,
disabled: Boolean,
parentNode: String,
size: String,
value: {
type: String || Array
},
isArray: {
type: Boolean,
default: false
},
bordered: {
type: Boolean,
default: true
},
multiple: {
type: Boolean,
default: false
},
componentProps: {
type: Object,
default: {}
},
sepTextField: '', // 将文字描述存在独立字段，增加首次渲染速度
row: Object,
defaultDeptField: {
// 默认选择公司范围key值
type: String,
default: ''
},
wordWrap: {
type: Boolean,
default: false
},
disabledShowBorder: {
type: Boolean,
default: false
},
formData: Object
});
const selectedNodes = ref([]);
const loading = ref(true);
onMounted(() => {});
watch(
() => props.value,
(val) => {
let ids = props.isArray ? val?.join(',') : val;
if (ids) {
getDefaultList(props.value)
selectedKeys.value = [props.value]
} else {
departNames.value = '';
selectedNodes.value = [];
selectedKeys.value = []
selectedValues.value = []
}
},
{
immediate: true
}
);
function updateSepTextField(v) {
if (!props.sepTextField || !props.row) {
return;
}
props.row[camelCaseString(props.sepTextField)] = v;
}
async function getDefaultList(ids) {
let param = {
code: ids,
};
let {list} = await getLngBPngLinePage(param);
selectedNodes.value = list;
let nameList = selectedNodes.value.map((item) => item.fullName);
const names = nameList.join(',');
departNames.value = names;
updateSepTextField(names);
}
function show() {
if (props.disabled) {
return;
}
visible.value = true;
loading.value = true;
if (props.value) {
if (props.isArray && !props.value.length) {
return;
}
let ids = props.isArray ? props.value.join(',') : props.value;
getDefaultList(ids);
}
}
function submit() {
emits('update:value', props.isArray ? selectedValues.value : selectedKeys.value[0]);
departNames.value = selectedValues.value[0].fullName;
updateSepTextField( selectedValues.value[0].fullName);
emits('change', props.isArray ? selectedValues.value[0] : selectedKeys.value[0]);
close();
}
function close() {
visible.value = false;
selectedNodes.value = [];
emits('close');
}
</script>
<style lang="less">
.depart-select-dialog {
.content {
margin-bottom: 0;
}
}
</style>
<style lang="less" scoped>
.field-readonly {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
</style>

3
src/components/Form/src/types/index.ts
View File

@ -126,6 +126,7 @@ export type ComponentType =
| 'Divider'
| 'DeptTree'
| 'Dept'
| 'SelectPipeline'
| 'User'
| 'UserTree'
| 'Info'
@ -160,7 +161,7 @@ export type ComponentType =
| 'ErpCheck'
| 'FormView'
| 'XjrIframe'
| 'CustomComponent'
| 'CustomComponent'
| 'TableLayout';
/**

2
src/components/SimpleForm/componentMap.ts
View File

@ -28,6 +28,7 @@ import ApiTree from './components/ApiTree.vue';
import ApiTreeSelect from './components/ApiTreeSelect.vue';
import ApiCascader from './components/ApiCascader.vue';
import SelectDepartment from './components/SelectDepartment.vue';
import SelectPipeline from './components/SelectPipeline.vue';
import SelectUser from './components/SelectUser.vue';
import CommonInfo from './components/CommonInfo.vue';
import SelectArea from './components/SelectArea.vue';
@ -67,6 +68,7 @@ componentMap.set('Cascader', Cascader);
componentMap.set('Slider', Slider);
componentMap.set('Rate', Rate);
componentMap.set('Dept', SelectDepartment);
componentMap.set('SelectPipeline', SelectPipeline);
componentMap.set('User', SelectUser);
componentMap.set('Info', CommonInfo);
componentMap.set('Area', SelectArea);

1
src/components/SimpleForm/types/index.ts
View File

@ -249,4 +249,5 @@ export type ComponentType =
| 'Info'
| 'Area'
| 'AreaCascader'
| 'SelectPipeline'
| 'Text'

2
src/utils/helper/designHelper.ts
View File

@ -614,7 +614,7 @@ export function buildAppComponentType(type: string): AppComponentType {
case 'select':
return AppComponentType.select;
case 'selectpipeline':
case 'area':
case 'areacascader':
case 'cascader':

45
src/views/mdm/PipeGasDownloadPoint/components/Form.vue
View File

@ -7,10 +7,11 @@
/>
</template>
<script lang="ts" setup>
import { reactive, ref,onBeforeMount,onMounted } from 'vue';
import { reactive, ref,onBeforeMount,onMounted,watch } from 'vue';
import { formProps, formEventConfigs ,formConfig} from './config';
import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
import { addLngBStationPng, getLngBStationPng, updateLngBStationPng, deleteLngBStationPng } from '/@/api/mdm/PipeGasDownloadPoint';
import { getIngStation } from '/@/api/mdm/PipelineGgasLine';
import { cloneDeep } from 'lodash-es';
import { FormDataProps } from '/@/components/Designer/src/types';
import { usePermission } from '/@/hooks/web/usePermission';
@ -24,16 +25,16 @@
const { filterFormSchemaAuth } = usePermission();
const { mergeFormSchemas,mergeFormEventConfigs } = useFormConfig();
const { currentRoute } = useRouter();
const isView = currentRoute.value.query.isView
const RowKey = 'id';
const emits = defineEmits(['changeUploadComponentIds','loadingCompleted', 'form-mounted']);
const props = defineProps({
fromPage: {
type: Number,
default: FromPageType.MENU,
},
}
});
const systemFormRef = ref();
const systemFormRef = ref({});
const data: { formDataProps: FormDataProps } = reactive({
formDataProps: {schemas:[]} as FormDataProps,
});
@ -42,8 +43,42 @@
});
let customFormEventConfigs=[];
watch(
() => getFormModel(),
(newVal) => {
if (newVal.ownSign === 'Y') {
data.formDataProps.schemas?.forEach(v => {
if (v.field === 'staCodeLng') {
v.componentProps.disabled = (isView ? true : false)
v.componentProps.required = true
}
})
} else {
data.formDataProps.schemas?.forEach(v => {
if (v.field === 'staCodeLng') {
v.componentProps.disabled = true
v.componentProps.required = false
}
})
}
},
{ deep: true }
);
onMounted(async () => {
const a = await getIngStation({ownSign :'Y', valid : 'Y'})
const b = a.map(v => {
return {
label: v.fullName,
value: v.code
}
})
formProps.schemas?.forEach(v => {
if (v.field === 'staCodeLng') {
v.componentProps.staticOptions = b
v.componentProps.disabled = (isView ? true : false)
}
})
try {
// 合并渲染覆盖配置中的字段配置、表单事件配置
await mergeCustomFormRenderConfig();

61
src/views/mdm/PipeGasDownloadPoint/components/config.ts
View File

@ -448,11 +448,12 @@ export const formProps: FormProps = {
key: 'ce59b928624a4277992077bd11f54e70',
field: 'pipelineCode',
label: '管道',
type: 'input',
component: 'Input',
type: 'selectpipeline',
component: 'SelectPipeline',
colProps: { span: 8 },
defaultValue: '',
componentProps: {
getPopupContainer: () => document.body,
width: '100%',
span: '',
defaultValue: '',
@ -462,7 +463,7 @@ export const formProps: FormProps = {
respNewRow: false,
placeholder: '请输入管道',
prefix: '',
suffix: '',
suffix: 'ant-design:ellipsis-outlined',
addonBefore: '',
addonAfter: '',
disabled: false,
@ -601,7 +602,7 @@ export const formProps: FormProps = {
allowClear: false,
showLabel: true,
required: false,
rules: [],
rules: [{ pattern: '/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/', message: '邮箱格式错误\n' }],
events: {},
isSave: false,
isShow: true,
@ -613,8 +614,8 @@ export const formProps: FormProps = {
key: 'fa55f80f74364d5b95ed2d7a77f20e55',
field: 'regionCode',
label: '行政区域',
type: 'select',
component: 'XjrSelect',
type: 'areacascader',
component: 'AreaCascader',
colProps: { span: 8 },
componentProps: {
width: '100%',
@ -623,34 +624,19 @@ export const formProps: FormProps = {
labelFixWidth: 120,
responsive: false,
respNewRow: false,
placeholder: '请选择下拉选择',
sepTextField: '',
placeholder: '请选择区域',
showLabel: true,
showSearch: false,
clearable: false,
disabled: false,
mode: '',
staticOptions: [
{ key: 1, label: 'Option 1', value: 'Option 1' },
{ key: 2, label: 'Option 2', value: 'Option 2' },
{ key: 3, label: 'Option 3', value: 'Option 3' },
],
defaultSelect: '',
datasourceType: 'staticData',
labelField: 'label',
valueField: 'value',
apiConfig: {
path: 'CodeGeneration/selection',
method: 'GET',
apiId: '93d735dcb7364a0f8102188ec4d77ac7',
},
dicOptions: [],
allowClear: true,
clearable: false,
required: false,
rules: [],
events: {},
isShow: true,
style: { width: '100%' },
},
fieldNames: {label: 'fullName', value: 'code', children: 'children'},
excludeType: 'CONTINENT'
}
},
{
key: '56e88c926247465caf62c6c52747205d',
@ -778,9 +764,9 @@ export const formProps: FormProps = {
disabled: false,
mode: '',
staticOptions: [
{ key: 1, label: 'Option 1', value: 'Option 1' },
{ key: 2, label: 'Option 2', value: 'Option 2' },
{ key: 3, label: 'Option 3', value: 'Option 3' },
// { key: 1, label: 'Option 1', value: 'Option 1' },
// { key: 2, label: 'Option 2', value: 'Option 2' },
// { key: 3, label: 'Option 3', value: 'Option 3' },
],
defaultSelect: '',
datasourceType: 'staticData',
@ -819,15 +805,14 @@ export const formProps: FormProps = {
showSearch: false,
clearable: false,
disabled: false,
mode: 'multiple',
staticOptions: [
{ key: 1, label: 'Option 1', value: 'Option 1' },
{ key: 2, label: 'Option 2', value: 'Option 2' },
{ key: 3, label: 'Option 3', value: 'Option 3' },
],
defaultSelect: '',
datasourceType: 'api',
labelField: 'label',
datasourceType: 'dic',
params: { itemId: '1978056598125330433' },
labelField: 'name',
valueField: 'value',
apiConfig: {
path: 'CodeGeneration/selection',
@ -835,10 +820,11 @@ export const formProps: FormProps = {
apiId: '93d735dcb7364a0f8102188ec4d77ac7',
},
dicOptions: [],
required: false,
required: true,
rules: [],
events: {},
isShow: true,
itemId: '1978056598125330433',
style: { width: '100%' },
},
},
@ -849,14 +835,15 @@ export const formProps: FormProps = {
type: 'number',
component: 'InputNumber',
colProps: { span: 8 },
defaultValue: 0,
defaultValue: '',
componentProps: {
labelWidthMode: 'fix',
labelFixWidth: 120,
responsive: false,
width: '100%',
span: '',
defaultValue: 0,
min:0,
defaultValue: '',
step: 1,
disabled: false,
showLabel: true,

13
src/views/mdm/PipeGasDownloadPoint/index.vue
View File

@ -102,7 +102,7 @@
},
schemas: customSearchFormSchema,
fieldMapToTime: [],
showResetButton: false,
showResetButton: true,
},
beforeFetch: (params) => {
return { ...params, FormId: formIdComputedRef.value, PK: 'id' };
@ -121,13 +121,19 @@
dataIndex: 'action',
slots: { customRender: 'action' },
},
rowSelection: {
type: 'checkbox',
onChange: onSelectChange
},
tableSetting: {
size: false,
setting: false,
},
});
function onSelectChange(rowKeys: string[]) {
selectedKeys.value = rowKeys;
}
function dbClickRow(record) {
if (!actionButtonConfig?.value.some(element => element.code == 'view')) {
return;
@ -158,7 +164,8 @@
query: {
formPath: 'mdm/PipeGasDownloadPoint',
formName: formName,
formId:currentRoute.value.meta.formId
formId:currentRoute.value.meta.formId,
isView: true
}
});
}

5
src/views/mdm/PipelineGgasLine/components/Form.vue
View File

@ -24,7 +24,7 @@
const { filterFormSchemaAuth } = usePermission();
const { mergeFormSchemas,mergeFormEventConfigs } = useFormConfig();
const { currentRoute } = useRouter();
const isView = currentRoute.value.query.isView
const RowKey = 'id';
const emits = defineEmits(['changeUploadComponentIds','loadingCompleted', 'form-mounted']);
const props = defineProps({
@ -52,7 +52,7 @@ watch(
if (newVal.ownSign === 'Y') {
data.formDataProps.schemas?.forEach(v => {
if (v.field === 'staCodeLng') {
v.componentProps.disabled = false
v.componentProps.disabled = (isView ? true : false)
v.componentProps.required = true
}
})
@ -80,6 +80,7 @@ watch(
formProps.schemas?.forEach(v => {
if (v.field === 'staCodeLng') {
v.componentProps.staticOptions = b
v.componentProps.disabled = (isView ? true : false)
}
})
try {

3
src/views/mdm/PipelineGgasLine/index.vue
View File

@ -164,7 +164,8 @@
query: {
formPath: 'mdm/PipelineGgasLine',
formName: formName,
formId:currentRoute.value.meta.formId
formId:currentRoute.value.meta.formId,
isView:true
}
});
}