|
@@ -0,0 +1,264 @@
|
|
|
+<template>
|
|
|
+ <BasicModal
|
|
|
+ v-bind="$attrs"
|
|
|
+ @register="register"
|
|
|
+ :title="title"
|
|
|
+ @visible-change="handleVisibleChange"
|
|
|
+ @cancel="resetFields"
|
|
|
+ @ok="handleSubmit"
|
|
|
+ :min-height="400"
|
|
|
+ >
|
|
|
+ <div class="pt-2px pr-3px">
|
|
|
+ <BasicForm @register="registerForm">
|
|
|
+ <template #text="{ model, field }">
|
|
|
+ {{ model[field] }}
|
|
|
+ </template>
|
|
|
+ </BasicForm>
|
|
|
+ </div>
|
|
|
+ </BasicModal>
|
|
|
+</template>
|
|
|
+<script lang="ts">
|
|
|
+ import { defineComponent, ref, nextTick, onMounted, reactive } from 'vue';
|
|
|
+ import { BasicModal, useModalInner } from '/@/components/Modal';
|
|
|
+ import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
|
|
|
+ import { useMessage } from '/@/hooks/web/useMessage';
|
|
|
+ import { companyAdd, companyUpdate } from '/@/api/customer';
|
|
|
+ import { useI18n } from '/@/hooks/web/useI18n';
|
|
|
+ import { uploadApi } from '/@/api/product/index';
|
|
|
+ import { useModalInner } from '/@/components/Modal';
|
|
|
+ import dayjs from 'dayjs';
|
|
|
+
|
|
|
+ const { t } = useI18n();
|
|
|
+ export default defineComponent({
|
|
|
+ components: { BasicModal, BasicForm },
|
|
|
+ props: {
|
|
|
+ userData: { type: Object },
|
|
|
+ },
|
|
|
+ emits: ['update', 'register'],
|
|
|
+ setup(props, { emit }) {
|
|
|
+ const modelRef = ref(false);
|
|
|
+ const fileFlow = reactive({
|
|
|
+ file: null,
|
|
|
+ });
|
|
|
+ const { createMessage } = useMessage();
|
|
|
+ const title = ref('新增客户')
|
|
|
+ const schemas: FormSchema[] = [
|
|
|
+ {
|
|
|
+ field: 'id',
|
|
|
+ component: 'Input',
|
|
|
+ show:false,
|
|
|
+ label: 'id',
|
|
|
+ required: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'ryid',
|
|
|
+ component: 'Input',
|
|
|
+ label: '警员ID',
|
|
|
+ required: true,
|
|
|
+ colProps: {
|
|
|
+ span: 24,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'name',
|
|
|
+ component: 'Input',
|
|
|
+ label: '姓名',
|
|
|
+ required: true,
|
|
|
+ colProps: {
|
|
|
+ span: 24,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'view',
|
|
|
+ component: 'RadioGroup',
|
|
|
+ label: '查看权限',
|
|
|
+ defaultValue: 1,
|
|
|
+ colProps: {
|
|
|
+ span: 24,
|
|
|
+ },
|
|
|
+ componentProps: {
|
|
|
+ options: [
|
|
|
+ { label: '不限时查看', value: 1 },
|
|
|
+ { label: '限时查看', value: 2 },
|
|
|
+ ],
|
|
|
+ onChange: (value) => {
|
|
|
+ updateSchema({
|
|
|
+ field: 'viewTime',ifShow:value.target.value == 2
|
|
|
+ })
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'viewTime',
|
|
|
+ component: 'DatePicker',
|
|
|
+ label: '查看到期日期',
|
|
|
+ ifShow:false,
|
|
|
+ required: true,
|
|
|
+ defaultValue:dayjs().add(1,'month').format('YYYY-MM-DD HH:mm'),
|
|
|
+ componentProps: {
|
|
|
+ disabled: false,
|
|
|
+ 'show-time': true,
|
|
|
+ valueFormat: 'YYYY-MM-DD HH:mm',
|
|
|
+ format: 'YYYY-MM-DD HH:mm',
|
|
|
+ disabledDate: (current) => {
|
|
|
+ return current && current < dayjs().endOf('day');
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'set',
|
|
|
+ component: 'RadioGroup',
|
|
|
+ label: '编辑权限',
|
|
|
+ defaultValue: 0,
|
|
|
+ colProps: {
|
|
|
+ span: 24,
|
|
|
+ },
|
|
|
+ componentProps: {
|
|
|
+ options: [
|
|
|
+ { label: '无权编辑', value: 0 },
|
|
|
+ { label: '不限时编辑', value: 1 },
|
|
|
+ { label: '限时编辑', value: 2 },
|
|
|
+ ],
|
|
|
+ onChange: (value) => {
|
|
|
+ updateSchema({
|
|
|
+ field: 'setTime', ifShow: value.target.value == 2,
|
|
|
+ })
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'setTime',
|
|
|
+ component: 'DatePicker',
|
|
|
+ label: '编辑到期日期',
|
|
|
+ ifShow: false,
|
|
|
+ required: true,
|
|
|
+ defaultValue: dayjs().add(1, 'month').format('YYYY-MM-DD HH:mm'),
|
|
|
+ componentProps: {
|
|
|
+ disabled: false,
|
|
|
+ 'show-time': true,
|
|
|
+ valueFormat: 'YYYY-MM-DD HH:mm',
|
|
|
+ format: 'YYYY-MM-DD HH:mm',
|
|
|
+ disabledDate: (current) => {
|
|
|
+ return current && current < dayjs().endOf('day');
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'empower',
|
|
|
+ component: 'RadioGroup',
|
|
|
+ label: '是否可授权他人',
|
|
|
+ defaultValue: 0,
|
|
|
+ colProps: {
|
|
|
+ span: 24,
|
|
|
+ },
|
|
|
+ componentProps: {
|
|
|
+ options: [
|
|
|
+ { label: '不可授权', value: 0 },
|
|
|
+ { label: '可授权他人', value: 1 },
|
|
|
+ ],
|
|
|
+ onChange: (value) => {
|
|
|
+ updateSchema({
|
|
|
+ field: 'isEmpower', ifShow: value.target.value == 1,
|
|
|
+ })
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'isEmpower',
|
|
|
+ component: 'CheckboxGroup',
|
|
|
+ label: '授权他人权限',
|
|
|
+ ifShow: false,
|
|
|
+ colProps: {
|
|
|
+ span: 24,
|
|
|
+ },
|
|
|
+ componentProps: {
|
|
|
+ options: [
|
|
|
+ { label: '查看权限', value: 0 },
|
|
|
+ { label: '编辑权限', value: 1 },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ const [registerForm, { validate, resetFields, setFieldsValue, updateSchema }] = useForm({
|
|
|
+ labelWidth: 120,
|
|
|
+ schemas,
|
|
|
+ showActionButtonGroup: false,
|
|
|
+ actionColOptions: {
|
|
|
+ span: 24,
|
|
|
+ },
|
|
|
+ });
|
|
|
+
|
|
|
+ onMounted(() => {});
|
|
|
+ let addListFunc = () => {};
|
|
|
+ const [register, { closeModal }] = useModalInner((data) => {
|
|
|
+ console.log('data',data)
|
|
|
+ if (data) {
|
|
|
+ title.value =data.id?'编辑授权':'新增授权'
|
|
|
+ modelRef.value = data.id?true:false;
|
|
|
+ setFieldsValue(data);
|
|
|
+ }else{
|
|
|
+ title.value ='新增客户'
|
|
|
+ }
|
|
|
+ updateSchema([
|
|
|
+ {field: 'isEmpower', ifShow: false,},
|
|
|
+ {field: 'setTime', ifShow: false,},
|
|
|
+ {field: 'viewTime', ifShow: false,},
|
|
|
+ ])
|
|
|
+ });
|
|
|
+
|
|
|
+ // function onDataReceive(data) {
|
|
|
+ // modelRef.value = data;
|
|
|
+ // resetFields();
|
|
|
+ // setFieldsValue({
|
|
|
+ // type: data.sceneName,
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ const handleSubmit = async () => {
|
|
|
+ try {
|
|
|
+ const params = await validate();
|
|
|
+ console.log('params',params)
|
|
|
+ const apiData = {
|
|
|
+ ...params,
|
|
|
+ floorLogo: params.floorLogo && params.floorLogo[0] || '',
|
|
|
+ qrLogo: params.qrLogo && params.qrLogo[0] || '',
|
|
|
+ topLogo: params.topLogo && params.topLogo[0] || '',
|
|
|
+ };
|
|
|
+ console.log(modelRef.value);
|
|
|
+ let tips: string;
|
|
|
+ if (modelRef.value) {
|
|
|
+ // apiData.id = modelRef.value.id;
|
|
|
+ await companyUpdate(apiData);
|
|
|
+ tips = '修改成功。';
|
|
|
+ } else {
|
|
|
+ tips = '添加成功。';
|
|
|
+ await companyAdd(apiData);
|
|
|
+ }
|
|
|
+
|
|
|
+ closeModal();
|
|
|
+ resetFields();
|
|
|
+ emit('update');
|
|
|
+ createMessage.success(tips);
|
|
|
+ } catch (error) {
|
|
|
+ console.log('not passing', error);
|
|
|
+ }
|
|
|
+ };
|
|
|
+ function handleVisibleChange(_) {
|
|
|
+ // console.log(v);
|
|
|
+ // v && props.userData && nextTick(() => onDataReceive(props.userData));
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ register,
|
|
|
+ schemas,
|
|
|
+ registerForm,
|
|
|
+ modelRef,
|
|
|
+ fileFlow,
|
|
|
+ handleVisibleChange,
|
|
|
+ handleSubmit,
|
|
|
+ addListFunc,
|
|
|
+ resetFields,
|
|
|
+ title,
|
|
|
+ t,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ });
|
|
|
+</script>
|