|
@@ -1,8 +1,18 @@
|
|
|
<template>
|
|
|
<div id="main" class="main">
|
|
|
- <header-bar></header-bar>
|
|
|
- <notice @more="more" @confirm="confirm" :data="[{title:'11',content:'11'},{title:'22',content:'22'},{title:'33',content:'33'},{title:'44',content:'44'}]" v-model="open"></notice>
|
|
|
- <!-- <el-table
|
|
|
+ <header-bar></header-bar>
|
|
|
+ <notice
|
|
|
+ @more="more"
|
|
|
+ @confirm="confirm"
|
|
|
+ :data="[
|
|
|
+ { title: '11', content: '11' },
|
|
|
+ { title: '22', content: '22' },
|
|
|
+ { title: '33', content: '33' },
|
|
|
+ { title: '44', content: '44' },
|
|
|
+ ]"
|
|
|
+ v-model="open"
|
|
|
+ ></notice>
|
|
|
+ <!-- <el-table
|
|
|
:data="tableData"
|
|
|
style="width: 100%;margin;top:200px"
|
|
|
:default-sort = "{prop: 'date', order: 'descending'}"
|
|
@@ -80,233 +90,239 @@
|
|
|
<!-- <span @click="changeParentState">主项目的数据:{{ commonData.parent }},点击变回1</span> -->
|
|
|
<content>
|
|
|
<!-- <left-mneu></left-mneu> -->
|
|
|
- <div class="router-warp">
|
|
|
- <div id="appContainer"></div>
|
|
|
- <router-view></router-view>
|
|
|
- </div>
|
|
|
+ <div class="router-warp">
|
|
|
+ <div id="appContainer"></div>
|
|
|
+ <router-view></router-view>
|
|
|
+ </div>
|
|
|
</content>
|
|
|
-
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import leftMneu from '@/components/left-menu'
|
|
|
-import { registerMicroApps, start } from 'qiankun'
|
|
|
-import headerBar from '@/components/header-bar'
|
|
|
-import notice from '@/components/notice'
|
|
|
-import { getAll } from '@/libs/micros'
|
|
|
-import router from '../router'
|
|
|
-import store from '../store'
|
|
|
-console.log(process.env.NODE_ENV)
|
|
|
-const state = getAll()
|
|
|
-state.router = router
|
|
|
-const isTest = window.location.host == '36.134.91.96:10003'
|
|
|
-const isServe = process.env.NODE_ENV === "development"
|
|
|
+import leftMneu from "@/components/left-menu";
|
|
|
+import { registerMicroApps, start } from "qiankun";
|
|
|
+import headerBar from "@/components/header-bar";
|
|
|
+import notice from "@/components/notice";
|
|
|
+import { getAll } from "@/libs/micros";
|
|
|
+import router from "../router";
|
|
|
+import store from "../store";
|
|
|
+console.log(process.env.NODE_ENV);
|
|
|
+const state = getAll();
|
|
|
+state.router = router;
|
|
|
+const isTest = window.location.host == "36.134.91.96:10003";
|
|
|
+const isServe = process.env.NODE_ENV === "development";
|
|
|
registerMicroApps([
|
|
|
- // {
|
|
|
- // name: 'app-vue-hash',
|
|
|
- // entry: 'http://localhost:8081',
|
|
|
- // container: '#appContainer',
|
|
|
- // activeRule: '/main/app-vue-hash',
|
|
|
- // props:{
|
|
|
-
|
|
|
- // },
|
|
|
- // },
|
|
|
- {
|
|
|
- name: 'fjhxCloudVue',
|
|
|
- entry: isServe ?
|
|
|
- 'http://192.168.1.198:1777' : 'https://wdly.bytesail.cn:10002',
|
|
|
- //entry: (process.env.NODE_ENV === "development") ? 'https://wdly.bytesail.cn:10002' : 'https://wdly.bytesail.cn:10002 http://36.134.91.96:10002',
|
|
|
- container: '#appContainer',
|
|
|
- activeRule: '/main/fjhxCloudVue',
|
|
|
- props:{
|
|
|
- data:state,
|
|
|
- },
|
|
|
- },
|
|
|
- // {
|
|
|
- // name: 'iotPlatformRoom',
|
|
|
- // entry: 'http://localhost:1888',
|
|
|
- // container: '#appContainer',
|
|
|
- // activeRule: '/main/iotPlatformRoom',
|
|
|
- // props:{
|
|
|
- // data:state,
|
|
|
- // },
|
|
|
- // },
|
|
|
- // {
|
|
|
- // name: 'canvas',
|
|
|
- // entry: 'http://localhost:8080',
|
|
|
- // container: '#appContainer',
|
|
|
- // activeRule: '/main/canvas',
|
|
|
- // props:{
|
|
|
- // data:getAll()
|
|
|
- // },
|
|
|
- // },
|
|
|
+ // {
|
|
|
+ // name: 'app-vue-hash',
|
|
|
+ // entry: 'http://localhost:8081',
|
|
|
+ // container: '#appContainer',
|
|
|
+ // activeRule: '/main/app-vue-hash',
|
|
|
+ // props:{
|
|
|
+
|
|
|
+ // },
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ name: "fjhxCloudVue",
|
|
|
+ entry: isServe
|
|
|
+ ? "http://localhost:1777/"
|
|
|
+ : "https://wdly.bytesail.cn:10002",
|
|
|
+ //entry: (process.env.NODE_ENV === "development") ? 'https://wdly.bytesail.cn:10002' : 'https://wdly.bytesail.cn:10002 http://36.134.91.96:10002',
|
|
|
+ container: "#appContainer",
|
|
|
+ activeRule: "/main/fjhxCloudVue",
|
|
|
+ props: {
|
|
|
+ data: state,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // name: 'iotPlatformRoom',
|
|
|
+ // entry: 'http://localhost:1888',
|
|
|
+ // container: '#appContainer',
|
|
|
+ // activeRule: '/main/iotPlatformRoom',
|
|
|
+ // props:{
|
|
|
+ // data:state,
|
|
|
+ // },
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // name: 'canvas',
|
|
|
+ // entry: 'http://localhost:8080',
|
|
|
+ // container: '#appContainer',
|
|
|
+ // activeRule: '/main/canvas',
|
|
|
+ // props:{
|
|
|
+ // data:getAll()
|
|
|
+ // },
|
|
|
+ // },
|
|
|
]);
|
|
|
start();
|
|
|
export default {
|
|
|
- components:{
|
|
|
- leftMneu,
|
|
|
- headerBar,
|
|
|
- notice
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- input1: null,
|
|
|
- tableData:[],
|
|
|
- bankList:[],
|
|
|
- open:false,
|
|
|
- }
|
|
|
- },
|
|
|
- computed: {
|
|
|
- commonData() {
|
|
|
- return this.$store.state.commonData
|
|
|
- },
|
|
|
- },
|
|
|
- methods: {
|
|
|
- more(){
|
|
|
- console.log('更多')
|
|
|
- },
|
|
|
- confirm(_obj){
|
|
|
- console.log(_obj)
|
|
|
- },
|
|
|
- renderHeader(h, para, item) {
|
|
|
- return h('div', {
|
|
|
- attrs: {
|
|
|
- class: 'cell',
|
|
|
- },
|
|
|
- domProps: {
|
|
|
- innerHTML: item.name + '</br>(' + item.accountNumber + ')',
|
|
|
- },
|
|
|
- })
|
|
|
- },
|
|
|
- changeParentState() {
|
|
|
- this.$store.commit('setCommonData', { parent: 1 })
|
|
|
- },
|
|
|
- getData(){
|
|
|
- this.$get('/file/2023-02/08/17fa5541-541e-4ac2-a3d5-ff0eb88652f7.jpg')
|
|
|
- },
|
|
|
- },
|
|
|
- created(){
|
|
|
- //this.getData()
|
|
|
- },
|
|
|
-}
|
|
|
+ components: {
|
|
|
+ leftMneu,
|
|
|
+ headerBar,
|
|
|
+ notice,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ input1: null,
|
|
|
+ tableData: [],
|
|
|
+ bankList: [],
|
|
|
+ open: false,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ commonData() {
|
|
|
+ return this.$store.state.commonData;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ more() {
|
|
|
+ console.log("更多");
|
|
|
+ },
|
|
|
+ confirm(_obj) {
|
|
|
+ console.log(_obj);
|
|
|
+ },
|
|
|
+ renderHeader(h, para, item) {
|
|
|
+ return h("div", {
|
|
|
+ attrs: {
|
|
|
+ class: "cell",
|
|
|
+ },
|
|
|
+ domProps: {
|
|
|
+ innerHTML: item.name + "</br>(" + item.accountNumber + ")",
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ changeParentState() {
|
|
|
+ this.$store.commit("setCommonData", { parent: 1 });
|
|
|
+ },
|
|
|
+ getData() {
|
|
|
+ this.$get("/file/2023-02/08/17fa5541-541e-4ac2-a3d5-ff0eb88652f7.jpg");
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ //this.getData()
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
<style>
|
|
|
- .loading-9 {
|
|
|
- --r1: 154%;
|
|
|
- --r2: 68.5%;
|
|
|
- width: 60px;
|
|
|
- height: 60px;
|
|
|
- border-radius: 50%;
|
|
|
- background:
|
|
|
- radial-gradient(var(--r1) var(--r2) at top, #0000 79.5%, #269af2 80%) center left,
|
|
|
- radial-gradient(var(--r1) var(--r2) at bottom, #269af2 79.5%, #0000 80%) center center,
|
|
|
- radial-gradient(var(--r1) var(--r2) at top, #0000 79.5%, #269af2 80%) center right,
|
|
|
- #ccc;
|
|
|
- background-size: 50.5% 220%;
|
|
|
- background-position: -100% 0%, 0% 0%, 100% 0%;
|
|
|
- background-repeat: no-repeat;
|
|
|
- animation: p9 .3s infinite linear;
|
|
|
- }
|
|
|
+.loading-9 {
|
|
|
+ --r1: 154%;
|
|
|
+ --r2: 68.5%;
|
|
|
+ width: 60px;
|
|
|
+ height: 60px;
|
|
|
+ border-radius: 50%;
|
|
|
+ background: radial-gradient(
|
|
|
+ var(--r1) var(--r2) at top,
|
|
|
+ #0000 79.5%,
|
|
|
+ #269af2 80%
|
|
|
+ )
|
|
|
+ center left,
|
|
|
+ radial-gradient(var(--r1) var(--r2) at bottom, #269af2 79.5%, #0000 80%)
|
|
|
+ center center,
|
|
|
+ radial-gradient(var(--r1) var(--r2) at top, #0000 79.5%, #269af2 80%) center
|
|
|
+ right,
|
|
|
+ #ccc;
|
|
|
+ background-size: 50.5% 220%;
|
|
|
+ background-position: -100% 0%, 0% 0%, 100% 0%;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ animation: p9 0.3s infinite linear;
|
|
|
+}
|
|
|
|
|
|
- @keyframes p9 {
|
|
|
- 33% {
|
|
|
- background-position: 0% 33%, 100% 33%, 200% 33%
|
|
|
- }
|
|
|
+@keyframes p9 {
|
|
|
+ 33% {
|
|
|
+ background-position: 0% 33%, 100% 33%, 200% 33%;
|
|
|
+ }
|
|
|
|
|
|
- 66% {
|
|
|
- background-position: -100% 66%, 0% 66%, 100% 66%
|
|
|
- }
|
|
|
+ 66% {
|
|
|
+ background-position: -100% 66%, 0% 66%, 100% 66%;
|
|
|
+ }
|
|
|
|
|
|
- 100% {
|
|
|
- background-position: 0% 100%, 100% 100%, 200% 100%
|
|
|
- }
|
|
|
- }
|
|
|
+ 100% {
|
|
|
+ background-position: 0% 100%, 100% 100%, 200% 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
|
|
<style scoped lang="less">
|
|
|
.main {
|
|
|
- height: 100%;
|
|
|
- background: #f1f1f1;
|
|
|
- position: relative;
|
|
|
- content{
|
|
|
- display: flex;
|
|
|
- min-height: 100%;
|
|
|
- .left-menu{
|
|
|
- width: 244px;
|
|
|
- }
|
|
|
- .router-warp{
|
|
|
- width:100%;
|
|
|
- min-height:calc(~'100vh - 64px');
|
|
|
- }
|
|
|
- }
|
|
|
- .nav {
|
|
|
- display: flex;
|
|
|
- padding: 0;
|
|
|
- margin: 0;
|
|
|
- li {
|
|
|
- width: 128px;
|
|
|
- height: 64px;
|
|
|
- font-size: 16px;
|
|
|
- font-weight: 700;
|
|
|
- text-align: center;
|
|
|
- line-height: 64px;
|
|
|
- list-style: none;
|
|
|
- }
|
|
|
- li.active {
|
|
|
- background: #0084ff;
|
|
|
- color: #fff;
|
|
|
- a {
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- header {
|
|
|
- z-index: 10;
|
|
|
- left: 0;
|
|
|
- right: 0;
|
|
|
- top: 0;
|
|
|
- height: 64px;
|
|
|
- background: #fff;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- .logo {
|
|
|
- margin: 16px 42px;
|
|
|
- display: block;
|
|
|
- }
|
|
|
- .fr {
|
|
|
- display: flex;
|
|
|
+ height: 100%;
|
|
|
+ background: #f1f1f1;
|
|
|
+ position: relative;
|
|
|
+ content {
|
|
|
+ display: flex;
|
|
|
+ min-height: 100%;
|
|
|
+ .left-menu {
|
|
|
+ width: 244px;
|
|
|
+ }
|
|
|
+ .router-warp {
|
|
|
+ width: 100%;
|
|
|
+ min-height: calc(~"100vh - 64px");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .nav {
|
|
|
+ display: flex;
|
|
|
+ padding: 0;
|
|
|
+ margin: 0;
|
|
|
+ li {
|
|
|
+ width: 128px;
|
|
|
+ height: 64px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 700;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 64px;
|
|
|
+ list-style: none;
|
|
|
+ }
|
|
|
+ li.active {
|
|
|
+ background: #0084ff;
|
|
|
+ color: #fff;
|
|
|
+ a {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ header {
|
|
|
+ z-index: 10;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ height: 64px;
|
|
|
+ background: #fff;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ .logo {
|
|
|
+ margin: 16px 42px;
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ .fr {
|
|
|
+ display: flex;
|
|
|
|
|
|
- .input-search {
|
|
|
- margin: 12px 40px 12px 0;
|
|
|
- width: 240px;
|
|
|
- input {
|
|
|
- }
|
|
|
- }
|
|
|
- .dropdown-box {
|
|
|
- margin: 0 24px 0 0px;
|
|
|
- line-height: 64px;
|
|
|
- }
|
|
|
- .badge {
|
|
|
- margin: 22px 24px 22px 0;
|
|
|
- height: 20px;
|
|
|
- width: 20px;
|
|
|
- i {
|
|
|
- color: #bbbbbb;
|
|
|
- }
|
|
|
- }
|
|
|
- .user-img {
|
|
|
- margin: 12px 12px 12px 0;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ .input-search {
|
|
|
+ margin: 12px 40px 12px 0;
|
|
|
+ width: 240px;
|
|
|
+ input {
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .dropdown-box {
|
|
|
+ margin: 0 24px 0 0px;
|
|
|
+ line-height: 64px;
|
|
|
+ }
|
|
|
+ .badge {
|
|
|
+ margin: 22px 24px 22px 0;
|
|
|
+ height: 20px;
|
|
|
+ width: 20px;
|
|
|
+ i {
|
|
|
+ color: #bbbbbb;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .user-img {
|
|
|
+ margin: 12px 12px 12px 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
header > a {
|
|
|
- margin: 0 20px;
|
|
|
+ margin: 0 20px;
|
|
|
}
|
|
|
.appContainer {
|
|
|
- background: #ccc;
|
|
|
- padding: 20px;
|
|
|
+ background: #ccc;
|
|
|
+ padding: 20px;
|
|
|
}
|
|
|
</style>
|
|
|
<style>
|
|
@@ -317,10 +333,10 @@ header > a {
|
|
|
body,
|
|
|
html,
|
|
|
#appContainer,
|
|
|
-#appContainer div[id^='__qiankun_microapp_wrapper_'] {
|
|
|
- padding: 0;
|
|
|
- margin: 0;
|
|
|
- height: 100%;
|
|
|
- width: 100%;
|
|
|
+#appContainer div[id^="__qiankun_microapp_wrapper_"] {
|
|
|
+ padding: 0;
|
|
|
+ margin: 0;
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
}
|
|
|
</style>
|