Commit 39d018f87bee6252ba256e49cb4886d5e84a8097

Authored by xp.Huang
2 parents 0b6ae45b 25070427

Merge branch 'sqy_dev' into 'main'

修改antdv的按需引入组件的方式,解决不能打包的问题'

See merge request huang/yun-teng-iot-front!76
... ... @@ -4,8 +4,9 @@
4 4 -->
5 5
6 6 <template>
7   - <div class="anticon" :class="getAppLogoClass" @click="goHome">
8   - <img :src="getLogo" />
  7 + <div class="application" :class="getAppLogoClass">
  8 + <img v-if="getLogo" :src="getLogo" />
  9 + <img v-else src="/src/assets/images/logo.png" />
9 10 <span
10 11 class="ml-2 md:opacity-100"
11 12 :class="getTitleClass"
... ... @@ -19,10 +20,8 @@
19 20 <script lang="ts" setup>
20 21 import { computed, unref } from 'vue';
21 22 import { useGlobSetting } from '/@/hooks/setting';
22   - import { useGo } from '/@/hooks/web/usePage';
23 23 import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
24 24 import { useDesign } from '/@/hooks/web/useDesign';
25   - import { PageEnum } from '/@/enums/pageEnum';
26 25 import { useUserStore } from '/@/store/modules/user';
27 26 const props = defineProps({
28 27 /**
... ... @@ -43,7 +42,6 @@
43 42 const { getCollapsedShowTitle } = useMenuSetting();
44 43 const userStore = useUserStore();
45 44 const { title } = useGlobSetting();
46   - const go = useGo();
47 45
48 46 const getAppLogoClass = computed(() => [
49 47 prefixCls,
... ... @@ -56,12 +54,8 @@
56 54 'xs:opacity-0': !props.alwaysShowTitle,
57 55 },
58 56 ]);
59   -
60   - function goHome() {
61   - go(userStore.getUserInfo.homePath || PageEnum.BASE_HOME);
62   - }
63 57 const getLogo = computed(() => {
64   - return userStore.platInfo?.logo ?? '/src/assets/images/logo.png';
  58 + return userStore.platInfo?.logo;
65 59 });
66 60 const getTitle = computed(() => {
67 61 // 设置icon
... ...
... ... @@ -21,43 +21,18 @@
21 21 </transition>
22 22 </template>
23 23 </RouterView>
24   - <!-- <BasicModal
25   - @register="register"
26   - v-bind="$attrs"
27   - :mask="true"
28   - :showCancelBtn="false"
29   - :showOkBtn="false"
30   - :canFullscreen="false"
31   - :closable="false"
32   - :maskStyle="maskColor"
33   - :height="600"
34   - :width="1500"
35   - :maskClosable="false"
36   - title="请您修改初始密码"
37   - :helpMessage="['请您修改初始密码']"
38   - :keyboard="false"
39   - >
40   - <PasswordDialog />
41   - </BasicModal> -->
  24 +
42 25 <FrameLayout v-if="getCanEmbedIFramePage" />
43 26 </template>
44 27
45 28 <script lang="ts">
46   - import { computed, defineComponent, unref, onMounted } from 'vue';
47   - // import PasswordDialog from '/@/views/system/password/index.vue';
48   -
  29 + import { computed, defineComponent, unref } from 'vue';
49 30 import FrameLayout from '/@/layouts/iframe/index.vue';
50   -
51 31 import { useRootSetting } from '/@/hooks/setting/useRootSetting';
52   -
53 32 import { useTransitionSetting } from '/@/hooks/setting/useTransitionSetting';
54 33 import { useMultipleTabSetting } from '/@/hooks/setting/useMultipleTabSetting';
55 34 import { getTransitionName } from './transition';
56   -
57 35 import { useMultipleTabStore } from '/@/store/modules/multipleTab';
58   - // import { BasicModal, useModal } from '/@/components/Modal';
59   - // import { USER_INFO_KEY } from '/@/enums/cacheEnum';
60   - // import { getAuthCache } from '/@/utils/auth';
61 36 export default defineComponent({
62 37 name: 'PageLayout',
63 38 components: { FrameLayout },
... ... @@ -78,17 +53,6 @@
78 53 return tabStore.getCachedTabList;
79 54 });
80 55
81   - // const [register, { openModal }] = useModal();
82   - // const maskColor = ref({ backgroundColor: 'grey' });
83   - // const statusModel = ref(false);
84   - onMounted(() => {
85   - // const userInfo = getAuthCache(USER_INFO_KEY);
86   - // if (userInfo.needSetPwd == true) {
87   - // statusModel.value = true;
88   - // openModal(statusModel.value);
89   - // }
90   - });
91   -
92 56 return {
93 57 getTransitionName,
94 58 openCache,
... ... @@ -96,8 +60,6 @@
96 60 getBasicTransition,
97 61 getCaches,
98 62 getCanEmbedIFramePage,
99   - // register,
100   - // maskColor,
101 63 };
102 64 },
103 65 });
... ...
... ... @@ -14,13 +14,7 @@ import { setupStore } from '/@/store';
14 14 import { setupGlobDirectives } from '/@/directives';
15 15 import { setupI18n } from '/@/locales/setupI18n';
16 16 import { registerGlobComp } from '/@/components/registerGlobComp';
17   -// Do not introduce on-demand in local development?
18   -// In the local development for introduce on-demand, the number of browser requests will increase by about 20%.
19   -// Which may slow down the browser refresh.
20   -// Therefore, all are introduced in local development, and only introduced on demand in the production environment
21   -if (import.meta.env.DEV) {
22   - import('ant-design-vue/dist/antd.less');
23   -}
  17 +import 'ant-design-vue/dist/antd.less';
24 18
25 19 async function bootstrap() {
26 20 const app = createApp(App);
... ...
... ... @@ -69,6 +69,7 @@ export const NotificationTitleMaxLength: Rule[] = [
69 69 if (String(value).length > 50) {
70 70 return Promise.reject('标题长度不超过200字');
71 71 }
  72 + return Promise.resolve();
72 73 },
73 74 validateTrigger: 'blur',
74 75 },
... ... @@ -86,18 +87,6 @@ export const NotificationContentMaxLength: Rule[] = [
86 87 validateTrigger: 'blur',
87 88 },
88 89 ];
89   -export const NotificationTypeMaxLength: Rule[] = [
90   - {
91   - required: true,
92   - validator: (_, value: string) => {
93   - if (!value) {
94   - return Promise.reject('请选择类型');
95   - }
96   - return Promise.resolve();
97   - },
98   - validateTrigger: 'blur',
99   - },
100   -];
101 90
102 91 export const DeviceNameMaxLength: Rule[] = [
103 92 {
... ...
... ... @@ -35,13 +35,18 @@
35 35 </Card>
36 36 <Card size="small" class="md:w-1/3 w-full !md:mt-0 !mt-4 !md:mr-4">
37 37 <div class="flex" style="height: 100px">
38   - <div class="mr-4"
39   - ><img
40   - :src="
41   - !isAdmin(role) ? '/src/assets/images/alarm-count.png' : '/src/assets/images/zh.png'
42   - "
  38 + <div class="mr-4">
  39 + <img
  40 + v-if="!isAdmin(role)"
  41 + src="/src/assets/images/alarm-count.png"
43 42 style="width: 5rem; height: 5rem"
44   - /></div>
  43 + />
  44 + <img
  45 + v-if="isAdmin(role)"
  46 + src="/src/assets/images/zh.png"
  47 + style="width: 5rem; height: 5rem"
  48 + />
  49 + </div>
45 50 <div class="flex-auto">
46 51 <div class="flex justify-between" style="align-items: center">
47 52 <div style="font-size: 1.625rem; color: #333">{{
... ... @@ -60,9 +65,15 @@
60 65 <div class="flex" style="height: 100px">
61 66 <div class="mr-4"
62 67 ><img
63   - :src="!isAdmin(role) ? '/src/assets/images/msg-count.png' : '/src/assets/images/kf.png'"
  68 + v-if="!isAdmin(role)"
  69 + src="/src/assets/images/msg-count.png"
64 70 style="width: 5rem; height: 5rem"
65   - /></div>
  71 + /><img
  72 + v-if="isAdmin(role)"
  73 + src="/src/assets/images/kf.png"
  74 + style="width: 5rem; height: 5rem"
  75 + />
  76 + </div>
66 77 <div class="flex-auto">
67 78 <div class="flex justify-between" style="align-items: center">
68 79 <div style="font-size: 1.625rem; color: #333">{{
... ...
... ... @@ -108,17 +108,7 @@
108 108
109 109 <script lang="ts">
110 110 import { defineComponent, ref, computed, onMounted } from 'vue';
111   - import {
112   - Card,
113   - AnchorLink,
114   - List,
115   - ListItem,
116   - ListItemMeta,
117   - Avatar,
118   - CardMeta,
119   - Descriptions,
120   - DescriptionsItem,
121   - } from 'ant-design-vue';
  111 + import { Card, Anchor, List, Avatar, Descriptions } from 'ant-design-vue';
122 112 import { useUserStore } from '/@/store/modules/user';
123 113 import { getEnterPriseDetail } from '/@/api/oem';
124 114 import { notifyMyGetrPageApi } from '/@/api/stationnotification/stationnotifyApi';
... ... @@ -128,21 +118,19 @@
128 118 import { columns } from './props';
129 119 import { isAdmin } from '/@/enums/roleEnum';
130 120 import { getTenantExpireTimeList } from '/@/api/dashboard';
131   - import 'ant-design-vue/es/anchor-link/style/index';
132   -
133 121 export default defineComponent({
134 122 components: {
135 123 Card,
136   - AnchorLink,
  124 + CardMeta: Card.Meta,
  125 + AnchorLink: Anchor.Link,
137 126 List,
138   - ListItem,
139   - ListItemMeta,
  127 + ListItem: List.Item,
  128 + ListItemMeta: List.Item.Meta,
  129 + Descriptions,
  130 + DescriptionsItem: Descriptions.Item,
140 131 Avatar,
141 132 Time,
142   - CardMeta,
143 133 BasicTable,
144   - Descriptions,
145   - DescriptionsItem,
146 134 },
147 135 props: {
148 136 role: {
... ... @@ -222,13 +210,13 @@
222 210 return {
223 211 activeKey,
224 212 tabListTitle,
225   - onTabChange,
226 213 helpDoc,
227 214 getQrCode,
228 215 getContacts,
229 216 getAddress,
230 217 getTel,
231 218 dataSource,
  219 + onTabChange,
232 220 go,
233 221 registerTable,
234 222 isAdmin,
... ... @@ -238,7 +226,7 @@
238 226 });
239 227 </script>
240 228
241   -<style lang="less" scoped>
  229 +<style scoped>
242 230 .noticeTitle:hover {
243 231 border-bottom: 1px solid #ccc;
244 232 }
... ...
... ... @@ -26,7 +26,7 @@
26 26 import { defineComponent, ref } from 'vue';
27 27 import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
28 28
29   - import { Tabs, TabPane } from 'ant-design-vue';
  29 + import { Tabs } from 'ant-design-vue';
30 30 import Detail from '../tabs/Detail.vue';
31 31 import RealTimeData from '../tabs/RealTimeData.vue';
32 32 import Alarm from '../tabs/Alarm.vue';
... ... @@ -37,13 +37,12 @@
37 37 components: {
38 38 BasicDrawer,
39 39 Tabs,
40   - TabPane,
  40 + TabPane: Tabs.TabPane,
41 41 Detail,
42 42 RealTimeData,
43 43 Alarm,
44 44 ChildDevice,
45 45 },
46   -
47 46 emits: ['reload', 'register'],
48 47 setup() {
49 48 const activeKey = ref('1');
... ...
... ... @@ -39,10 +39,9 @@
39 39 import { createOrEditDevice } from '/@/api/device/deviceManager';
40 40 import DeviceStep1 from '../step/DeviceStep1.vue';
41 41 import DeviceStep2 from '../step/DeviceStep2.vue';
42   - import { Steps, Step } from 'ant-design-vue';
  42 + import { Steps } from 'ant-design-vue';
43 43 import { useMessage } from '/@/hooks/web/useMessage';
44 44 import { credentialTypeEnum } from '../../config/data';
45   - import 'ant-design-vue/es/step/style/index';
46 45
47 46 export default defineComponent({
48 47 name: 'DeviceModal',
... ... @@ -51,7 +50,7 @@
51 50 DeviceStep1,
52 51 DeviceStep2,
53 52 Steps,
54   - Step,
  53 + Step: Steps.Step,
55 54 },
56 55 props: {
57 56 userData: { type: Object },
... ...
... ... @@ -97,7 +97,7 @@
97 97 <script lang="ts">
98 98 import { defineComponent, ref, computed, watch } from 'vue';
99 99 import { BasicModal, useModalInner } from '/@/components/Modal';
100   - import { Tabs, TabPane } from 'ant-design-vue';
  100 + import { Tabs } from 'ant-design-vue';
101 101 import { deviceConfigGetDetail } from '/@/api/device/deviceConfigApi';
102 102 import { BasicForm, useForm } from '/@/components/Form/index';
103 103 import {
... ... @@ -117,11 +117,10 @@
117 117 import { formSchema as enableClearSchema } from './step/cpns/enablerule/config';
118 118 import { formSchema as detailClearSchema } from './step/cpns/detailtemplate/config';
119 119 import { formSchema as echoFormClearSchema } from './step/cpns/alarmruleconditions/cpns/config';
120   - import 'ant-design-vue/es/tab-pane/style/index.css';
121 120
122 121 export default defineComponent({
123 122 name: 'ConfigDrawer',
124   - components: { Tabs, TabPane, BasicModal, BasicForm },
  123 + components: { Tabs, TabPane: Tabs.TabPane, BasicModal, BasicForm },
125 124 emits: ['success', 'register'],
126 125 setup() {
127 126 const activeKey = ref('1');
... ...
... ... @@ -11,17 +11,16 @@
11 11 </template>
12 12
13 13 <script lang="ts">
14   - import { Tabs, TabPane } from 'ant-design-vue';
  14 + import { Tabs } from 'ant-design-vue';
15 15 import { defineComponent } from 'vue';
16 16 import SmsLog from './item/SmsLog.vue';
17 17 import EmailLog from './item/EmailLog.vue';
18 18 import { achieveList } from './data';
19   - import 'ant-design-vue/es/tab-pane/style/index.css';
20 19
21 20 export default defineComponent({
22 21 components: {
23 22 Tabs,
24   - TabPane,
  23 + TabPane: Tabs.TabPane,
25 24 SmsLog,
26 25 EmailLog,
27 26 },
... ...
... ... @@ -5,7 +5,7 @@ import { Tinymce } from '/@/components/Tinymce/index';
5 5 import { getOrganizationList } from '/@/api/system/system';
6 6 import { copyTransFun } from '/@/utils/fnUtils';
7 7 import { Tag } from 'ant-design-vue';
8   -import { NotificationTitleMaxLength, NotificationTypeMaxLength } from '/@/utils/rules';
  8 +import { NotificationTitleMaxLength } from '/@/utils/rules';
9 9
10 10 export enum IsOrgEnum {
11 11 IS_ORG_ENUM = '1',
... ... @@ -87,7 +87,6 @@ export const formSchema: FormSchema[] = [
87 87 },
88 88 ],
89 89 },
90   - rules: NotificationTypeMaxLength,
91 90 },
92 91 {
93 92 field: 'title',
... ...
1 1 <template>
2 2 <div>
3   - <BasicModal
4   - width="650px"
5   - v-bind="$attrs"
6   - @register="registerModal"
7   - :title="getTitle"
8   - @ok="handleSubmit"
9   - >
10   - <PageWrapper :title="`用户资料`" contentBackground @back="goBack">
11   - <Description size="middle" @register="register" />
12   - </PageWrapper>
13   - </BasicModal>
  3 + <PageWrapper :title="`用户资料`" contentBackground @back="goBack">
  4 + <Description size="middle" @register="register" />
  5 + </PageWrapper>
14 6 </div>
15 7 </template>
16 8
17 9 <script>
18   - import { defineComponent, ref } from 'vue';
19   - // import { useRoute } from 'vue-router';
  10 + import { defineComponent } from 'vue';
  11 + import { useRoute } from 'vue-router';
20 12 import { PageWrapper } from '/@/components/Page';
21 13 import { useGo } from '/@/hooks/web/usePage';
22 14 import { Description } from '../../../components/Description';
23   - import { useTabs } from '/@/hooks/web/useTabs';
24 15 import { getAccountInfo } from '../../../api/system/system';
25 16 import { accountSchema } from './account.detail.data';
26 17 import { useDescription } from '../../../components/Description';
27   - import { BasicModal, useModalInner } from '/@/components/Modal';
28   -
  18 + import { useTabs } from '/@/hooks/web/useTabs';
29 19 const accountData = {};
30 20 export default defineComponent({
31 21 name: 'AccountDetail',
32   - components: { PageWrapper, Description, BasicModal },
  22 + components: { PageWrapper, Description },
33 23 setup() {
34   - // const route = useRoute();
  24 + const route = useRoute();
35 25 const go = useGo();
36   - const { setTitle } = useTabs();
37   - const getId = ref('');
38   - const getTitle = ref('');
  26 + const { setTitle, close } = useTabs();
39 27 const [register, methods] = useDescription({
40 28 title: '账号基础信息',
41 29 data: accountData,
42   - bordered: false,
43 30 schema: accountSchema,
44 31 column: 3,
45 32 });
46   -
47   - const [registerModal] = useModalInner(async (data) => {
48   - getId.value = await data.record.id;
49   - getAccountInfo(getId.value).then((result) => {
50   - Reflect.set(accountData, 'realName', result.realName);
51   - Reflect.set(accountData, 'phoneNumber', result.phoneNumber);
52   - Reflect.set(accountData, 'email', result.email);
53   - Reflect.set(accountData, 'username', result.username);
54   - Reflect.set(
55   - accountData,
56   - 'enabled',
57   - result.enabled ? '正常' : !result.enabled ? '禁用' : '已过期'
58   - );
59   - Reflect.set(accountData, 'accountExpireTime', result.accountExpireTime);
60   - Reflect.set(accountData, 'createTime', result.createTime);
61   - Reflect.set(accountData, 'updateTime', result.updateTime);
62   - Reflect.set(accountData, 'deptId', result.deptId);
63   - // 设置Tab的标题(不会影响页面标题)
64   - setTitle('详情:用户' + result.realName);
65   - getTitle.value = '详情:用户' + result.realName;
66   - methods.setDescProps(accountData);
67   - });
  33 + getAccountInfo(route.params?.id).then((result) => {
  34 + Reflect.set(accountData, 'realName', result.realName);
  35 + Reflect.set(accountData, 'phoneNumber', result.phoneNumber);
  36 + Reflect.set(accountData, 'email', result.email);
  37 + Reflect.set(accountData, 'username', result.username);
  38 + Reflect.set(
  39 + accountData,
  40 + 'enabled',
  41 + result.enabled ? '正常' : !result.enabled ? '禁用' : '已过期'
  42 + );
  43 + Reflect.set(accountData, 'accountExpireTime', result.accountExpireTime);
  44 + Reflect.set(accountData, 'createTime', result.createTime);
  45 + Reflect.set(accountData, 'updateTime', result.updateTime);
  46 + Reflect.set(accountData, 'deptId', result.deptId);
  47 + // 设置Tab的标题(不会影响页面标题)
  48 + setTitle('详情:用户' + result.realName);
  49 + methods.setDescProps(accountData);
68 50 });
69 51 // 页面左侧点击返回链接时的操作
70 52 function goBack() {
71 53 // 本例的效果时点击返回始终跳转到账号列表页,实际应用时可返回上一页
  54 + close();
72 55 go('/system/account');
73 56 }
74   - return { goBack, accountSchema, accountData, register, registerModal, getTitle };
  57 + return { goBack, accountSchema, accountData, register };
75 58 },
76 59 });
77 60 </script>
78   -
79   -<style></style>
... ...
... ... @@ -62,7 +62,6 @@
62 62 </template>
63 63 </BasicTable>
64 64 <AccountModal @register="registerModal" @success="handleSuccess" />
65   - <AccountDetail @register="registerDetailModal" @success="handleSuccess" />
66 65 </PageWrapper>
67 66 </div>
68 67 </template>
... ... @@ -75,26 +74,17 @@
75 74 import { Tag } from 'ant-design-vue';
76 75 import { useModal } from '/@/components/Modal';
77 76 import AccountModal from './AccountModal.vue';
78   - import AccountDetail from './AccountDetail.vue';
  77 +
79 78 import { columns, searchFormSchema } from './account.data';
80   - // import { useGo } from '/@/hooks/web/usePage';
  79 + import { useGo } from '/@/hooks/web/usePage';
81 80 import { useMessage } from '/@/hooks/web/useMessage';
82 81
83 82 export default defineComponent({
84 83 name: 'AccountManagement',
85   - components: {
86   - BasicTable,
87   - PageWrapper,
88   - OrganizationIdTree,
89   - AccountModal,
90   - TableAction,
91   - Tag,
92   - AccountDetail,
93   - },
  84 + components: { BasicTable, PageWrapper, OrganizationIdTree, AccountModal, TableAction, Tag },
94 85 setup() {
95   - // const go = useGo();
  86 + const go = useGo();
96 87 const [registerModal, { openModal }] = useModal();
97   - const [registerDetailModal, { openModal: openDetailModal }] = useModal();
98 88 const { createMessage } = useMessage();
99 89 let searchInfo = reactive<Recordable>({});
100 90 const { organizationIdTreeRef, resetFn } = useResetOrganizationTree(searchInfo);
... ... @@ -157,14 +147,10 @@
157 147 }
158 148
159 149 function handleView(record: Recordable) {
160   - openDetailModal(true, {
161   - record,
162   - });
163   - // go('/system/account_detail/' + record.id);
  150 + go('/system/account_detail/' + record.id);
164 151 }
165 152
166 153 return {
167   - registerDetailModal,
168 154 registerTable,
169 155 registerModal,
170 156 handleCreate,
... ...
... ... @@ -2,9 +2,9 @@
2 2 <div class="platform flex">
3 3 <Card class="tab-card" :bordered="false">
4 4 <Tabs v-model:activeKey="activeKey" tab-position="left">
5   - <TabPane key="企业信息" tab="企业信息" />
6   - <TabPane key="平台定制" tab="平台定制" />
7   - <TabPane key="APP定制" tab="APP定制" />
  5 + <Tabs.TabPane key="企业信息" tab="企业信息" />
  6 + <Tabs.TabPane key="平台定制" tab="平台定制" />
  7 + <Tabs.TabPane key="APP定制" tab="APP定制" />
8 8 </Tabs>
9 9 </Card>
10 10
... ... @@ -18,7 +18,7 @@
18 18 </template>
19 19
20 20 <script lang="ts" setup>
21   - import { Tabs, TabPane, Card } from 'ant-design-vue';
  21 + import { Tabs, Card } from 'ant-design-vue';
22 22 import { ref } from 'vue';
23 23 import EnterpriseInfo from './cpns/EnterpriseInfo.vue';
24 24 import CVIDraw from './cpns/CVIDraw.vue';
... ...