|
|
@@ -7,7 +7,23 @@
|
|
|
:min-height="150"
|
|
|
@ok="handleOk"
|
|
|
>
|
|
|
- <BasicForm @register="registerForm" />
|
|
|
+ <BasicForm @register="registerForm" >
|
|
|
+ <template #selectUser="{ model, field }">
|
|
|
+ <Select
|
|
|
+ v-model:value="model[field]"
|
|
|
+ show-search
|
|
|
+ placeholder="请输入姓名/手机号码/身份证号码搜索"
|
|
|
+ style="width: 350px; text-align: left"
|
|
|
+ :default-active-first-option="false"
|
|
|
+ :show-arrow="false"
|
|
|
+ :filter-option="false"
|
|
|
+ not-found-content="暂无数据"
|
|
|
+ :options="options"
|
|
|
+ @search="fetchUser"
|
|
|
+ @change="handleChange"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </BasicForm>
|
|
|
</BasicModal>
|
|
|
</template>
|
|
|
<script lang="ts">
|
|
|
@@ -16,13 +32,15 @@
|
|
|
import { BasicModal, useModalInner } from '/@/components/Modal';
|
|
|
import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
|
|
|
import { useI18n } from '/@/hooks/web/useI18n';
|
|
|
+ import { Select } from 'ant-design-vue';
|
|
|
+ import { debounce } from 'lodash-es';
|
|
|
import { useMessage } from '/@/hooks/web/useMessage';
|
|
|
import { useUserStore } from '/@/store/modules/user';
|
|
|
- import { addOrUpdate } from '/@/api/jyUserPlatform/index';
|
|
|
+ import { addOrUpdate, queryByKey } from '/@/api/jyUserPlatform/index';
|
|
|
import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard';
|
|
|
const { t } = useI18n();
|
|
|
export default defineComponent({
|
|
|
- components: { BasicModal, BasicForm },
|
|
|
+ components: { BasicModal, BasicForm, Select },
|
|
|
props: {
|
|
|
userData: { type: Object },
|
|
|
},
|
|
|
@@ -31,9 +49,31 @@
|
|
|
const modelRef = ref({});
|
|
|
const userStore = useUserStore();
|
|
|
const userinfo = computed(() => userStore.getUserInfo);
|
|
|
+ const options = ref([]);
|
|
|
const preventAutoFill = ref(true);
|
|
|
const { companyId } = userinfo.value;
|
|
|
console.log('companyId', companyId);
|
|
|
+ let lastFetchId = 0;
|
|
|
+ const fetchUser = debounce((value) => {
|
|
|
+ if (!value) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ lastFetchId += 1;
|
|
|
+ const fetchId = lastFetchId;
|
|
|
+ options.value = [];
|
|
|
+ queryByKey({ queryKey: value }).then((res) => {
|
|
|
+ console.log('queryByKey', res);
|
|
|
+ setFieldsValue({idkey: null,});
|
|
|
+ const data = res.map((user) => ({
|
|
|
+ ...user,
|
|
|
+ label: `${user.name}/${user.phone || '暂无手机号码'}/${user.idCard || '暂无身份证'}/${
|
|
|
+ user.platformName || '未分配'
|
|
|
+ }`,
|
|
|
+ value: user.id,
|
|
|
+ }));
|
|
|
+ options.value = data;
|
|
|
+ });
|
|
|
+ }, 300);
|
|
|
const schemas: FormSchema[] = [
|
|
|
{
|
|
|
field: 'label1',
|
|
|
@@ -65,6 +105,36 @@
|
|
|
},
|
|
|
},
|
|
|
{
|
|
|
+ field: 'addType',
|
|
|
+ component: 'RadioGroup',
|
|
|
+ label: '用户类型',
|
|
|
+ defaultValue: 'new',
|
|
|
+ required: true,
|
|
|
+ colProps: {
|
|
|
+ span: 24,
|
|
|
+ },
|
|
|
+ componentProps: {
|
|
|
+ options: [
|
|
|
+ { label: '添加新用户', value: 'new' },
|
|
|
+ { label: '搜索平台用户', value: 'old' },
|
|
|
+ ],
|
|
|
+ onChange: (e) => {
|
|
|
+ let addType = e.target.value;
|
|
|
+ console.log('data', addType);
|
|
|
+ updateSchema([{
|
|
|
+ field: 'name',
|
|
|
+ ifShow: addType !== 'old',
|
|
|
+ },{
|
|
|
+ field: 'idCard',
|
|
|
+ ifShow: addType !== 'old',
|
|
|
+ },{
|
|
|
+ field: 'idkey',
|
|
|
+ ifShow: addType == 'old',
|
|
|
+ }])
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
field: 'name',
|
|
|
component: 'Input',
|
|
|
label: '姓名',
|
|
|
@@ -106,18 +176,21 @@
|
|
|
maxLength: 18,
|
|
|
},
|
|
|
},
|
|
|
- // {
|
|
|
- // field: 'phone',
|
|
|
- // component: 'Input',
|
|
|
- // required: true,
|
|
|
- // label: '手机号码',
|
|
|
- // colProps: {
|
|
|
- // span: 20,
|
|
|
- // },
|
|
|
- // componentProps: {
|
|
|
- // maxLength: 15,
|
|
|
- // },
|
|
|
- // },
|
|
|
+ {
|
|
|
+ field: 'idkey',
|
|
|
+ component: 'Input',
|
|
|
+ label: '账号查询',
|
|
|
+ required: true,
|
|
|
+ ifShow: false,
|
|
|
+ colProps: {
|
|
|
+ span: 20,
|
|
|
+ },
|
|
|
+ slot: 'selectUser',
|
|
|
+ componentProps: {
|
|
|
+ placeholder: '请输入姓名/手机号码/身份证号码搜索',
|
|
|
+ onChange: fetchUser,
|
|
|
+ },
|
|
|
+ },
|
|
|
{
|
|
|
field: 'id',
|
|
|
component: 'Input',
|
|
|
@@ -159,6 +232,9 @@
|
|
|
});
|
|
|
}, 200);
|
|
|
}
|
|
|
+ function handleChange(value, b) {
|
|
|
+ active.value = b;
|
|
|
+ }
|
|
|
function companyIdChange(companyId) {
|
|
|
// resetFields(['permList'])
|
|
|
updateSchema([
|
|
|
@@ -293,7 +369,9 @@
|
|
|
registerForm,
|
|
|
modelRef,
|
|
|
handleOk,
|
|
|
+ handleChange,
|
|
|
resetFields,
|
|
|
+ fetchUser,
|
|
|
};
|
|
|
},
|
|
|
});
|