forked from b2894lxlx/tuanwei-admin
调整
This commit is contained in:
@@ -1,912 +0,0 @@
|
||||
<!-- 编辑弹窗 -->
|
||||
<template>
|
||||
<ele-modal
|
||||
width="80%"
|
||||
:visible="visible"
|
||||
:maskClosable="false"
|
||||
:maxable="maxable"
|
||||
:title="isUpdate ? '编辑企业' : '添加企业'"
|
||||
:body-style="{ paddingBottom: '28px' }"
|
||||
@update:visible="updateVisible"
|
||||
@ok="save"
|
||||
>
|
||||
<div style="background-color: #f3f3f3; padding: 8px">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:label-col="{ md: { span: 7 }, sm: { span: 4 }, xs: { span: 24 } }"
|
||||
:wrapper-col="{ md: { span: 17 }, sm: { span: 20 }, xs: { span: 24 } }"
|
||||
>
|
||||
<a-card title="基本信息" :bordered="false">
|
||||
<a-row :gutter="16">
|
||||
<a-col
|
||||
v-bind="styleResponsive ? { md: 8, sm: 24, xs: 24 } : { span: 8 }"
|
||||
>
|
||||
<div class="upload-image">
|
||||
<ele-image-upload
|
||||
v-model:value="images"
|
||||
:item-style="{ width: '120px', height: '120px' }"
|
||||
:limit="1"
|
||||
@upload="onUpload"
|
||||
/>
|
||||
</div>
|
||||
<a-form-item label="企业ID" name="companyId">
|
||||
{{ form.companyId }}
|
||||
</a-form-item>
|
||||
<a-form-item label="企业名称">
|
||||
{{ form.companyName }}
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
v-bind="styleResponsive ? { md: 8, sm: 24, xs: 24 } : { span: 8 }"
|
||||
>
|
||||
<a-form-item label="企业名称" name="companyName">
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="请输入企业名称"
|
||||
v-model:value="form.companyName"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="客户标识" name="companyCode">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请输入社会统一信用代码"
|
||||
v-model:value="form.companyCode"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="所属区域" name="region">
|
||||
<regions-select
|
||||
v-model:value="city"
|
||||
valueField="label"
|
||||
placeholder="请选择省市区"
|
||||
class="ele-fluid"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="企业域名" name="domain">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请填写企业域名"
|
||||
v-model:value="form.domain"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="联系电话" name="phone">
|
||||
<a-input
|
||||
allow-clear
|
||||
:maxlength="20"
|
||||
placeholder="请填写联系电话"
|
||||
v-model:value="form.phone"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
v-bind="styleResponsive ? { md: 8, sm: 24, xs: 24 } : { span: 8 }"
|
||||
>
|
||||
<a-form-item label="企业简称" name="shortName">
|
||||
<a-input
|
||||
allow-clear
|
||||
placeholder="请输入企业简称"
|
||||
v-model:value="form.shortName"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="企业类型" name="companyType">
|
||||
<DictSelect
|
||||
dict-code="CompanyType"
|
||||
placeholder="请选择企业类型"
|
||||
v-model:value="form.companyType"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="所属区域" name="region">
|
||||
<a-input-group compact>
|
||||
<a-input
|
||||
disabled
|
||||
style="width: calc(100% - 32px)"
|
||||
v-model:value="form.region"
|
||||
placeholder="所属区域"
|
||||
@search="onSearch"
|
||||
/>
|
||||
<a-tooltip title="选择位置">
|
||||
<a-button @click="openMapPicker">
|
||||
<template #icon><EnvironmentOutlined /></template>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-input-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="企业描述" name="comments">
|
||||
<a-textarea
|
||||
:rows="4"
|
||||
:maxlength="200"
|
||||
placeholder="请输入企业描述"
|
||||
v-model:value="form.comments"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-card>
|
||||
<!-- <a-divider style="height: 8px" />-->
|
||||
<!-- <a-card title="开发设置" :bordered="false">-->
|
||||
<!-- <a-row :gutter="16">-->
|
||||
<!-- <a-col-->
|
||||
<!-- v-bind="styleResponsive ? { md: 8, sm: 24, xs: 24 } : { span: 8 }"-->
|
||||
<!-- >-->
|
||||
<!-- <a-form-item label="企业标识" name="appCode">-->
|
||||
<!-- <a-input-->
|
||||
<!-- allow-clear-->
|
||||
<!-- placeholder="请输入企业标识(英文字母)"-->
|
||||
<!-- v-model:value="form.appCode"-->
|
||||
<!-- @change="changeAppCode"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- <a-form-item label="企业包名" name="packageName">-->
|
||||
<!-- <a-input-->
|
||||
<!-- allow-clear-->
|
||||
<!-- placeholder="请输入企业包名"-->
|
||||
<!-- v-model:value="form.packageName"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- <a-form-item label="IP白名单" name="ipAddress">-->
|
||||
<!-- <a-input-->
|
||||
<!-- allow-clear-->
|
||||
<!-- placeholder="请输入IP白名单"-->
|
||||
<!-- v-model:value="form.ipAddress"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- </a-col>-->
|
||||
<!-- <a-col-->
|
||||
<!-- v-bind="styleResponsive ? { md: 8, sm: 24, xs: 24 } : { span: 8 }"-->
|
||||
<!-- >-->
|
||||
<!-- <a-form-item label="接口地址" name="serverUrl">-->
|
||||
<!-- <DictSelect-->
|
||||
<!-- dict-code="ServerApi"-->
|
||||
<!-- placeholder="请选择管理地址"-->
|
||||
<!-- v-model:value="form.serverUrl"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- <a-form-item label="文件服务器" name="fileUrl">-->
|
||||
<!-- <DictSelect-->
|
||||
<!-- dict-code="FileUrl"-->
|
||||
<!-- placeholder="请选择文件服务器地址"-->
|
||||
<!-- v-model:value="form.fileUrl"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- <a-form-item label="授权回调地址" name="callbackUrl">-->
|
||||
<!-- <a-input-->
|
||||
<!-- allow-clear-->
|
||||
<!-- placeholder="请输入授权回调地址"-->
|
||||
<!-- v-model:value="form.callbackUrl"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- </a-col>-->
|
||||
<!-- <a-col-->
|
||||
<!-- v-bind="styleResponsive ? { md: 8, sm: 24, xs: 24 } : { span: 8 }"-->
|
||||
<!-- >-->
|
||||
<!-- <a-form-item label="代码仓库" name="gitUrl">-->
|
||||
<!-- <a-input-->
|
||||
<!-- allow-clear-->
|
||||
<!-- placeholder="请输入git仓库地址"-->
|
||||
<!-- v-model:value="form.gitUrl"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- <a-form-item label="允许被搜索" name="gitUrl">-->
|
||||
<!-- <a-switch v-model:checked="form.search" />-->
|
||||
<!-- </a-form-item>-->
|
||||
|
||||
<!-- </a-col>-->
|
||||
<!-- </a-row>-->
|
||||
<!-- </a-card>-->
|
||||
<!-- <a-divider style="height: 8px" />-->
|
||||
<!-- <a-card title="成员管理" :bordered="false">-->
|
||||
<!-- <div class="content">-->
|
||||
<!-- <a-space-->
|
||||
<!-- style="margin-bottom: 15px"-->
|
||||
<!-- >-->
|
||||
<!-- <SelectUser-->
|
||||
<!-- :placeholder="`添加开发成员`"-->
|
||||
<!-- @done="addAppDevUser"-->
|
||||
<!-- />-->
|
||||
<!-- <SelectUser-->
|
||||
<!-- :placeholder="`添加体验成员`"-->
|
||||
<!-- @done="addAppExpUser"-->
|
||||
<!-- />-->
|
||||
<!-- </a-space>-->
|
||||
<!-- <table-->
|
||||
<!-- class="ele-table ele-table-border ele-table-stripe ele-table-medium"-->
|
||||
<!-- >-->
|
||||
<!-- <thead>-->
|
||||
<!-- <tr>-->
|
||||
<!-- <th>角色</th>-->
|
||||
<!-- <th>用户</th>-->
|
||||
<!-- <th>邮箱</th>-->
|
||||
<!-- <th>手机号码</th>-->
|
||||
<!-- <th>加入时间</th>-->
|
||||
<!-- <th>操作</th>-->
|
||||
<!-- </tr>-->
|
||||
<!-- </thead>-->
|
||||
<!-- <tbody>-->
|
||||
<!-- <tr v-for="user in appUsers">-->
|
||||
<!-- <td>-->
|
||||
<!-- <a-tag color="green" v-if="user.role === 10">体验成员</a-tag>-->
|
||||
<!-- <a-tag color="orange" v-if="user.role === 20">开发成员</a-tag>-->
|
||||
<!-- <a-tag color="red" v-if="user.role === 30">管理员</a-tag>-->
|
||||
<!-- </td>-->
|
||||
<!-- <td>-->
|
||||
<!-- <a-avatar :src="user.avatar">-->
|
||||
<!-- <template #icon>-->
|
||||
<!-- <user-outlined />-->
|
||||
<!-- </template>-->
|
||||
<!-- </a-avatar>-->
|
||||
<!-- <span style="padding-left: 5px">{{ user.nickname }}</span>-->
|
||||
<!-- </td>-->
|
||||
<!-- <td>{{ user.email }}</td>-->
|
||||
<!-- <td>{{ user.phone }}</td>-->
|
||||
<!-- <td>{{ user.createTime }}</td>-->
|
||||
<!-- <td>-->
|
||||
<!-- <div v-if="user.role !== 30">-->
|
||||
<!-- <a-->
|
||||
<!-- @click="removeUser(user)"-->
|
||||
<!-- v-if="user.status === 0"-->
|
||||
<!-- >-->
|
||||
<!-- 移除-->
|
||||
<!-- </a>-->
|
||||
<!-- <a v-else>待确认</a>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div v-else>-->
|
||||
<!-- <a>转让</a>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- </td>-->
|
||||
<!-- </tr>-->
|
||||
<!-- </tbody>-->
|
||||
<!-- </table>-->
|
||||
<!-- </div>-->
|
||||
<!-- </a-card>-->
|
||||
<!-- <a-divider style="height: 8px" />-->
|
||||
<!-- <a-card title="附件信息" :bordered="false">-->
|
||||
<!-- <a-row :gutter="16">-->
|
||||
<!-- <a-col-->
|
||||
<!-- v-bind="styleResponsive ? { md: 8, sm: 24, xs: 24 } : { span: 8 }"-->
|
||||
<!-- >-->
|
||||
<!-- <a-form-item label="原型图地址" name="prototypeUrl">-->
|
||||
<!-- <a-input-->
|
||||
<!-- allow-clear-->
|
||||
<!-- placeholder="请输入原型图地址"-->
|
||||
<!-- v-model:value="form.prototypeUrl"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- <a-form-item label="合同文件" name="parentId">-->
|
||||
<!-- <a-upload-->
|
||||
<!-- v-model:file-list="file1"-->
|
||||
<!-- name="file"-->
|
||||
<!-- action="https://file.wsdns.cn/api/file/image"-->
|
||||
<!-- :headers="{ Authorization: token }"-->
|
||||
<!-- @change="onFile1"-->
|
||||
<!-- >-->
|
||||
<!-- <a-button>-->
|
||||
<!-- <upload-outlined />-->
|
||||
<!-- 上传-->
|
||||
<!-- </a-button>-->
|
||||
<!-- </a-upload>-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- </a-col>-->
|
||||
<!-- <a-col-->
|
||||
<!-- v-bind="styleResponsive ? { md: 8, sm: 24, xs: 24 } : { span: 8 }"-->
|
||||
<!-- >-->
|
||||
<!-- <a-form-item label="项目需求文档" name="docsUrl">-->
|
||||
<!-- <a-input-->
|
||||
<!-- allow-clear-->
|
||||
<!-- placeholder="请输入腾讯文档地址"-->
|
||||
<!-- v-model:value="form.docsUrl"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- <a-form-item label="报价单" name="parentId">-->
|
||||
<!-- <a-upload-->
|
||||
<!-- v-model:file-list="file2"-->
|
||||
<!-- name="file"-->
|
||||
<!-- action="https://file.wsdns.cn/api/file/image"-->
|
||||
<!-- :headers="{ Authorization: token }"-->
|
||||
<!-- @change="onFile2"-->
|
||||
<!-- >-->
|
||||
<!-- <a-button>-->
|
||||
<!-- <upload-outlined />-->
|
||||
<!-- 上传-->
|
||||
<!-- </a-button>-->
|
||||
<!-- </a-upload>-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- </a-col>-->
|
||||
<!-- <a-col-->
|
||||
<!-- v-bind="styleResponsive ? { md: 8, sm: 24, xs: 24 } : { span: 8 }"-->
|
||||
<!-- >-->
|
||||
<!-- <a-form-item label="维护文档" name="docsUrl">-->
|
||||
<!-- <a-input-->
|
||||
<!-- allow-clear-->
|
||||
<!-- placeholder="请输入腾讯文档地址"-->
|
||||
<!-- v-model:value="form.docsUrl"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- <a-form-item label="其他" name="parentId">-->
|
||||
<!-- <a-upload-->
|
||||
<!-- v-model:file-list="file3"-->
|
||||
<!-- name="file"-->
|
||||
<!-- action="https://file.wsdns.cn/api/file/image"-->
|
||||
<!-- :headers="{ Authorization: token }"-->
|
||||
<!-- @change="onFile3"-->
|
||||
<!-- >-->
|
||||
<!-- <a-button>-->
|
||||
<!-- <upload-outlined />-->
|
||||
<!-- 上传-->
|
||||
<!-- </a-button>-->
|
||||
<!-- </a-upload>-->
|
||||
<!-- </a-form-item>-->
|
||||
<!-- </a-col>-->
|
||||
<!-- </a-row>-->
|
||||
<!-- </a-card>-->
|
||||
<!-- <a-divider style="height: 8px" />-->
|
||||
<!-- <a-card title="开发资料" :bordered="false">-->
|
||||
<!-- <template #extra><a-button type="link" @click="handleEditStatus">编辑</a-button></template>-->
|
||||
<!-- <!– 编辑器 –>-->
|
||||
<!-- <byte-md-editor-->
|
||||
<!-- v-if="editStatus"-->
|
||||
<!-- v-model:value="requirement"-->
|
||||
<!-- placeholder="请输入您的内容，图片请直接粘贴"-->
|
||||
<!-- :locale="zh_Hans"-->
|
||||
<!-- mode="split"-->
|
||||
<!-- :plugins="plugins"-->
|
||||
<!-- height="500px"-->
|
||||
<!-- :editorConfig="{ lineNumbers: true }"-->
|
||||
<!-- @paste="onPaste"-->
|
||||
<!-- />-->
|
||||
<!-- <!– 编辑器 –>-->
|
||||
<!-- <byte-md-viewer v-else :value="requirement" :plugins="plugins" />-->
|
||||
<!-- </a-card>-->
|
||||
<!-- <a-divider style="height: 8px" />-->
|
||||
<!-- <a-card title="企业介绍" :bordered="false">-->
|
||||
<!-- <template #extra><a-button type="link" @click="handleEditStatus">编辑</a-button></template>-->
|
||||
<!-- <!– 编辑器 –>-->
|
||||
<!-- <byte-md-editor-->
|
||||
<!-- v-if="editStatus"-->
|
||||
<!-- v-model:value="content"-->
|
||||
<!-- placeholder="请输入您的内容，图片请直接粘贴"-->
|
||||
<!-- :locale="zh_Hans"-->
|
||||
<!-- mode="split"-->
|
||||
<!-- :plugins="plugins"-->
|
||||
<!-- height="500px"-->
|
||||
<!-- :editorConfig="{ lineNumbers: true }"-->
|
||||
<!-- @paste="onPaste"-->
|
||||
<!-- />-->
|
||||
<!-- <!– 编辑器 –>-->
|
||||
<!-- <byte-md-viewer v-else :value="content" :plugins="plugins" />-->
|
||||
<!-- </a-card>-->
|
||||
<!-- <a-divider style="height: 8px" />-->
|
||||
<!-- <a-card title="企业截图" :bordered="false">-->
|
||||
<!-- <template #extra><a-button type="link" @click="handleEditStatus">上传</a-button></template>-->
|
||||
<!-- </a-card>-->
|
||||
</a-form>
|
||||
<!-- 地图位置选择弹窗 -->
|
||||
<ele-map-picker
|
||||
:need-city="true"
|
||||
:dark-mode="darkMode"
|
||||
v-model:visible="showMap"
|
||||
:center="[108.374959, 22.767024]"
|
||||
:search-type="1"
|
||||
:zoom="12"
|
||||
@done="onDone"
|
||||
/>
|
||||
</div>
|
||||
</ele-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, watch, createVNode, computed } from 'vue';
|
||||
import { Form, message } from 'ant-design-vue';
|
||||
import { assignObject, ipReg, toDateString } from "ele-admin-pro";
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { storeToRefs } from 'pinia';
|
||||
// 中文语言文件
|
||||
import zh_Hans from 'bytemd/locales/zh_Hans.json';
|
||||
// 链接、删除线、复选框、表格等的插件
|
||||
// 插件的中文语言文件
|
||||
import zh_HansGfm from '@bytemd/plugin-gfm/locales/zh_Hans.json';
|
||||
import 'bytemd/dist/index.min.css';
|
||||
import 'github-markdown-css/github-markdown-light.css';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
// import TinymceEditor from '@/components/TinymceEditor/index.vue';
|
||||
import highlight from '@bytemd/plugin-highlight';
|
||||
// 中文语言文件
|
||||
import gfm from '@bytemd/plugin-gfm';
|
||||
// // 预览界面的样式，这里用的 github 的 markdown 主题
|
||||
import 'github-markdown-css/github-markdown-light.css';
|
||||
import {
|
||||
EyeOutlined,
|
||||
EyeInvisibleOutlined,
|
||||
EnvironmentOutlined
|
||||
} from '@ant-design/icons-vue';
|
||||
import { UploadOutlined } from '@/layout/menu-icons';
|
||||
import { FormInstance } from 'ant-design-vue/es/form';
|
||||
import { Company } from '@/api/system/company/model';
|
||||
import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
|
||||
import DictSelect from '@/views/search/components/dict-select.vue';
|
||||
import { User } from '@/api/system/user/model';
|
||||
import { uploadFile } from "@/api/system/file";
|
||||
import { FILE_SERVER, FILE_THUMBNAIL, TOKEN_STORE_NAME } from "@/config/setting";
|
||||
import { listAppUser, addAppUser, removeAppUser } from "@/api/oa/app/user";
|
||||
import { AppUser } from '@/api/oa/app/user/model'
|
||||
import { updateCompany, addCompany } from "@/api/system/company";
|
||||
import { CenterPoint } from "ele-admin-pro/es/ele-map-picker/types";
|
||||
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
const useForm = Form.useForm;
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
const { darkMode } = storeToRefs(themeStore);
|
||||
const props = defineProps<{
|
||||
// 弹窗是否打开
|
||||
visible: boolean;
|
||||
// 修改回显的数据
|
||||
data?: Company | null;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'done'): void;
|
||||
(e: 'update:visible', visible: boolean): void;
|
||||
}>();
|
||||
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否显示最大化切换按钮
|
||||
const maxable = ref(true);
|
||||
// 当期时间
|
||||
const dayTime = toDateString(new Date());
|
||||
// 已上传数据
|
||||
const images = ref<ItemType[]>([]);
|
||||
const appUsers = ref<AppUser[]>([]);
|
||||
const selectUser = ref<string>();
|
||||
const editStatus = ref(false);
|
||||
// 类型 single|multiple
|
||||
// const type = ref<string>('single');
|
||||
// 日期范围选择
|
||||
const dateRange = ref<[string, string]>(['', '']);
|
||||
const content = ref('');
|
||||
const requirement = ref('');
|
||||
// 插件
|
||||
const plugins = ref([
|
||||
gfm({
|
||||
locale: zh_HansGfm
|
||||
}),
|
||||
highlight()
|
||||
]);
|
||||
|
||||
// 穿梭框数据
|
||||
const breakfast = ref<any[]>();
|
||||
const targetKeys1 = ref<any[]>([]);
|
||||
const selectedKeys1 = ref<any[]>();
|
||||
const lunch = ref<any[]>();
|
||||
const targetKeys2 = ref<any[]>([]);
|
||||
const selectedKeys2 = ref<any[]>();
|
||||
const dinner = ref<any[]>();
|
||||
const targetKeys3 = ref<any[]>([]);
|
||||
const selectedKeys3 = ref<any[]>();
|
||||
const selectedGoodsIds = ref<any[]>([]);
|
||||
const showAddUserForm = ref(false);
|
||||
// 是否显示地图选择弹窗
|
||||
const showMap = ref(false);
|
||||
// 省市区
|
||||
const city = ref<string[]>([]);
|
||||
const token = localStorage.getItem(TOKEN_STORE_NAME);
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
|
||||
// 文件模型
|
||||
interface FileItem {
|
||||
uid: string;
|
||||
name?: string;
|
||||
status?: string;
|
||||
response?: Response;
|
||||
thumbUrl?: string;
|
||||
downloadUrl?: string;
|
||||
url: string;
|
||||
}
|
||||
|
||||
interface FileInfo {
|
||||
file: FileItem;
|
||||
fileList: FileItem[];
|
||||
}
|
||||
// 文件上传
|
||||
const file1 = ref<FileItem[]>();
|
||||
const file2 = ref<FileItem[]>();
|
||||
const file3 = ref<FileItem[]>();
|
||||
|
||||
// 用户信息
|
||||
const form = reactive<Company>({
|
||||
companyId: undefined,
|
||||
companyName: '',
|
||||
companyCode: '',
|
||||
shortName: '',
|
||||
phone: '',
|
||||
companyLogo: undefined,
|
||||
domain: '',
|
||||
sortNumber: undefined,
|
||||
comments: '',
|
||||
tenantName: '',
|
||||
tenantId: undefined,
|
||||
createTime: '',
|
||||
status: undefined,
|
||||
userId: undefined
|
||||
});
|
||||
|
||||
/* 更新visible */
|
||||
const updateVisible = (value: boolean) => {
|
||||
emit('update:visible', value);
|
||||
};
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
companyName: [
|
||||
{
|
||||
required: true,
|
||||
type: 'string',
|
||||
message: '请输入企业名称',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
// appCode: [
|
||||
// {
|
||||
// required: true,
|
||||
// type: 'string',
|
||||
// message: '请输入企业标识(英文字母)',
|
||||
// trigger: 'blur'
|
||||
// }
|
||||
// ],
|
||||
// progress: [
|
||||
// {
|
||||
// required: true,
|
||||
// type: 'string',
|
||||
// message: '请选择跟进状态',
|
||||
// trigger: 'blur'
|
||||
// }
|
||||
// ],
|
||||
// securityStatus: [
|
||||
// {
|
||||
// required: true,
|
||||
// type: 'string',
|
||||
// message: '请选择安全状态',
|
||||
// trigger: 'blur'
|
||||
// }
|
||||
// ],
|
||||
// companyName: [
|
||||
// {
|
||||
// required: true,
|
||||
// type: 'string',
|
||||
// message: '请选择租赁单位',
|
||||
// trigger: 'blur'
|
||||
// }
|
||||
// ],
|
||||
// appRegion: [
|
||||
// {
|
||||
// required: true,
|
||||
// type: 'string',
|
||||
// message: '请输入企业地址',
|
||||
// trigger: 'blur'
|
||||
// }
|
||||
// ]
|
||||
});
|
||||
|
||||
const { resetFields, validate, validateInfos } = useForm(form, rules);
|
||||
|
||||
const addUser = () => {
|
||||
showAddUserForm.value = true;
|
||||
};
|
||||
|
||||
const chooseCompanyName = (data: Company) => {
|
||||
form.companyName = data.companyName;
|
||||
form.companyId = data.companyId;
|
||||
};
|
||||
|
||||
// 添加开发成员
|
||||
const addAppDevUser = (data: User) => {
|
||||
addAppUser({
|
||||
userId: data.userId,
|
||||
appId: props.data?.appId,
|
||||
role: 20
|
||||
}).then((msg) => {
|
||||
message.success(msg);
|
||||
reload();
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
}
|
||||
|
||||
// 添加体验成员
|
||||
const addAppExpUser = (data: User) => {
|
||||
addAppUser({
|
||||
userId: data.userId,
|
||||
appId: props.data?.appId,
|
||||
role: 10
|
||||
}).then((msg) => {
|
||||
message.success(msg);
|
||||
reload();
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
}
|
||||
|
||||
// 移除成员
|
||||
const removeUser = (data: AppUser) => {
|
||||
removeAppUser(data.appUserId)
|
||||
.then((msg) => {
|
||||
message.success(msg);
|
||||
reload();
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
// 选择地区
|
||||
const onChangeRegion = (value) => {
|
||||
form.province = value[0];
|
||||
form.city = value[1];
|
||||
form.region = value[2];
|
||||
};
|
||||
|
||||
/* 地图选择后回调 */
|
||||
const onDone = (location: CenterPoint) => {
|
||||
console.log(location);
|
||||
city.value = [
|
||||
`${location.city?.province}`,
|
||||
`${location.city?.city}`,
|
||||
`${location.city?.district}`
|
||||
];
|
||||
form.province = `${location.city?.province}`;
|
||||
form.city = `${location.city?.city}`;
|
||||
form.region = `${location.city?.district}`;
|
||||
form.address = `${location.address}`;
|
||||
form.latitude = `${location.lat}`;
|
||||
form.longitude = `${location.lng}`;
|
||||
showMap.value = false;
|
||||
};
|
||||
|
||||
const handleEditStatus = () => {
|
||||
editStatus.value = !editStatus.value;
|
||||
}
|
||||
|
||||
// const chooseCompanyName = (data: Company) => {
|
||||
// form.companyName = data.companyName;
|
||||
// };
|
||||
|
||||
const chooseDismantlingCompany = (data: Company) => {
|
||||
form.dismantlingCompany = data.companyName;
|
||||
};
|
||||
|
||||
const chooseDirector = (data: User) => {
|
||||
form.director = data.nickname;
|
||||
};
|
||||
|
||||
const chooseDeveloper = (data: Company) => {
|
||||
form.developer = data.companyName;
|
||||
};
|
||||
|
||||
const chooseSalesman = (data: User) => {
|
||||
form.salesman = data.nickname;
|
||||
};
|
||||
|
||||
const changeAppCode = (e) => {
|
||||
form.packageName = `com.gxwebsoft.${form.appCode}`;
|
||||
form.appUrl = `https://apps.gxwebsoft.com/${form.appCode}`;
|
||||
}
|
||||
|
||||
/* 打开位置选择 */
|
||||
const openMapPicker = () => {
|
||||
showMap.value = true;
|
||||
};
|
||||
|
||||
const onFile1 = (info: FileInfo) => {
|
||||
let resFileList = [...info.fileList];
|
||||
file1.value = resFileList.map((file) => {
|
||||
if (file.response) {
|
||||
file.url = file.response.url;
|
||||
}
|
||||
return file;
|
||||
});
|
||||
form.file1 = JSON.stringify(file1.value);
|
||||
};
|
||||
const onFile2 = (info: FileInfo) => {
|
||||
let resFileList = [...info.fileList];
|
||||
file2.value = resFileList.map((file) => {
|
||||
if (file.response) {
|
||||
file.url = file.response.url;
|
||||
}
|
||||
return file;
|
||||
});
|
||||
form.file2 = JSON.stringify(file2.value);
|
||||
};
|
||||
const onFile3 = (info: FileInfo) => {
|
||||
let resFileList = [...info.fileList];
|
||||
file3.value = resFileList.map((file) => {
|
||||
if (file.response) {
|
||||
file.url = file.response.url;
|
||||
}
|
||||
return file;
|
||||
});
|
||||
form.file3 = JSON.stringify(file3.value);
|
||||
};
|
||||
|
||||
const config = ref({
|
||||
height: 500,
|
||||
images_upload_handler: (blobInfo, success, error) => {
|
||||
const file = blobInfo.blob();
|
||||
// 使用 axios 上传，实际开发这段建议写在 api 中再调用 api
|
||||
const formData = new FormData();
|
||||
formData.append('file', file, file.name);
|
||||
uploadFile(<File>file)
|
||||
.then((result) => {
|
||||
if (result.length) {
|
||||
if (file.size / 1024 / 1024 > 2) {
|
||||
error('图片大小不能超过 2MB');
|
||||
}
|
||||
success(FILE_SERVER + result.path);
|
||||
} else {
|
||||
error('上传失败');
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// 上传文件
|
||||
const onUpload = (item) => {
|
||||
const { file } = item;
|
||||
images.value = [];
|
||||
uploadFile(file)
|
||||
.then((data) => {
|
||||
images.value.push({
|
||||
uid: data.id,
|
||||
url: FILE_THUMBNAIL + data.path,
|
||||
status: 'done'
|
||||
});
|
||||
form.companyLogo = data.path;
|
||||
message.success('上传成功');
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
};
|
||||
|
||||
/* 粘贴图片上传服务器并插入编辑器 */
|
||||
const onPaste = (e) => {
|
||||
console.log(e);
|
||||
const items = (e.clipboardData || e.originalEvent.clipboardData).items;
|
||||
console.log(items);
|
||||
let hasFile = false;
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
if (items[i].type.indexOf('image') !== -1) {
|
||||
let file = items[i].getAsFile();
|
||||
const item: ItemType = {
|
||||
file,
|
||||
uid: (file as any).lastModified,
|
||||
name: file.name
|
||||
};
|
||||
uploadFile(<File>item.file)
|
||||
.then((result) => {
|
||||
const addPath = '\n\r';
|
||||
content.value = content.value + addPath
|
||||
})
|
||||
.catch((e) => {
|
||||
message.error(e.message);
|
||||
});
|
||||
hasFile = true;
|
||||
}
|
||||
}
|
||||
if (hasFile) {
|
||||
e.preventDefault();
|
||||
}
|
||||
}
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const formData = {
|
||||
...form,
|
||||
content: content.value
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateCompany : addCompany;
|
||||
saveOrUpdate(formData)
|
||||
.then((msg) => {
|
||||
loading.value = false;
|
||||
message.success(msg);
|
||||
updateVisible(false);
|
||||
emit('done');
|
||||
})
|
||||
.catch((e) => {
|
||||
loading.value = false;
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
const reload = () => {
|
||||
loading.value = true;
|
||||
listAppUser({appId:props.data?.appId}).then(data => {
|
||||
appUsers.value = data
|
||||
})
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.visible,
|
||||
(visible) => {
|
||||
if (visible) {
|
||||
content.value = '';
|
||||
requirement.value = '';
|
||||
if (props.data) {
|
||||
assignObject(form, props.data);
|
||||
images.value = [];
|
||||
if(props.data.companyLogo){
|
||||
images.value.push({
|
||||
uid: 0,
|
||||
url: FILE_THUMBNAIL + props.data.companyLogo,
|
||||
status: 'done'
|
||||
});
|
||||
}
|
||||
|
||||
if (props.data.content) {
|
||||
content.value = props.data.content;
|
||||
}
|
||||
if (props.data.requirement){
|
||||
requirement.value = props.data.requirement;
|
||||
}
|
||||
if (props.data.file1) {
|
||||
file1.value = JSON.parse(props.data.file1);
|
||||
}
|
||||
if (props.data.file2) {
|
||||
file2.value = JSON.parse(props.data.file2);
|
||||
}
|
||||
if (props.data.file3) {
|
||||
file3.value = JSON.parse(props.data.file3);
|
||||
}
|
||||
isUpdate.value = true;
|
||||
reload();
|
||||
} else {
|
||||
isUpdate.value = false;
|
||||
}
|
||||
} else {
|
||||
resetFields();
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<style lang="less"></style>
|
||||
|
||||
<style lang="less">
|
||||
.tab-pane {
|
||||
min-height: 300px;
|
||||
}
|
||||
|
||||
.ml-10 {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.upload-text {
|
||||
margin-right: 70px;
|
||||
}
|
||||
|
||||
.upload-image {
|
||||
margin-bottom: 30px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
</style>
|
||||
@@ -1,298 +0,0 @@
|
||||
<!-- 用户编辑弹窗 -->
|
||||
<template>
|
||||
<a-drawer
|
||||
width="60%"
|
||||
:visible="visible"
|
||||
:maxable="maxable"
|
||||
:title="isUpdate ? '企业详情' : '添加企业'"
|
||||
:body-style="{ paddingBottom: '28px' }"
|
||||
@update:visible="updateVisible"
|
||||
@ok="save"
|
||||
>
|
||||
<div style="background-color: #f3f3f3; padding: 8px">
|
||||
<a-card title="基本信息">
|
||||
<a-form
|
||||
:label-col="
|
||||
styleResponsive
|
||||
? { lg: 2, md: 6, sm: 4, xs: 24 }
|
||||
: { flex: '100px' }
|
||||
"
|
||||
:wrapper-col="styleResponsive ? { offset: 1 } : { offset: 1 }"
|
||||
style="margin-top: 20px"
|
||||
>
|
||||
<a-form-item labelAlign="right" label="企业logo">
|
||||
<ele-image-upload
|
||||
v-model:value="logo"
|
||||
disabled
|
||||
:accept="'image/*'"
|
||||
:item-style="{ width: '50px', height: '50px' }"
|
||||
:limit="1"
|
||||
@upload="onUpload"
|
||||
@remove="onClose"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="企业简称">
|
||||
<a-space size="middle">
|
||||
<span>{{ form.shortName }}</span>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
<a-form-item label="企业全称">
|
||||
<a-space size="middle">
|
||||
<span>{{ form.companyName }}</span>
|
||||
<a-tag color="green" v-if="form.authentication">已认证</a-tag>
|
||||
<a-tag color="orange" v-else>未认证</a-tag>
|
||||
</a-space>
|
||||
<!-- <div class="position-right">-->
|
||||
<!-- <a-button>前往认证</a-button>-->
|
||||
<!-- </div>-->
|
||||
</a-form-item>
|
||||
<a-form-item label="主体类型">
|
||||
<a-tag v-if="form.companyType === 0">个人</a-tag>
|
||||
<a-tag v-if="form.companyType === 10" color="">企业</a-tag>
|
||||
</a-form-item>
|
||||
<a-divider style="padding-bottom: 20px" />
|
||||
<a-form-item label="所属地区">
|
||||
<a-space size="middle">
|
||||
<span>{{ form.province }} {{ form.city }} {{ form.region }}</span>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
<a-form-item label="企业地址">
|
||||
<a-space size="middle">
|
||||
<span>{{ form.address }}</span>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
<a-form-item label="联系电话">
|
||||
<a-space size="middle">
|
||||
<span>{{ form.phone }}</span>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
<a-form-item label="企业域名">
|
||||
<a-space size="middle">
|
||||
<span>{{ form.domain }}</span>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
<a-divider style="padding-bottom: 20px" />
|
||||
<a-form-item label="企业成员">
|
||||
<span>{{ form.users }}个成员</span>
|
||||
</a-form-item>
|
||||
<a-form-item label="企业部门">
|
||||
<span>{{ form.departments }}</span>
|
||||
<span>个部门</span>
|
||||
</a-form-item>
|
||||
<a-form-item label="人数上限">
|
||||
<span>{{ form.users }}/{{ form.members }}</span>
|
||||
<!-- <a-button type="link" v-if="form.authentication === false">-->
|
||||
<!-- 去认证扩容-->
|
||||
<!-- </a-button>-->
|
||||
</a-form-item>
|
||||
<a-form-item label="存储空间">
|
||||
{{ getFileSize(form.storage) }}/{{ getFileSize(form.storageMax) }}
|
||||
</a-form-item>
|
||||
<a-divider style="padding-bottom: 20px" />
|
||||
<a-form-item label="行业类型">
|
||||
<a-space size="middle">
|
||||
<span>{{ form.industryParent }} {{ form.industryChild }}</span>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
<a-form-item label="应用版本">
|
||||
<span v-if="form.version === 10">体验版（试用期1个月）</span>
|
||||
<span v-if="form.version === 20">正式版</span>
|
||||
<!-- <div class="position-right">-->
|
||||
<!-- <a-button>前往升级</a-button>-->
|
||||
<!-- </div>-->
|
||||
</a-form-item>
|
||||
<a-form-item label="到期时间">
|
||||
<span>{{ form.expirationTime }}</span>
|
||||
</a-form-item>
|
||||
<a-form-item label="创建时间">
|
||||
<span>{{ form.createTime }}</span>
|
||||
</a-form-item>
|
||||
<a-divider style="padding-bottom: 20px" />
|
||||
<a-form-item label="企业ID">
|
||||
<span>{{ form.tenantId }}</span>
|
||||
</a-form-item>
|
||||
<a-form-item label="企业号">
|
||||
<span>{{ form.tenantCode }}</span>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="企业注销"
|
||||
extra="注销后，企业在当前应用的数据将会删除,且不可恢复，请谨慎操作"
|
||||
>
|
||||
<a-button>注销</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</div>
|
||||
</a-drawer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, watch } from 'vue';
|
||||
import { Form, message } from 'ant-design-vue';
|
||||
import { assignObject } from 'ele-admin-pro';
|
||||
import { addCompany, updateCompany } from '@/api/system/company';
|
||||
import { Company } from '@/api/system/company/model';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { getFileSize } from '@/utils/common';
|
||||
import { FormInstance } from 'ant-design-vue/es/form';
|
||||
import { FILE_SERVER } from '@/config/setting';
|
||||
|
||||
// 是否是修改
|
||||
const isUpdate = ref(false);
|
||||
const useForm = Form.useForm;
|
||||
// 是否开启响应式布局
|
||||
const themeStore = useThemeStore();
|
||||
const { styleResponsive } = storeToRefs(themeStore);
|
||||
|
||||
const props = defineProps<{
|
||||
// 弹窗是否打开
|
||||
visible: boolean;
|
||||
// 修改回显的数据
|
||||
data?: Company | null;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'done'): void;
|
||||
(e: 'update:visible', visible: boolean): void;
|
||||
}>();
|
||||
|
||||
// 提交状态
|
||||
const loading = ref(false);
|
||||
// 是否显示最大化切换按钮
|
||||
const maxable = ref(true);
|
||||
const logo = ref<any>([]);
|
||||
const formRef = ref<FormInstance | null>(null);
|
||||
|
||||
// 表单信息
|
||||
const form = reactive<Company>({
|
||||
companyId: undefined,
|
||||
companyName: '',
|
||||
shortName: '',
|
||||
companyType: undefined,
|
||||
companyLogo: '',
|
||||
domain: '',
|
||||
phone: '',
|
||||
invoiceHeader: '',
|
||||
startTime: '',
|
||||
expirationTime: '',
|
||||
version: '',
|
||||
members: undefined,
|
||||
storage: '',
|
||||
storageMax: '',
|
||||
industryParent: '',
|
||||
industryChild: '',
|
||||
departments: undefined,
|
||||
country: '',
|
||||
province: '',
|
||||
city: '',
|
||||
region: '',
|
||||
address: '',
|
||||
longitude: '',
|
||||
latitude: '',
|
||||
comments: '',
|
||||
authentication: '',
|
||||
status: '',
|
||||
userId: '',
|
||||
users: '',
|
||||
tenantId: undefined,
|
||||
tenantCode: '',
|
||||
createTime: ''
|
||||
});
|
||||
|
||||
/* 更新visible */
|
||||
const updateVisible = (value: boolean) => {
|
||||
emit('update:visible', value);
|
||||
};
|
||||
|
||||
// 表单验证规则
|
||||
const rules = reactive({
|
||||
name: [
|
||||
{
|
||||
required: true,
|
||||
type: 'string',
|
||||
message: '请输入企业名称',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
model: [
|
||||
{
|
||||
required: true,
|
||||
type: 'string',
|
||||
message: '请输入企业型号',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
factoryNo: [
|
||||
{
|
||||
required: true,
|
||||
type: 'string',
|
||||
message: '请输入出厂编号',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const { resetFields } = useForm(form, rules);
|
||||
|
||||
/* 保存编辑 */
|
||||
const save = () => {
|
||||
if (!formRef.value) {
|
||||
return;
|
||||
}
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
loading.value = true;
|
||||
const formData = {
|
||||
...form
|
||||
};
|
||||
const saveOrUpdate = isUpdate.value ? updateCompany : addCompany;
|
||||
saveOrUpdate(formData)
|
||||
.then((msg) => {
|
||||
loading.value = false;
|
||||
message.success(msg);
|
||||
updateVisible(false);
|
||||
emit('done');
|
||||
})
|
||||
.catch((e) => {
|
||||
loading.value = false;
|
||||
message.error(e.message);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.visible,
|
||||
(visible) => {
|
||||
if (visible) {
|
||||
if (props.data) {
|
||||
if (props.data.companyLogo) {
|
||||
logo.value = [];
|
||||
logo.value.push({
|
||||
uid: 1,
|
||||
url: FILE_SERVER + props.data.companyLogo,
|
||||
status: ''
|
||||
});
|
||||
}
|
||||
assignObject(form, props.data);
|
||||
isUpdate.value = true;
|
||||
} else {
|
||||
isUpdate.value = false;
|
||||
}
|
||||
} else {
|
||||
resetFields();
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<style lang="less"></style>
|
||||
|
||||
<style lang="less">
|
||||
.position-right {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
</style>
|
||||
@@ -1,111 +0,0 @@
|
||||
<!-- 用户编辑弹窗 -->
|
||||
<template>
|
||||
<ele-modal
|
||||
:width="600"
|
||||
:visible="visible"
|
||||
:maskClosable="false"
|
||||
:title="`导入设备`"
|
||||
:body-style="{ paddingBottom: '28px' }"
|
||||
@update:visible="updateVisible"
|
||||
:footer="null"
|
||||
>
|
||||
<a-upload-dragger
|
||||
name="file"
|
||||
:show-upload-list="false"
|
||||
accept=".xls,.xlsx"
|
||||
:before-upload="handleImport"
|
||||
>
|
||||
<p class="ant-upload-drag-icon">
|
||||
<InboxOutlined />
|
||||
</p>
|
||||
<p class="ant-upload-text">单击或拖动文件到此区域进行上传</p>
|
||||
<p class="ant-upload-hint" style="max-width: 550px">
|
||||
提示：附件上传中，请不要做任何操作！ 支持的文件类型为*.xls, *.xlsx!
|
||||
</p>
|
||||
</a-upload-dragger>
|
||||
<div style="margin: 20px auto; display: flex; justify-content: center">
|
||||
<a
|
||||
href="https://file.wsdns.cn/download/20230523/2f5ffa06b0684e138184c6786f6fbb68.xlsx"
|
||||
target="_blank"
|
||||
>下载设备导入模板</a
|
||||
>
|
||||
</div>
|
||||
</ele-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { InboxOutlined } from '@ant-design/icons-vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { addBatchTowerEquipment } from '@/api/tower/equipment';
|
||||
import { TowerEquipment } from '@/api/tower/equipment/model';
|
||||
import { read, utils } from 'xlsx';
|
||||
import { ref } from 'vue';
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'done'): void;
|
||||
(e: 'update:visible', visible: boolean): void;
|
||||
}>();
|
||||
|
||||
/* 更新visible */
|
||||
const updateVisible = (value: boolean) => {
|
||||
emit('update:visible', value);
|
||||
};
|
||||
|
||||
// 导入的数据
|
||||
const importData = ref<TowerEquipment[]>([]);
|
||||
const handleImport = (file: File) => {
|
||||
if (
|
||||
![
|
||||
'application/vnd.ms-excel',
|
||||
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
|
||||
].includes(file.type)
|
||||
) {
|
||||
message.error('只能选择 excel 文件');
|
||||
return false;
|
||||
}
|
||||
if (file.size / 1024 / 1024 > 20) {
|
||||
message.error('大小不能超过 20MB');
|
||||
return false;
|
||||
}
|
||||
const reader = new FileReader();
|
||||
reader.onload = (e) => {
|
||||
const data = new Uint8Array(e.target?.result as any);
|
||||
const workbook = read(data, { type: 'array' });
|
||||
const sheetNames = workbook.SheetNames;
|
||||
const worksheet = workbook.Sheets[sheetNames[0]];
|
||||
// 解析成二维数组
|
||||
const aoa = utils.sheet_to_json<string[]>(worksheet, { header: 1 });
|
||||
console.log(aoa);
|
||||
aoa.slice(1).map((d) => {
|
||||
const array = ['闲置', '报废', '注销', '转卖', '在用', '场地'];
|
||||
importData.value.push({
|
||||
status: array.indexOf(d[0]),
|
||||
name: d[1],
|
||||
factoryNo: d[2],
|
||||
model: d[3],
|
||||
manufactor: d[4],
|
||||
buyDate: d[5],
|
||||
filingNo: d[6],
|
||||
factoryDate: d[7],
|
||||
company: d[8],
|
||||
source: d[9],
|
||||
warehouse: d[10],
|
||||
users: d[11],
|
||||
equipmentNo: d[12],
|
||||
ratedLoad: d[13],
|
||||
maxLiftingHeight: d[14],
|
||||
armLength: d[15],
|
||||
currentLocation: d[16],
|
||||
machineNo: d[17]
|
||||
});
|
||||
});
|
||||
addBatchTowerEquipment(importData.value).then(() => {
|
||||
message.success('导入成功');
|
||||
updateVisible(false);
|
||||
emit('done');
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
return false;
|
||||
};
|
||||
</script>
|
||||
@@ -1,248 +0,0 @@
|
||||
<!-- 搜索表单 -->
|
||||
<template>
|
||||
<a-space :size="10" style="flex-wrap: wrap">
|
||||
<a-button type="primary" class="ele-btn-icon" @click="add">
|
||||
<template #icon>
|
||||
<PlusOutlined />
|
||||
</template>
|
||||
<span>添加企业</span>
|
||||
</a-button>
|
||||
<a-button v-if="tenantId !== 5" class="ele-btn-icon" @click="openImport">
|
||||
<template #icon>
|
||||
<UploadOutlined />
|
||||
</template>
|
||||
<span>导入</span>
|
||||
</a-button>
|
||||
<a-button
|
||||
danger
|
||||
type="primary"
|
||||
class="ele-btn-icon"
|
||||
:disabled="selection.length === 0"
|
||||
@click="removeBatch"
|
||||
>
|
||||
<template #icon>
|
||||
<DeleteOutlined />
|
||||
</template>
|
||||
<span>批量删除</span>
|
||||
</a-button>
|
||||
<a-radio-group v-model:value="where.authentication" @change="handleSearch">
|
||||
<a-radio-button :value="0">未认证</a-radio-button>
|
||||
<a-radio-button :value="1">已认证</a-radio-button>
|
||||
</a-radio-group>
|
||||
<a-radio-group v-model:value="where.version" @change="handleSearch">
|
||||
<a-radio-button :value="10">体验版</a-radio-button>
|
||||
<a-radio-button :value="20">授权版</a-radio-button>
|
||||
</a-radio-group>
|
||||
<a-button
|
||||
class="ele-btn-icon"
|
||||
:disabled="selection.length === 0"
|
||||
@click="handleExport"
|
||||
>
|
||||
<span>导出</span>
|
||||
</a-button>
|
||||
<regions-select
|
||||
v-model:value="city"
|
||||
type="provinceCity"
|
||||
valueField="label"
|
||||
placeholder="请选择省市区"
|
||||
class="ele-fluid"
|
||||
@change="handleCity"
|
||||
/>
|
||||
<a-range-picker
|
||||
v-model:value="dateRange"
|
||||
@change="search"
|
||||
value-format="YYYY-MM-DD"
|
||||
class="ele-fluid"
|
||||
/>
|
||||
<a-input-search
|
||||
allow-clear
|
||||
placeholder="请输入关键词"
|
||||
v-model:value="searchText"
|
||||
@pressEnter="search"
|
||||
@search="search"
|
||||
/>
|
||||
<a-button @click="reset">重置</a-button>
|
||||
<!-- 导入弹窗 -->
|
||||
<Import v-model:visible="showImport" @done="search" />
|
||||
</a-space>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {
|
||||
PlusOutlined,
|
||||
UploadOutlined,
|
||||
DownloadOutlined,
|
||||
DeleteOutlined
|
||||
} from '@ant-design/icons-vue';
|
||||
import useSearch from '@/utils/use-search';
|
||||
import { ref, watch } from 'vue';
|
||||
import { utils, writeFile } from 'xlsx';
|
||||
import { Company } from '@/api/system/company/model';
|
||||
import { CompanyParam } from '@/api/system/company/model';
|
||||
import Import from './import.vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
// 选中的角色
|
||||
selection?: [];
|
||||
}>(),
|
||||
{}
|
||||
);
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'search', where?: CompanyParam): void;
|
||||
(e: 'add'): void;
|
||||
(e: 'remove'): void;
|
||||
(e: 'update', status?: number): void;
|
||||
(e: 'import'): void;
|
||||
}>();
|
||||
|
||||
// 表单数据
|
||||
const { where, resetFields } = useSearch<CompanyParam>({
|
||||
companyId: undefined,
|
||||
companyName: undefined,
|
||||
keywords: '',
|
||||
authentication: undefined,
|
||||
version: undefined,
|
||||
province: '',
|
||||
city: '',
|
||||
region: ''
|
||||
});
|
||||
const tenantId = ref<number>();
|
||||
if (localStorage.getItem('tenantId')) {
|
||||
tenantId.value = Number(localStorage.getItem('tenantId'));
|
||||
}
|
||||
// 下来选项
|
||||
const type = ref('keywords');
|
||||
// 搜索内容
|
||||
const searchText = ref('');
|
||||
// 状态
|
||||
const status = ref<number>();
|
||||
// 所在城市
|
||||
const city = ref<string[]>(['广西壮族自治区']);
|
||||
// 日期范围选择
|
||||
const dateRange = ref<[string, string]>(['', '']);
|
||||
// 是否显示导入弹窗
|
||||
const showImport = ref(false);
|
||||
|
||||
/* 搜索 */
|
||||
const search = () => {
|
||||
console.log(where);
|
||||
resetFields();
|
||||
const [d1, d2] = dateRange.value ?? [];
|
||||
if (type.value == 'keywords') {
|
||||
where.keywords = searchText.value;
|
||||
}
|
||||
emit('search', {
|
||||
...where,
|
||||
createTimeStart: d1 ? d1 + ' 00:00:00' : '',
|
||||
createTimeEnd: d2 ? d2 + ' 23:59:59' : ''
|
||||
});
|
||||
};
|
||||
|
||||
// 导出
|
||||
const handleExport = () => {
|
||||
if (!props.selection?.length) {
|
||||
message.error('请至少选择一条数据');
|
||||
return;
|
||||
}
|
||||
const array: (string | number)[][] = [
|
||||
[
|
||||
'ID',
|
||||
'企业名称',
|
||||
'企业简称',
|
||||
'所在城市',
|
||||
'详细地址',
|
||||
'联系电话',
|
||||
'企业域名',
|
||||
'实名认证',
|
||||
'版本',
|
||||
'注册时间',
|
||||
'到期时间',
|
||||
'备注'
|
||||
]
|
||||
];
|
||||
|
||||
props.selection?.forEach((d: Company) => {
|
||||
let version = '';
|
||||
if (d.version === 10) {
|
||||
version = '体验版';
|
||||
}
|
||||
if (d.version === 20) {
|
||||
version = '授权版';
|
||||
}
|
||||
array.push([
|
||||
`${d.companyId}`,
|
||||
`${d.companyName}`,
|
||||
`${d.shortName}`,
|
||||
`${d.city}`,
|
||||
`${d.address}`,
|
||||
`${d.phone}`,
|
||||
`${d.domain}`,
|
||||
`${d.authentication == 1 ? '已认证' : ''}`,
|
||||
`${version}`,
|
||||
`${d.createTime}`,
|
||||
`${d.expirationTime}`,
|
||||
`${d.users}`,
|
||||
`${d.comments}`
|
||||
]);
|
||||
});
|
||||
const sheetName = '企业导出列表';
|
||||
const workbook = {
|
||||
SheetNames: [sheetName],
|
||||
Sheets: {}
|
||||
};
|
||||
const sheet = utils.aoa_to_sheet(array);
|
||||
workbook.Sheets[sheetName] = sheet;
|
||||
// 设置列宽
|
||||
sheet['!cols'] = [
|
||||
{ wch: 10 },
|
||||
{ wch: 10 },
|
||||
{ wch: 10 },
|
||||
{ wch: 10 },
|
||||
{ wch: 20 },
|
||||
{ wch: 40 },
|
||||
{ wch: 10 }
|
||||
];
|
||||
writeFile(workbook, '导出企业管理表.xlsx');
|
||||
};
|
||||
|
||||
// 添加企业
|
||||
const add = () => {
|
||||
if (tenantId.value == 5) {
|
||||
return window.open('https://www.gxwebsoft.com/register');
|
||||
}
|
||||
emit('add');
|
||||
};
|
||||
|
||||
// 导入
|
||||
const openImport = () => {
|
||||
showImport.value = true;
|
||||
};
|
||||
|
||||
const handleSearch = () => {
|
||||
emit('search', where);
|
||||
};
|
||||
|
||||
/* 重置 */
|
||||
const reset = () => {
|
||||
resetFields();
|
||||
search();
|
||||
};
|
||||
|
||||
const handleCity = (text) => {
|
||||
where.city = text[1];
|
||||
emit('search', where);
|
||||
};
|
||||
|
||||
// 批量删除
|
||||
const removeBatch = () => {
|
||||
emit('remove');
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.selection,
|
||||
() => {}
|
||||
);
|
||||
</script>
|
||||
@@ -1,325 +0,0 @@
|
||||
<template>
|
||||
<div class="page">
|
||||
<div class="ele-body">
|
||||
<a-card title="客户管理" :bordered="false">
|
||||
<!-- 表格 -->
|
||||
<ele-pro-table
|
||||
ref="tableRef"
|
||||
row-key="companyId"
|
||||
:columns="columns"
|
||||
:datasource="datasource"
|
||||
v-model:selection="selection"
|
||||
:customRow="customRow"
|
||||
tool-class="ele-toolbar-form"
|
||||
:scroll="{ x: 1200 }"
|
||||
class="sys-org-table"
|
||||
:striped="true"
|
||||
>
|
||||
<template #toolbar>
|
||||
<search
|
||||
@search="reload"
|
||||
:selection="selection"
|
||||
@add="openEdit"
|
||||
@remove="removeBatch"
|
||||
/>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.key === 'companyName'">
|
||||
<div class="company-box">
|
||||
<a-avatar
|
||||
v-if="record.companyLogo"
|
||||
:src="FILE_THUMBNAIL + record.companyLogo"
|
||||
/>
|
||||
<div class="company-name">
|
||||
<span>{{ record.shortName }}</span>
|
||||
<span class="ele-text-placeholder">{{
|
||||
record.companyName
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="column.key === 'members'">
|
||||
<span>{{ record.users }}/{{ record.members }}</span>
|
||||
</template>
|
||||
<template v-if="column.key === 'storage'">
|
||||
{{ getFileSize(record.storage) }}/{{
|
||||
getFileSize(record.storageMax)
|
||||
}}
|
||||
</template>
|
||||
<template v-if="column.key === 'version'">
|
||||
<a-tag v-if="record.version === 20" color="green">授权版</a-tag>
|
||||
<a-tag v-if="record.version === 10">体验版</a-tag>
|
||||
</template>
|
||||
<template v-if="column.key === 'departments'">
|
||||
<span>{{ record.departments }}个部门</span>
|
||||
</template>
|
||||
<template v-if="column.key === 'createTime'">
|
||||
<div class="create-time">
|
||||
<span class="ele-text-placeholder">{{
|
||||
record.createTime
|
||||
}}</span>
|
||||
<span class="ele-text-placeholder">{{
|
||||
record.expirationTime
|
||||
}}</span>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="column.key === 'authentication'">
|
||||
<a-tag v-if="record.authentication === 1" color="green"
|
||||
>已认证</a-tag
|
||||
>
|
||||
<a-tag v-if="record.authentication === 0">未认证</a-tag>
|
||||
</template>
|
||||
<template v-if="column.key === 'status'">
|
||||
<a-tag v-if="record.status === 0" color="green">正常</a-tag>
|
||||
<a-tag v-if="record.status === 1" color="red">报废</a-tag>
|
||||
<a-tag v-if="record.status === 2" color="purple">注销</a-tag>
|
||||
<a-tag v-if="record.status === 3" color="orange">转卖</a-tag>
|
||||
</template>
|
||||
<template v-if="column.key === 'action'">
|
||||
<a-space>
|
||||
<!-- <a @click="openEdit(record)">编辑</a>-->
|
||||
<!-- <a-divider type="vertical" />-->
|
||||
<a @click="openInfo(record)">详情</a>
|
||||
</a-space>
|
||||
</template>
|
||||
</template>
|
||||
</ele-pro-table>
|
||||
</a-card>
|
||||
</div>
|
||||
<!-- 编辑弹窗 -->
|
||||
<CompanyEdit v-model:visible="showEdit" :data="current" @done="reload" />
|
||||
<!-- 企业详情 -->
|
||||
<CompanyInfo v-model:visible="showInfo" :data="current" @done="reload" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { createVNode, ref } from 'vue';
|
||||
// import { message, Modal } from 'ant-design-vue';
|
||||
// import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import type { EleProTable } from 'ele-admin-pro';
|
||||
import type {
|
||||
DatasourceFunction,
|
||||
ColumnItem
|
||||
} from 'ele-admin-pro/es/ele-pro-table/types';
|
||||
import { toDateString } from 'ele-admin-pro';
|
||||
import Search from './components/search.vue';
|
||||
import CompanyEdit from './components/company-edit.vue';
|
||||
import CompanyInfo from './components/company-info.vue';
|
||||
import { pageCompany, removeBatchCompany } from '@/api/system/company';
|
||||
import { FILE_THUMBNAIL } from '@/config/setting';
|
||||
import { getFileSize } from '@/utils/common';
|
||||
import { Company, CompanyParam } from '@/api/system/company/model';
|
||||
import { message, Modal } from 'ant-design-vue';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
|
||||
defineProps<{
|
||||
activeKey?: boolean;
|
||||
data?: any;
|
||||
}>();
|
||||
|
||||
// 表格实例
|
||||
const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
|
||||
|
||||
// 表格列配置
|
||||
const columns = ref<ColumnItem[]>([
|
||||
{
|
||||
key: 'index',
|
||||
width: 48,
|
||||
align: 'center',
|
||||
fixed: 'left',
|
||||
hideInSetting: true,
|
||||
customRender: ({ index }) => index + (tableRef.value?.tableIndex ?? 0)
|
||||
},
|
||||
{
|
||||
title: '企业名称',
|
||||
dataIndex: 'companyName',
|
||||
key: 'companyName',
|
||||
width: 280
|
||||
},
|
||||
// {
|
||||
// title: '企业简称',
|
||||
// dataIndex: 'shortName',
|
||||
// key: 'shortName'
|
||||
// },
|
||||
{
|
||||
title: '所在城市',
|
||||
dataIndex: 'city',
|
||||
key: 'city'
|
||||
},
|
||||
{
|
||||
title: '企业域名',
|
||||
dataIndex: 'domain',
|
||||
key: 'domain'
|
||||
},
|
||||
{
|
||||
title: '联系电话',
|
||||
dataIndex: 'phone',
|
||||
key: 'phone',
|
||||
hideInTable: true
|
||||
},
|
||||
{
|
||||
title: '企业成员',
|
||||
dataIndex: 'members',
|
||||
key: 'members'
|
||||
},
|
||||
{
|
||||
title: '企业部门',
|
||||
dataIndex: 'departments',
|
||||
key: 'departments',
|
||||
hideInTable: true
|
||||
},
|
||||
{
|
||||
title: '存储空间',
|
||||
dataIndex: 'storage',
|
||||
key: 'storage',
|
||||
hideInTable: true
|
||||
},
|
||||
{
|
||||
title: '实名认证',
|
||||
dataIndex: 'authentication',
|
||||
key: 'authentication'
|
||||
},
|
||||
{
|
||||
title: '版本',
|
||||
dataIndex: 'version',
|
||||
key: 'version'
|
||||
},
|
||||
{
|
||||
title: '注册时间 / 到期时间',
|
||||
dataIndex: 'createTime',
|
||||
key: 'createTime',
|
||||
align: 'center',
|
||||
sorter: true,
|
||||
customRender: ({ text }) => toDateString(text)
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
width: 200,
|
||||
align: 'center',
|
||||
hideInSetting: true
|
||||
}
|
||||
]);
|
||||
|
||||
// 表格选中数据
|
||||
const selection = ref<Company[]>([]);
|
||||
// 当前编辑数据
|
||||
const current = ref<Company | null>(null);
|
||||
// 是否显示编辑弹窗
|
||||
const showEdit = ref(false);
|
||||
// 是否显示详情弹窗
|
||||
const showInfo = ref(false);
|
||||
|
||||
// 表格数据源
|
||||
const datasource: DatasourceFunction = ({ page, limit, where, orders }) => {
|
||||
// 搜索条件
|
||||
return pageCompany({
|
||||
...where,
|
||||
...orders,
|
||||
page,
|
||||
limit
|
||||
});
|
||||
};
|
||||
|
||||
/* 搜索 */
|
||||
const reload = (where?: CompanyParam) => {
|
||||
selection.value = [];
|
||||
tableRef?.value?.reload({ where: where });
|
||||
};
|
||||
|
||||
/* 打开编辑弹窗 */
|
||||
const openEdit = (row?: Company) => {
|
||||
current.value = row ?? null;
|
||||
showEdit.value = true;
|
||||
};
|
||||
|
||||
/* 打开详情弹窗 */
|
||||
const openInfo = (row?: Company) => {
|
||||
current.value = row ?? null;
|
||||
showInfo.value = true;
|
||||
};
|
||||
|
||||
/* 批量删除 */
|
||||
const removeBatch = () => {
|
||||
if (!selection.value.length) {
|
||||
message.error('请至少选择一条数据');
|
||||
return;
|
||||
}
|
||||
Modal.confirm({
|
||||
title: '提示',
|
||||
content: '确定要删除选中的记录吗?',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
maskClosable: true,
|
||||
onOk: () => {
|
||||
const hide = message.loading('请求中..', 0);
|
||||
removeBatchCompany(selection.value.map((d) => d.companyId))
|
||||
.then((msg) => {
|
||||
hide();
|
||||
message.success(msg);
|
||||
reload();
|
||||
})
|
||||
.catch((e) => {
|
||||
hide();
|
||||
message.error(e.message);
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/* 自定义行属性 */
|
||||
const customRow = (record: Company) => {
|
||||
return {
|
||||
// 行点击事件
|
||||
onClick: () => {
|
||||
// console.log(record);
|
||||
},
|
||||
// 行双击事件
|
||||
onDblclick: () => {
|
||||
openEdit(record);
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
reload();
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'CompanyIndex'
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
p {
|
||||
line-height: 0.8;
|
||||
}
|
||||
.sys-org-table :deep(.ant-table-body) {
|
||||
overflow: auto !important;
|
||||
overflow: overlay !important;
|
||||
}
|
||||
|
||||
.sys-org-table :deep(.ant-table-pagination.ant-pagination) {
|
||||
padding: 0 4px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.price-edit {
|
||||
padding-right: 5px;
|
||||
}
|
||||
.comments {
|
||||
max-width: 200px;
|
||||
}
|
||||
.company-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.company-name {
|
||||
padding-left: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
.create-time {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user