点击菜单切换语言菜单自动弹回
This commit is contained in:
parent
23fca53196
commit
3eb07382ae
43
src/App.vue
43
src/App.vue
|
@ -7,54 +7,25 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { defineComponent, ref, onBeforeMount,onMounted, watch } from 'vue'
|
||||
import { defineComponent, ref, onBeforeMount, onMounted, watch } from 'vue'
|
||||
import { ElConfigProvider } from 'element-plus'
|
||||
import { ipoStore } from "@/stores/ipo"
|
||||
function isMobileFn() {
|
||||
return 768 >= document.documentElement.clientWidth;//判断当前浏览器窗口的宽度是否小于等于768像素,如果是返回true
|
||||
}
|
||||
const isMobile = ref(isMobileFn() ? true : false);
|
||||
const store = ipoStore();
|
||||
onBeforeMount(() => {
|
||||
setFontSize()
|
||||
})
|
||||
function isMobileFn() {
|
||||
return 768 >= document.documentElement.clientWidth;
|
||||
}
|
||||
const isMobile = ref(isMobileFn() ? true : false);
|
||||
const setFontSize = () => {
|
||||
// 以ipone6手机为例,1rem=1px; 以后就在ipone6手机模拟器开发,把rem当作px用就行了
|
||||
var font = document.documentElement.clientWidth / 375;
|
||||
document.documentElement.style.fontSize = font + "px";
|
||||
}
|
||||
// export default defineComponent({
|
||||
// components: {
|
||||
// ElConfigProvider,
|
||||
// },
|
||||
// setup() {
|
||||
|
||||
// // store.setLocale(2)
|
||||
// console.log(store.$state.locale, store.localeLang)
|
||||
// console.log(document.documentElement.clientWidth)
|
||||
// return {
|
||||
// store
|
||||
// }
|
||||
// },
|
||||
|
||||
// })
|
||||
// onMounted(() => {
|
||||
// window.addEventListener('resize', function () {
|
||||
// isMobile.value = isMobileFn();
|
||||
// if (isMobile.value) {
|
||||
// window.location.reload()
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
// watch(isMobile, (newValue) => {
|
||||
// window.location.reload()
|
||||
// })
|
||||
onMounted(() => {
|
||||
window.addEventListener('resize', function () {
|
||||
var font = document.documentElement.clientWidth / 375;
|
||||
document.documentElement.style.fontSize = font + "px";
|
||||
})
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" >
|
||||
|
@ -96,7 +67,7 @@ onMounted(() => {
|
|||
background-image: url("@/assets/1x/beijingtu.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
// height: 100%;
|
||||
// height: 100%;
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
|
|
|
@ -28,6 +28,7 @@ for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
|
|||
app.component(key, component)
|
||||
}
|
||||
app.config.warnHandler = (msg, instance, trace) => {}
|
||||
app.config.errorHandler = (msg, instance, trace) => {}//错误捕获,不报给浏览器
|
||||
app
|
||||
// .use(pinia)
|
||||
.use(router)
|
||||
|
|
|
@ -117,7 +117,7 @@ const data = defineProps<{ info: obj[], title: string }>()
|
|||
|
||||
@media screen and (max-width: 768px) {
|
||||
display: block;
|
||||
margin-top: 10px;
|
||||
margin-top: 21px;
|
||||
|
||||
:deep(.el-table) {
|
||||
color: #355D80;
|
||||
|
|
|
@ -2,14 +2,12 @@
|
|||
<div class="headerWrap">
|
||||
<el-drawer v-model="drawer" size="80%" direction="ltr" :show-close="false" :before-close="handleDrawer"
|
||||
style="background-color: #1C3F56;" :with-header="false">
|
||||
<Drawer />
|
||||
<Drawer :drawer = "drawer" @childfn="fn"/>
|
||||
</el-drawer>
|
||||
<div class="hleft">
|
||||
<div class="left-1">
|
||||
<div class="menu">
|
||||
<img src="@/assets/1x/1x/source5.png" alt="menu" class="menuicon" @click="openDrawer">
|
||||
</div>
|
||||
<div class="title">{{ $t(i18n.global.t('dashboard.IPOReferenceData')) }}</div>
|
||||
<img src="@/assets/1x/1x/source5.png" alt="menu" @click="openDrawer" class="menu">
|
||||
<div class="title">{{ $t(i18n.global.t('dashboard.IPOReferenceData')) }}</div>
|
||||
</div>
|
||||
|
||||
<div class="search" @click="handlesearch">
|
||||
|
@ -62,6 +60,9 @@ onMounted(() => {
|
|||
lang.value.showLang = false
|
||||
}
|
||||
})
|
||||
function fn(data:any){
|
||||
drawer.value = data
|
||||
}
|
||||
onUnmounted(() => {
|
||||
document.documentElement.onclick = null
|
||||
})
|
||||
|
@ -128,7 +129,9 @@ onUnmounted(() => {
|
|||
|
||||
@media screen and (max-width: 768px) {
|
||||
display: block;
|
||||
margin-top: 3px;
|
||||
vertical-align: middle;
|
||||
width: 25px;
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -138,8 +141,9 @@ onUnmounted(() => {
|
|||
font-weight: bolder;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 26px;
|
||||
font-size: 20px;
|
||||
transform: translateX(-60px);
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -121,10 +121,10 @@ const TypeOfListing = ref([
|
|||
name: proxy.$t('ipo.TypeofListing.ListingType'),
|
||||
info: "Primary"
|
||||
},
|
||||
{
|
||||
name: proxy.$t('ipo.TypeofListing.ListingCategories'),
|
||||
info: "-"
|
||||
}
|
||||
// {
|
||||
// name: proxy.$t('ipo.TypeofListing.ListingCategories'),
|
||||
// info: "-"
|
||||
// }
|
||||
])
|
||||
const Offerings = ref([
|
||||
{
|
||||
|
@ -344,7 +344,6 @@ onMounted(
|
|||
data.value = JSON.parse(localStorage.getItem('itemData') as string)
|
||||
getreferencedata()
|
||||
setDownLoad()
|
||||
|
||||
// text();
|
||||
}
|
||||
)
|
||||
|
@ -421,12 +420,12 @@ function setOfferings(mockRes: any) {
|
|||
var dataObj = [
|
||||
{ info: has_data(tradeCurrency) },
|
||||
{ info: keepTwoDecimalStr(downwardPriceFlex) },
|
||||
{ info: has_data(priceMin.toFixed(3)) + "-" + has_data(priceMax.toFixed(3)), info2: has_data(priceFinal.toFixed(3)) },
|
||||
{ info: has_data(priceMin?.toFixed(3)) + "-" + has_data(priceMax?.toFixed(3)), info2: has_data(priceFinal?.toFixed(3)) },
|
||||
{ info: has_data(boardLot) },
|
||||
{ info: keepTwoDecimalStr(poReallocationCap) },
|
||||
{ info: "-", info2s: [has_data(ipoShares?.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')), has_data(poSharesFinal?.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')), has_data(ioOfferSharesFinal?.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'))], table: clawback },
|
||||
{ info: has_data(overallPoShares?.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')), info2: has_data(overallIoShares?.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')), },
|
||||
{ info: has_data(upsizeOption.toFixed(2),"%") },
|
||||
{ info: has_data(upsizeOption?.toFixed(2),"%") },
|
||||
{ info: "-" },
|
||||
{ info: keepTwoDecimalStr(overallotOption) },
|
||||
{ table: denomTable }
|
||||
|
@ -591,14 +590,14 @@ function setTypeofListing(mockRes: any) {
|
|||
}
|
||||
//没找到的字段ListingType listingCategories
|
||||
// const ListingType = "-";
|
||||
const listingCategories = "-";
|
||||
// const listingCategories = "-";
|
||||
const arr = [
|
||||
{ info: offerType },
|
||||
{ info: listSecurities },
|
||||
{ info: has_data(nomValue), info2: nomCur as any },
|
||||
{ info: listPlatform },
|
||||
{ info: has_data(listSecurities) },
|
||||
{ info: has_data(listingCategories) }]
|
||||
{ info: has_data(listSecurities) },]
|
||||
// { info: has_data(listingCategories) }]
|
||||
TypeOfListing.value = TypeOfListing.value.map((item, index) => {
|
||||
if (arr[index].info2) {
|
||||
return { ...item, info: arr[index].info, info2: arr[index].info2 }
|
||||
|
@ -756,12 +755,8 @@ function scrollTo(stron: string) {
|
|||
async function setDownLoad (){
|
||||
const ipoID = localStorage.getItem('ipoID');
|
||||
const res = await getIpo(ipoID as string)
|
||||
console.log('@@1',(res as any).data[0].pdfLink.cLink);
|
||||
|
||||
const enHref = `${(res as any).data[0].pdfLink.eLink}`;
|
||||
const chinaHref = `${(res as any).data[0].pdfLink.cLink}`;
|
||||
console.log(enHref);
|
||||
|
||||
Documents.value= [
|
||||
{
|
||||
name: proxy.$t('ipo.Documents.ListingDocumentEnglish'),
|
||||
|
@ -772,8 +767,6 @@ function scrollTo(stron: string) {
|
|||
href2:chinaHref
|
||||
},
|
||||
]
|
||||
// return store.$state.locale == 1 ? enHref : chinaHref
|
||||
// return [enHref, chinaHref] as any;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
@ -2,23 +2,21 @@
|
|||
<div class="headerWrap">
|
||||
<div class="left">
|
||||
<div class="left-1">
|
||||
<div class="menu">
|
||||
<img src="@/assets/1x/1x/source5.png" alt="menu" class="menuicon" @click="drawShow" >
|
||||
</div>
|
||||
<span>{{ $t(i18n.global.t('dashboard.Dashboard')) }}</span>
|
||||
<img src="@/assets/1x/1x/source5.png" alt="menu" @click="drawShow" class="menu">
|
||||
<span>{{ $t(i18n.global.t('dashboard.Dashboard')) }}</span>
|
||||
</div>
|
||||
<div class="left-right">
|
||||
<div class="search" @click="handlesearch">
|
||||
<img src="@/assets/1x/1x/source2.png" alt="找不到图片">
|
||||
<img src="@/assets/1x/1x/source2.png" alt="找不到图片">
|
||||
</div>
|
||||
|
||||
<div class="langWrap">
|
||||
<img src="@/assets/1x/source1.png" @click="handleShowLang" class="second">
|
||||
<Lang ref="lang" class="lang" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="langWrap">
|
||||
<img src="@/assets/1x/source1.png" @click="handleShowLang" class="second">
|
||||
<Lang ref="lang" class="lang"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<div class="right">
|
||||
<li class="time">{{ $t(i18n.global.t('dashboard.LastUpadated')) }}: {{ props.time }}</li>
|
||||
|
@ -39,7 +37,7 @@ export default {
|
|||
<script lang="ts" setup>
|
||||
import { ref } from 'vue'
|
||||
import i18n from '@/locales'
|
||||
import { getCurrentInstance,onMounted,onUnmounted} from 'vue'
|
||||
import { getCurrentInstance, onMounted, onUnmounted } from 'vue'
|
||||
import Drawer from '@/views/login/modelComponents/Drawer.vue'
|
||||
import Lang from "@/views/login/components/Lang.vue";
|
||||
import { conforms } from 'lodash';
|
||||
|
@ -47,9 +45,9 @@ const { proxy } = (getCurrentInstance() as any)
|
|||
const value = ref(true)
|
||||
|
||||
const lang = ref()
|
||||
const handleShowLang=(e:any)=>{
|
||||
console.log(1111)
|
||||
e.stopPropagation()
|
||||
const handleShowLang = (e: any) => {
|
||||
console.log(1111)
|
||||
e.stopPropagation()
|
||||
lang.value.showLang = !lang.value.showLang
|
||||
}
|
||||
onMounted(() => {
|
||||
|
@ -63,12 +61,12 @@ onUnmounted(() => {
|
|||
})
|
||||
const props = defineProps({
|
||||
time: [String, Number],
|
||||
openDrawer:{
|
||||
required:true,
|
||||
type:Function
|
||||
openDrawer: {
|
||||
required: true,
|
||||
type: Function
|
||||
}
|
||||
})
|
||||
const handlesearch = ()=>{
|
||||
const handlesearch = () => {
|
||||
proxy.$router.push("/home")
|
||||
}
|
||||
const handleDrawer = (done: () => void) => {
|
||||
|
@ -81,7 +79,7 @@ const drawShow = () => {
|
|||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.langWrap{
|
||||
.langWrap {
|
||||
// position: absolute;
|
||||
// // top:-20px;
|
||||
// left: 260px;
|
||||
|
@ -89,70 +87,89 @@ const drawShow = () => {
|
|||
// align-items: end;
|
||||
position: relative;
|
||||
margin-left: 15px;
|
||||
.second {
|
||||
|
||||
width: 32px;
|
||||
height: 36px;
|
||||
margin-top: 4px;
|
||||
&:hover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
|
||||
.second {
|
||||
|
||||
width: 32px;
|
||||
height: 36px;
|
||||
margin-top: 4px;
|
||||
|
||||
&:hover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
}
|
||||
.lang{
|
||||
position: absolute;
|
||||
top:50px;
|
||||
left: -50px;
|
||||
}
|
||||
|
||||
.lang {
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
left: -50px;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
left: -120px;
|
||||
|
||||
}
|
||||
.left-right{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 6vw;
|
||||
margin-right: 10rem;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.left-right {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 6vw;
|
||||
margin-right: 10rem;
|
||||
}
|
||||
|
||||
.headerWrap {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding-top: 40px;
|
||||
transform: translateY(-20px);
|
||||
|
||||
@media screen and (max-width: 768px){
|
||||
@media screen and (max-width: 768px) {
|
||||
flex-direction: column;
|
||||
.left-1{
|
||||
|
||||
.left-1 {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 40vw;
|
||||
margin-left: 15px;
|
||||
}
|
||||
.left-right{
|
||||
|
||||
.left-right {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 25vw;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
position: relative;
|
||||
@media screen and (max-width: 768px){
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
justify-content: space-between;
|
||||
width: 100vw;
|
||||
align-items:center;
|
||||
align-items: center;
|
||||
}
|
||||
.menu{
|
||||
display: none;
|
||||
@media screen and (max-width: 768px){
|
||||
display: block;
|
||||
margin-top: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
.menu {
|
||||
display: none;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
display: block;
|
||||
// margin-top: 3px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
color: #2B4A60;
|
||||
font-size: 45px;
|
||||
font-weight: 900;
|
||||
@media screen and (max-width: 768px){
|
||||
font-size: 26px;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 25px;
|
||||
// margin-top: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -167,6 +184,7 @@ const drawShow = () => {
|
|||
margin-left: 15px;
|
||||
margin-top: 6px;
|
||||
cursor: pointer;
|
||||
|
||||
img {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
|
@ -176,14 +194,19 @@ const drawShow = () => {
|
|||
|
||||
.right {
|
||||
font-size: 20px;
|
||||
@media screen and (max-width: 768px){
|
||||
width: 100vw;
|
||||
margin-top: 10px;
|
||||
transform: translateX(-10px);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
// width: 100vw;
|
||||
color: red;
|
||||
margin-top: 10px;
|
||||
transform: translateX(-10px);
|
||||
|
||||
}
|
||||
|
||||
.time {
|
||||
color: #435F70;
|
||||
@media screen and (max-width: 768px){
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
float: right;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
@ -194,6 +217,7 @@ const drawShow = () => {
|
|||
text-align: right;
|
||||
color: #27485E;
|
||||
font-weight: 600;
|
||||
|
||||
span {
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
@ -201,10 +225,12 @@ const drawShow = () => {
|
|||
:deep(.el-switch__action) {
|
||||
background-color: #E86666;
|
||||
}
|
||||
@media screen and (max-width: 768px){
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
font-size: 15px;
|
||||
margin-top: 13px;
|
||||
transform: translateX(200px);
|
||||
transform: translateX(175px);
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,35 +1,39 @@
|
|||
<template>
|
||||
<div class="bigbox" @click="handleclick(props.data)">
|
||||
<div class="title">
|
||||
<img :src="props.data.logolinks" />
|
||||
</div>
|
||||
<Aimage :src="props.data.logolinks" :number="props.data.number"/>
|
||||
<div class="list">
|
||||
<div class="list-content" >
|
||||
<div class="list-content">
|
||||
<div class="top">
|
||||
<h4 >{{ store.$state.locale == 1 ? props.data.title.split(";")[0] : props.data.title.split(";")[1] }}
|
||||
<h4>{{ store.$state.locale == 1 ? props.data.title.split(";")[0] : props.data.title.split(";")[1] }}
|
||||
</h4>
|
||||
<el-icon class="icon1" @click="cardDetail">
|
||||
<ArrowUp v-if="expand"/>
|
||||
<ArrowDown v-else />
|
||||
<ArrowUp v-if="expand" />
|
||||
<ArrowDown v-else />
|
||||
</el-icon>
|
||||
</div>
|
||||
<h4 >{{ props.data.number }}</h4>
|
||||
<div v-if="expand" class="details" >
|
||||
<h5 v-for="(item,index) in detailsItem" :key="index">
|
||||
<h4>{{ props.data.number }}</h4>
|
||||
<div v-if="expand" class="details">
|
||||
<h5 v-for="(item, index) in detailsItem" :key="index">
|
||||
<span>{{ item.name }}</span>
|
||||
<el-icon class="icon1" v-if="item.icon">
|
||||
<Check v-if="item.icon==1" />
|
||||
<img v-if="item.icon==2" src="@/assets/1x/1x/source9.png" class="icon">
|
||||
</el-icon>
|
||||
<Check v-if="item.icon == 1" />
|
||||
<!-- <Filter v-if="item.icon==2" /> -->
|
||||
<img v-if="item.icon == 2" src="@/assets/1x/1x/source9.png" class="icon">
|
||||
</el-icon>
|
||||
</h5>
|
||||
|
||||
|
||||
</div>
|
||||
<h5 v-else>{{ code22 }}</h5>
|
||||
|
||||
<h4>HKD {{ props.data.HKD }}</h4>
|
||||
<h6>{{props.data.price? $t(i18n.global.t('home.finalofferprice')):$t(i18n.global.t('home.offerpricerange')) }}</h6>
|
||||
<h5 v-else :style="{color:props.data.status == '80'|| props.data.status == '90'?'#FF6666':''}">{{ code22 }}</h5>
|
||||
|
||||
<h4 >HKD {{ props.data.HKD }}</h4>
|
||||
<h6>{{ props.data.price ? $t(i18n.global.t('home.finalofferprice')) :
|
||||
$t(i18n.global.t('home.offerpricerange'))
|
||||
}}</h6>
|
||||
<h5>{{ props.data.time }}</h5>
|
||||
<h6>{{props.data.listingDate? $t(i18n.global.t('home.CommencementofTradeDate')):$t(i18n.global.t('home.ExpectedPriceDeterminationDate')) }}</h6>
|
||||
<h6>{{ props.data.listingDate ?
|
||||
$t(i18n.global.t('home.CommencementofTradeDate')) :
|
||||
$t(i18n.global.t('home.ExpectedPriceDeterminationDate'))
|
||||
}}</h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -47,47 +51,49 @@ import i18n from '@/locales'
|
|||
import { getCurrentInstance } from 'vue'
|
||||
import logo from '@/assets/Snipaste.png'
|
||||
import { useRouter } from 'vue-router';
|
||||
import { computed } from '@vue/reactivity';
|
||||
import Aimage from "./image1/index.vue";
|
||||
const { proxy } = (getCurrentInstance() as any)
|
||||
const store = ipoStore();
|
||||
const currentDate = ref(new Date())
|
||||
const expand=ref(false);
|
||||
|
||||
const expand = ref(false);
|
||||
const fontstyle = ref()
|
||||
const router = useRouter()
|
||||
const detailsItem=[
|
||||
const detailsItem = ref([
|
||||
{
|
||||
name:proxy.$t('home.DealInitiated'),
|
||||
icon:1
|
||||
name: proxy.$t('home.DealInitiated'),
|
||||
icon: 0
|
||||
},
|
||||
{
|
||||
name:proxy.$t('home.PublicOfferClosed'),
|
||||
icon:1
|
||||
name: proxy.$t('home.PublicOfferClosed'),
|
||||
icon: 0
|
||||
},
|
||||
{
|
||||
name:proxy.$t('home.ApplicationValidated'),
|
||||
icon:1
|
||||
name: proxy.$t('home.ApplicationValidated'),
|
||||
icon: 0
|
||||
},
|
||||
{
|
||||
name:proxy.$t('home.AllotmentConfirmed'),
|
||||
icon:2
|
||||
name: proxy.$t('home.AllotmentConfirmed'),
|
||||
icon: 0
|
||||
}
|
||||
, {
|
||||
name:proxy.$t('home.MoneySettlement'),
|
||||
icon:0
|
||||
name: proxy.$t('home.MoneySettlement'),
|
||||
icon: 0
|
||||
},
|
||||
{
|
||||
name:proxy.$t('home.AllocationConfirmed'),
|
||||
icon:0
|
||||
},{
|
||||
name: proxy.$t('home.AllocationConfirmed'),
|
||||
icon: 0
|
||||
}, {
|
||||
name: proxy.$t('home.placingApproved'),
|
||||
icon:0
|
||||
},{
|
||||
name:proxy.$t('home.AllotmentResultsApproved'),
|
||||
icon:0
|
||||
},{
|
||||
name:proxy.$t('home.TradingStarted'),
|
||||
icon:0
|
||||
icon: 0
|
||||
}, {
|
||||
name: proxy.$t('home.AllotmentResultsApproved'),
|
||||
icon: 0
|
||||
}, {
|
||||
name: proxy.$t('home.TradingStarted'),
|
||||
icon: 0
|
||||
}
|
||||
]
|
||||
])
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
|
@ -101,13 +107,20 @@ const props = defineProps({
|
|||
trading: "",
|
||||
logolinks: "",
|
||||
status: 0,
|
||||
listingDate:""
|
||||
listingDate: "",
|
||||
ipoID:0
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
const code22 = ref('')
|
||||
// onMounted(()=>{
|
||||
// if(props.data.status == 80){
|
||||
|
||||
// }
|
||||
// })
|
||||
onUpdated(() => {
|
||||
var obj = {
|
||||
25: proxy.$t('home.DealInitiated'),
|
||||
|
@ -122,12 +135,25 @@ onUpdated(() => {
|
|||
80: proxy.$t('home.Suspended'),
|
||||
90: proxy.$t('home.Cancelled'),
|
||||
}
|
||||
// console.log('&&&&', props.data.status)
|
||||
console.log('&&&&', props.data.status)
|
||||
const stron = props.data.status
|
||||
|
||||
|
||||
if (isValidKey(stron, obj)) {
|
||||
code22.value = obj[stron];
|
||||
// console.log('kkkk',stron,obj[stron])
|
||||
// console.log('kkkk',stron,obj[stron])
|
||||
}
|
||||
var tag = true;
|
||||
detailsItem.value = detailsItem.value.map(item => {
|
||||
if (code22.value == item.name && tag) {
|
||||
tag = false;
|
||||
return { ...item, icon: 2 }
|
||||
} else if (tag) {
|
||||
return { ...item, icon: 1 }
|
||||
} else {
|
||||
return { ...item, icon: 0 }
|
||||
}
|
||||
})
|
||||
// 以下函数解决ts中括号语法obj[stron]读取对象属性的报错
|
||||
function isValidKey(
|
||||
key: string | number | symbol,
|
||||
|
@ -137,13 +163,15 @@ onUpdated(() => {
|
|||
}
|
||||
|
||||
})
|
||||
const cardDetail=(e:any)=>{
|
||||
const cardDetail = (e: any) => {
|
||||
e.stopPropagation();
|
||||
expand.value=!expand.value;
|
||||
expand.value = !expand.value;
|
||||
}
|
||||
//路由传参
|
||||
const handleclick = (item: any) => {
|
||||
localStorage.setItem('ipoID', item.number)
|
||||
localStorage.setItem('ipoID', item.ipoID)
|
||||
console.log(item);
|
||||
|
||||
localStorage.setItem('itemData', JSON.stringify(item))
|
||||
router.push({
|
||||
name: 'Xdashboard',
|
||||
|
@ -159,8 +187,8 @@ const handleclick = (item: any) => {
|
|||
|
||||
width: 270px;
|
||||
// height: 360px;
|
||||
height:fit-content;
|
||||
min-height: 350px;
|
||||
// height: fit-content;
|
||||
// min-height: 350px;
|
||||
margin-top: 30px;
|
||||
margin-left: 20px;
|
||||
background-color: #e7efec;
|
||||
|
@ -168,11 +196,23 @@ const handleclick = (item: any) => {
|
|||
overflow: hidden;
|
||||
border: 1px solid #DDE2E6;
|
||||
cursor: pointer;
|
||||
|
||||
// font-family: "Calibri";
|
||||
// @media screen and (max-width: 768px){
|
||||
// width: 270rem;
|
||||
// height: 360rem;
|
||||
// }
|
||||
.imglogo{
|
||||
background-color: #23445a;
|
||||
height: 15vh;
|
||||
line-height: 15vh;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
font-size: 38px;
|
||||
font-weight: bold;
|
||||
font-family: "Calibri";
|
||||
color: #fff;
|
||||
}
|
||||
.title {
|
||||
background-color: #fff;
|
||||
height: 120px;
|
||||
|
@ -182,6 +222,7 @@ const handleclick = (item: any) => {
|
|||
overflow: hidden;
|
||||
position: relative;
|
||||
font-family: "Calibri";
|
||||
|
||||
// @media screen and (max-width: 768px){
|
||||
// font-size: 80px;
|
||||
// }
|
||||
|
@ -202,16 +243,19 @@ const handleclick = (item: any) => {
|
|||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
font-family: "Calibri";
|
||||
|
||||
.list-content {
|
||||
margin-top: 10px;
|
||||
width: 230px;
|
||||
|
||||
// height: 100%;
|
||||
.details{
|
||||
.icon1{
|
||||
margin-left: 3px;
|
||||
transform: translateY(2.5px);
|
||||
}
|
||||
.details {
|
||||
.icon1 {
|
||||
margin-left: 3px;
|
||||
transform: translateY(2.5px);
|
||||
}
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 20px;
|
||||
color: #3b6181;
|
||||
|
@ -230,7 +274,7 @@ const handleclick = (item: any) => {
|
|||
|
||||
h6 {
|
||||
font-size: 12px;
|
||||
color:#5e7e98;
|
||||
color: #5e7e98;
|
||||
margin-bottom: 8px;
|
||||
// font-family: "Calibri";
|
||||
}
|
||||
|
@ -238,14 +282,14 @@ const handleclick = (item: any) => {
|
|||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
|
||||
}
|
||||
.icon{
|
||||
@media screen and (max-width: 768px){
|
||||
|
||||
.icon {
|
||||
@media screen and (max-width: 768px) {
|
||||
width: 13rem;
|
||||
height: 13rem;
|
||||
}
|
||||
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
}
|
||||
|
@ -257,18 +301,19 @@ const handleclick = (item: any) => {
|
|||
// background-color: red;
|
||||
box-shadow: 10px 15px 10px #9A9A9A;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
|
||||
.bigbox {
|
||||
|
||||
width: 76vw;
|
||||
min-height: 310px;
|
||||
height:fit-content;
|
||||
.bigbox {
|
||||
|
||||
margin-top: 14px !important;
|
||||
cursor: pointer;
|
||||
width: 76vw;
|
||||
// min-height: 310rem;
|
||||
// height: fit-content;
|
||||
|
||||
}
|
||||
margin-top: 14px !important;
|
||||
cursor: pointer;
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
|
|
@ -0,0 +1,79 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="title" v-if="isImage">
|
||||
<img v-lazy="props.src" />
|
||||
</div>
|
||||
<div class="title2" v-else>
|
||||
{{props.number}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: "XEvent",
|
||||
};
|
||||
</script>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {ref,onMounted,watch} from 'vue'
|
||||
const props = defineProps({
|
||||
src: {
|
||||
type: String,
|
||||
required:true
|
||||
},
|
||||
number: {
|
||||
type: String,
|
||||
required:true
|
||||
}
|
||||
})
|
||||
const isImage=ref(false)
|
||||
const checkImgExists=(imgurl:string) =>{
|
||||
try{
|
||||
var ImgObj = new Image();
|
||||
ImgObj.src = imgurl;
|
||||
ImgObj.onload = () => {
|
||||
isImage.value = true;
|
||||
};
|
||||
ImgObj.onerror = () => {
|
||||
|
||||
isImage.value= false;
|
||||
};
|
||||
}catch(error){
|
||||
console.log('error')
|
||||
}
|
||||
|
||||
}
|
||||
setTimeout(()=>{
|
||||
checkImgExists(props.src)
|
||||
},100)
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.title {
|
||||
background-color: #fff;
|
||||
height: 120px;
|
||||
line-height: 120px;
|
||||
font-size: 40px;
|
||||
color: #fff;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
font-family: "Calibri";
|
||||
img {
|
||||
max-height: 100%;
|
||||
max-width: 100%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
}
|
||||
.title2{
|
||||
background-color: #23445a;
|
||||
color: #fff;
|
||||
height: 120px;
|
||||
line-height: 120px;
|
||||
font-size: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
|
@ -1,16 +1,16 @@
|
|||
<template>
|
||||
<div class="login1">
|
||||
<el-drawer v-model="drawer" size="80%" direction="ltr" :show-close="false" :before-close="handleDrawer"
|
||||
style="background-color: #1C3F56;" :with-header="false" >
|
||||
<Drawer />
|
||||
</el-drawer>
|
||||
style="background-color: #1C3F56;" :with-header="false">
|
||||
<Drawer :drawer = "drawer" @childfn="fn"/>
|
||||
</el-drawer>
|
||||
<div class="wrap w">
|
||||
<div class="leftbox">
|
||||
<Item :data="data" />
|
||||
<Nav />
|
||||
</div>
|
||||
<div class="rightbox">
|
||||
<Header :time="datatime" :openDrawer="openDrawer"/>
|
||||
<Header :time="datatime" :openDrawer="openDrawer" />
|
||||
<div class="content">
|
||||
<div class="content-topleft">
|
||||
<p class="content-title">{{ $t(i18n.global.t('dashboard.Milestones')) }}</p>
|
||||
|
@ -151,7 +151,7 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
|
@ -176,10 +176,10 @@ import Drawer from '@/views/login/modelComponents/Drawer.vue'
|
|||
import { getDataFromId } from "@/api/mock/home";
|
||||
const drawer = ref(false)
|
||||
const handleDrawer = (done: () => void) => {
|
||||
done();
|
||||
done();
|
||||
}
|
||||
const openDrawer = () => {
|
||||
drawer.value = true;
|
||||
drawer.value = true;
|
||||
}
|
||||
const { proxy } = (getCurrentInstance() as any)
|
||||
// console.log('getCurrentInstance()中的proxy:', proxy)
|
||||
|
@ -259,8 +259,8 @@ const setBar = async () => {
|
|||
const ipoID = localStorage.getItem('ipoID')
|
||||
const result = await getIpo(ipoID as string)
|
||||
// console.log(ipoID,(result as any).data[0]);
|
||||
console.log(ipoID,(result as any).data[0]);
|
||||
|
||||
console.log(ipoID, (result as any).data[0]);
|
||||
|
||||
// if((result as any).data[0].graph!=null){
|
||||
// PublicOfferX1.value = (result as any).data[0].graph.map((item: any) => {
|
||||
// return moment(item.dateTime).format('MM/DD')
|
||||
|
@ -312,7 +312,7 @@ const getreferencedata = async () => {
|
|||
initialpublic.value = res.poSharesInitial
|
||||
ApplicationQuantity.value = res.poApplicationQuantity
|
||||
subscriptionRatio.value = res.poApplicationQuantity / res.poSharesInitial
|
||||
subscriptionRatio.value = subscriptionRatio.value.toFixed(1)
|
||||
subscriptionRatio.value = subscriptionRatio?.value.toFixed(1)
|
||||
initialinstituational.value = res.ioSharesInitial
|
||||
// console.log('initialinstituational', (res as any).data[0].poSharesInitial);
|
||||
code44.value = res.poSharesFinal
|
||||
|
@ -628,7 +628,9 @@ const showMounth = (date: any) => {
|
|||
// }
|
||||
return date
|
||||
}
|
||||
|
||||
function fn(data:any){
|
||||
drawer.value = data
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
@ -642,7 +644,9 @@ const showMounth = (date: any) => {
|
|||
font-family: "Calibri";
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
height: 2500px;
|
||||
height: fit-content;
|
||||
width: 100vw;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -650,6 +654,12 @@ const showMounth = (date: any) => {
|
|||
display: flex;
|
||||
padding-top: 30px;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
width: fit-content;
|
||||
height: fit-content;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.leftbox {
|
||||
width: 22%;
|
||||
height: 100%;
|
||||
|
@ -992,7 +1002,7 @@ const showMounth = (date: any) => {
|
|||
@media screen and (max-width: 768px) {
|
||||
width: 92vw;
|
||||
margin-left: 5vw;
|
||||
|
||||
|
||||
}
|
||||
|
||||
// background-color: red;
|
||||
|
@ -1124,20 +1134,20 @@ const showMounth = (date: any) => {
|
|||
|
||||
@media screen and (max-width: 768px) {
|
||||
width: 71vw;
|
||||
transform: translate(-4vw);
|
||||
margin-left: -4px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
:deep(.el-calendar-table) {
|
||||
width: 450px;
|
||||
// background-color: red !important;
|
||||
padding-left: 10px 75px 27px !important;
|
||||
cursor: default;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
width: 80vw;
|
||||
transform: translate(-4vw);
|
||||
// transform: translate(-4vw);
|
||||
margin-left: -10px;
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
@ -58,7 +58,13 @@ defineExpose({
|
|||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
z-index: 99;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
li {
|
||||
text-align: center;
|
||||
|
|
|
@ -1,8 +1,7 @@
|
|||
<template>
|
||||
<div class="bigbox" @click="handleclick(props.data)">
|
||||
<div class="title">
|
||||
<img v-lazy="props.data.logolinks" />
|
||||
</div>
|
||||
<Aimage :src="props.data.logolinks" :number="props.data.number"/>
|
||||
|
||||
<div class="list">
|
||||
<div class="list-content">
|
||||
<div class="top">
|
||||
|
@ -25,9 +24,9 @@
|
|||
</h5>
|
||||
|
||||
</div>
|
||||
<h5 v-else>{{ code22 }}</h5>
|
||||
<h5 v-else :style="{color:props.data.status == '80'|| props.data.status == '90'?'#FF6666':''}">{{ code22 }}</h5>
|
||||
|
||||
<h4>HKD {{ props.data.HKD }}</h4>
|
||||
<h4 >HKD {{ props.data.HKD }}</h4>
|
||||
<h6>{{ props.data.price ? $t(i18n.global.t('home.finalofferprice')) :
|
||||
$t(i18n.global.t('home.offerpricerange'))
|
||||
}}</h6>
|
||||
|
@ -53,11 +52,13 @@ import i18n from '@/locales'
|
|||
import { getCurrentInstance } from 'vue'
|
||||
import logo from '@/assets/Snipaste.png'
|
||||
import { useRouter } from 'vue-router';
|
||||
import { computed } from '@vue/reactivity';
|
||||
import Aimage from "./a-image/index.vue";
|
||||
const { proxy } = (getCurrentInstance() as any)
|
||||
const store = ipoStore();
|
||||
const currentDate = ref(new Date())
|
||||
const expand = ref(false);
|
||||
|
||||
const fontstyle = ref()
|
||||
const router = useRouter()
|
||||
const detailsItem = ref([
|
||||
{
|
||||
|
@ -116,6 +117,11 @@ const props = defineProps({
|
|||
|
||||
|
||||
const code22 = ref('')
|
||||
// onMounted(()=>{
|
||||
// if(props.data.status == 80){
|
||||
|
||||
// }
|
||||
// })
|
||||
onUpdated(() => {
|
||||
var obj = {
|
||||
25: proxy.$t('home.DealInitiated'),
|
||||
|
@ -130,9 +136,10 @@ onUpdated(() => {
|
|||
80: proxy.$t('home.Suspended'),
|
||||
90: proxy.$t('home.Cancelled'),
|
||||
}
|
||||
// console.log('&&&&', props.data.status)
|
||||
console.log('&&&&', props.data.status)
|
||||
const stron = props.data.status
|
||||
|
||||
|
||||
if (isValidKey(stron, obj)) {
|
||||
code22.value = obj[stron];
|
||||
// console.log('kkkk',stron,obj[stron])
|
||||
|
@ -161,6 +168,24 @@ const cardDetail = (e: any) => {
|
|||
e.stopPropagation();
|
||||
expand.value = !expand.value;
|
||||
}
|
||||
// const fontstyle = computed((status)=>{
|
||||
// if(status == 80 ){
|
||||
// return {'color':'red'}
|
||||
// }
|
||||
// if(status == 90){
|
||||
// return {'color':'red'}
|
||||
// }
|
||||
// })
|
||||
// function fontstyle(status:any){
|
||||
// console.log(status);
|
||||
|
||||
// if(status == 80 ){
|
||||
// return {'color':'red'}
|
||||
// }
|
||||
// if(status == 90){
|
||||
// return {'color':'red'}
|
||||
// }
|
||||
// }
|
||||
//路由传参
|
||||
const handleclick = (item: any) => {
|
||||
localStorage.setItem('ipoID', item.ipoID)
|
||||
|
@ -196,6 +221,17 @@ const handleclick = (item: any) => {
|
|||
// width: 270rem;
|
||||
// height: 360rem;
|
||||
// }
|
||||
.imglogo{
|
||||
background-color: #23445a;
|
||||
height: 15vh;
|
||||
line-height: 15vh;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
font-size: 38px;
|
||||
font-weight: bold;
|
||||
font-family: "Calibri";
|
||||
color: #fff;
|
||||
}
|
||||
.title {
|
||||
background-color: #fff;
|
||||
height: 120px;
|
||||
|
|
|
@ -0,0 +1,79 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="title" v-if="isImage">
|
||||
<img v-lazy="props.src" />
|
||||
</div>
|
||||
<div class="title2" v-else>
|
||||
{{props.number}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: "XEvent",
|
||||
};
|
||||
</script>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {ref,onMounted,watch} from 'vue'
|
||||
const props = defineProps({
|
||||
src: {
|
||||
type: String,
|
||||
required:true
|
||||
},
|
||||
number: {
|
||||
type: String,
|
||||
required:true
|
||||
}
|
||||
})
|
||||
const isImage=ref(false)
|
||||
const checkImgExists=(imgurl:string) =>{
|
||||
try{
|
||||
var ImgObj = new Image();
|
||||
ImgObj.src = imgurl;
|
||||
ImgObj.onload = () => {
|
||||
isImage.value = true;
|
||||
};
|
||||
ImgObj.onerror = () => {
|
||||
|
||||
isImage.value= false;
|
||||
};
|
||||
}catch(error){
|
||||
console.log('error')
|
||||
}
|
||||
|
||||
}
|
||||
setTimeout(()=>{
|
||||
checkImgExists(props.src)
|
||||
},1000)
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.title {
|
||||
background-color: #fff;
|
||||
height: 120px;
|
||||
line-height: 120px;
|
||||
font-size: 40px;
|
||||
color: #fff;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
font-family: "Calibri";
|
||||
img {
|
||||
max-height: 100%;
|
||||
max-width: 100%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
}
|
||||
.title2{
|
||||
background-color: #23445a;
|
||||
color: #fff;
|
||||
height: 120px;
|
||||
line-height: 120px;
|
||||
font-size: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
|
@ -3,7 +3,7 @@
|
|||
<div class="box w">
|
||||
<el-drawer v-model="drawer" size="80%" direction="ltr" :show-close="false" :before-close="handleDrawer"
|
||||
style="background-color: #1C3F56;" :with-header="false">
|
||||
<Drawer />
|
||||
<Drawer :drawer = "drawer" @childfn="fn"/>
|
||||
</el-drawer>
|
||||
<div class="left">
|
||||
<div class="header">
|
||||
|
@ -11,12 +11,16 @@
|
|||
<img src="@/assets/1x/1x/source5.png" alt="menu" class="menuicon" @click="openDrawer">
|
||||
</div>
|
||||
<!-- <input class="search" /> -->
|
||||
<el-autocomplete v-model="state" :fetch-suggestions="querySearch" :trigger-on-focus="false" clearable
|
||||
class="inline-input w-50" @select="handleSelect" @keyup.enter="handleSelect">
|
||||
<template #prefix>
|
||||
<img class="imgSearch123" src="@/assets/1x/1x/source2.png" alt="找不到图片" @click="handleSelect">
|
||||
</template>
|
||||
</el-autocomplete>
|
||||
<div class="searchWrap">
|
||||
<el-autocomplete v-model="state" :fetch-suggestions="querySearch" :trigger-on-focus="false"
|
||||
clearable class="inline-input w-50" @select="handleSelect" @keyup.enter="handleSelect">
|
||||
<template #prefix>
|
||||
<img class="imgSearch123" src="@/assets/1x/1x/source2.png" alt="找不到图片"
|
||||
@click="handleSelect">
|
||||
</template>
|
||||
</el-autocomplete>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="dropdown">
|
||||
<img src="@/assets/1x/source4.png" class="first " @click="handleShowCup">
|
||||
|
@ -205,7 +209,7 @@ const getHomeIpoList = async () => {
|
|||
title: companyEngFull + ";" + companyChiFull,
|
||||
status: status,
|
||||
number: stkCode,
|
||||
HKD: priceFinal.toFixed(3) ? priceFinal.toFixed(3) : priceMinMax(),
|
||||
HKD: priceFinal ? priceFinal.toFixed(3) : priceMinMax(),
|
||||
time: listingDate ? listingDate : pricingDate,
|
||||
ipoID: ipoID,
|
||||
price: priceFinal,
|
||||
|
@ -213,11 +217,11 @@ const getHomeIpoList = async () => {
|
|||
}
|
||||
function priceMinMax() {
|
||||
if (priceMin && priceMax) {
|
||||
return `${priceMin.toFixed(3)} - ${priceMax.toFixed(3)}`
|
||||
return `${priceMin?.toFixed(3)} - ${priceMax.toFixed(3)}`
|
||||
} else if (priceMin) {
|
||||
return `${priceMin.toFixed(3)} - `
|
||||
return `${priceMin?.toFixed(3)} - `
|
||||
} else if (priceMax) {
|
||||
return ` -${priceMax.toFixed(3)}`
|
||||
return ` -${priceMax?.toFixed(3)}`
|
||||
} else {
|
||||
return " - "
|
||||
}
|
||||
|
@ -482,7 +486,9 @@ const showMounth = (date: any) => {
|
|||
return arr[2] + " " + arr[3]
|
||||
}
|
||||
}
|
||||
|
||||
function fn(data:any){
|
||||
drawer.value = data
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
// @import '../../styles';
|
||||
|
@ -513,6 +519,10 @@ const showMounth = (date: any) => {
|
|||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
width: 100vw;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.box {
|
||||
|
@ -521,6 +531,11 @@ const showMounth = (date: any) => {
|
|||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
position: relative;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
width: 100vw;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.left {
|
||||
|
@ -763,11 +778,13 @@ const showMounth = (date: any) => {
|
|||
}
|
||||
|
||||
}
|
||||
:deep(.el-calendar-table){
|
||||
|
||||
:deep(.el-calendar-table) {
|
||||
width: 420px;
|
||||
transform: translateX(-20px);
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
:deep(.el-button--small) {
|
||||
border: none
|
||||
}
|
||||
|
@ -811,10 +828,12 @@ const showMounth = (date: any) => {
|
|||
text-align: center;
|
||||
font-weight: 800;
|
||||
}
|
||||
:deep(.el-calendar-table thead th ){
|
||||
padding:2px;
|
||||
|
||||
:deep(.el-calendar-table thead th) {
|
||||
padding: 2px;
|
||||
font-weight: 550px;
|
||||
}
|
||||
|
||||
:deep(.el-calendar .el-calendar-table .el-calendar-day) {
|
||||
padding: 0px;
|
||||
text-align: center;
|
||||
|
@ -862,44 +881,51 @@ const showMounth = (date: any) => {
|
|||
:deep(.is-selected) {
|
||||
color: red;
|
||||
}
|
||||
@media screen and (max-width: 768px){
|
||||
.left{
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.left {
|
||||
width: 100vw;
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.header{
|
||||
height: 60px;
|
||||
.menuicon{
|
||||
display: block ;
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.header {
|
||||
height: 60px;
|
||||
|
||||
.menuicon {
|
||||
display: block;
|
||||
margin-left: 5px;
|
||||
width: 25px;
|
||||
height: 20px;
|
||||
}
|
||||
.menu{
|
||||
|
||||
}
|
||||
|
||||
.menu {
|
||||
|
||||
img {
|
||||
width: 25px;
|
||||
height: 20px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
.dropdown1{
|
||||
display: none;
|
||||
}
|
||||
.first{
|
||||
|
||||
}
|
||||
|
||||
.dropdown1 {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.first {
|
||||
width: 24px;
|
||||
height: 28px;
|
||||
margin-top: 6px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
margin-left: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// :deep(.el-drawer__body){
|
||||
// background-color: red;
|
||||
// width: 80vw;
|
||||
|
@ -907,31 +933,46 @@ const showMounth = (date: any) => {
|
|||
// :deep(.el-overlay){
|
||||
// background-color: green;
|
||||
// }
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.header .el-input__wrapper {
|
||||
margin-top: 20px;
|
||||
margin-left: 20px;
|
||||
padding-left: 50px;
|
||||
width: 50vw;
|
||||
height: 50px;
|
||||
border-radius: 25px;
|
||||
font-size: 25px;
|
||||
border: none;
|
||||
outline: none;
|
||||
@media (min-width: 992px) {
|
||||
.header .el-input__wrapper {
|
||||
margin-top: 20px;
|
||||
margin-left: 20px;
|
||||
padding-left: 50px;
|
||||
width: 50vw;
|
||||
height: 50px;
|
||||
border-radius: 25px;
|
||||
font-size: 25px;
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
}
|
||||
|
||||
.el-input__prefix-inner {
|
||||
transform: translateX(-35px);
|
||||
}
|
||||
}
|
||||
|
||||
.el-input__prefix-inner {
|
||||
transform: translateX(-35px);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
|
||||
|
||||
|
||||
.el-input {
|
||||
margin: 10px !important;
|
||||
}
|
||||
|
||||
|
||||
.el-input__prefix-inner {
|
||||
transform: translateX(-35px);
|
||||
}
|
||||
|
||||
.header .el-input__wrapper {
|
||||
margin-top: 0;
|
||||
margin-left: 0;
|
||||
margin-top: 0 !important;
|
||||
margin-left: 0 !important;
|
||||
padding-left: 50px;
|
||||
width: 61vw;
|
||||
height: 30px;
|
||||
|
|
|
@ -66,6 +66,15 @@ import { getCurrentInstance, onUnmounted } from 'vue'
|
|||
import { ipoStore } from "@/stores/ipo"
|
||||
const store = ipoStore()
|
||||
const { proxy } = (getCurrentInstance() as any)
|
||||
let emit = defineEmits(['childfn'])
|
||||
|
||||
const props = defineProps({
|
||||
drawer:Boolean
|
||||
})
|
||||
|
||||
let drawer = props.drawer
|
||||
|
||||
console.log(props);
|
||||
|
||||
const state = ref(1)
|
||||
// const drawer = ref(true)
|
||||
|
@ -85,10 +94,12 @@ const setState = (number: number) => {
|
|||
}
|
||||
}
|
||||
const handleLang1 = () => {
|
||||
|
||||
if (proxy.$i18n.locale = 'en') {
|
||||
proxy.$i18n.locale = 'en'
|
||||
}
|
||||
store.setLocale(1)
|
||||
emit('childfn',!drawer)
|
||||
}
|
||||
const handleLang2 = () => {
|
||||
if (proxy.$i18n.locale = 'zhCt') {
|
||||
|
@ -97,16 +108,16 @@ const handleLang2 = () => {
|
|||
|
||||
}
|
||||
store.setLocale(2)
|
||||
emit('childfn',!drawer)
|
||||
}
|
||||
const handleLang3 = () => {
|
||||
if (proxy.$i18n.locale = 'zhCn') {
|
||||
proxy.$i18n.locale = 'zhCn'
|
||||
}
|
||||
store.setLocale(3)
|
||||
emit('childfn',!drawer)
|
||||
}
|
||||
// const openDrawer = () => {
|
||||
// drawer.value = false;
|
||||
// }
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
@ -55,17 +55,17 @@ export default defineConfig((mode: ConfigEnv) => {
|
|||
},
|
||||
},
|
||||
server: {
|
||||
host:"0.0.0.0",
|
||||
port: +env.VITE_PORT,
|
||||
open: env.VITE_OPEN === "true",
|
||||
// 配置代理服务器
|
||||
proxy: {
|
||||
"/api": {
|
||||
target: "http://192.168.2.6:8080",
|
||||
target: "http://192.168.2.10:8080",
|
||||
changeOrigin: true,
|
||||
rewrite: (path) => path.replace(/^\/api/, ""),
|
||||
},
|
||||
},
|
||||
host: '0.0.0.0'
|
||||
},
|
||||
// pages:{
|
||||
// move: {
|
||||
|
|
Loading…
Reference in New Issue