筛选完成
This commit is contained in:
zzy
parent
8b6c10f1d5
commit
00bb0d8346
|
|
@ -10,7 +10,8 @@ enum Api {
|
|||
offeringsUrl="/api/ipo/refdata/offering",
|
||||
EventData="/api/ipos/listingData",
|
||||
TypeofList="/api/ipo/refdata/typeOfListing",
|
||||
searchUrl="/api/ipo/refdata/search"
|
||||
searchUrl="/api/ipo/refdata/search",
|
||||
selectUrl="/api/ipo/refdata/filter"
|
||||
}
|
||||
//获取ipo详情页的数据
|
||||
export const getIpo = (ipoID:string) => {
|
||||
|
|
@ -36,4 +37,45 @@ export const getTypeofListing = (ipoID:string) => {
|
|||
export const getSearchListing = (keyword:string) => {
|
||||
return request.get<any, null>(Api.searchUrl+`?keyword=${keyword}`);
|
||||
};
|
||||
type selectObj={
|
||||
status?:string|string[]
|
||||
tradeCurrency?:string|string[]
|
||||
offerType?:string|string[]
|
||||
listSecurities?:string|string[]
|
||||
IPOs?:string|string[]
|
||||
listPlatform?:string|string[]
|
||||
|
||||
}
|
||||
// export const getSelectList = (body:selectObj) => {
|
||||
// // return request.get<any, null>(Api.searchUrl,{body});
|
||||
// const {status,tradeCurrency,offerType,listSecurities,IPOs,listPlatform}=body;
|
||||
// var requestData='?'
|
||||
// if(status){
|
||||
// requestData+=`status=${status}&`
|
||||
// }
|
||||
// if(tradeCurrency){
|
||||
// requestData+=`tradeCurrency=${status}&`
|
||||
// }
|
||||
// if(offerType){
|
||||
// requestData+=`offerType=${offerType}&`
|
||||
// }
|
||||
// if(listSecurities){
|
||||
// requestData+=`listSecurities=${listSecurities}&`
|
||||
// }
|
||||
// if(IPOs){
|
||||
// requestData+=`IPOs=${IPOs}&`
|
||||
// }
|
||||
// if(listPlatform){
|
||||
// requestData+=`listPlatform=${listPlatform}&`
|
||||
// }
|
||||
// requestData=requestData.substring(0, requestData.length - 1);
|
||||
|
||||
// return request.get<any, null>(Api.searchUrl+requestData);
|
||||
// };
|
||||
|
||||
export const getSelectList = (body:selectObj) => {
|
||||
// const {Status}=body;
|
||||
const status=body.status;
|
||||
// var obj=JSON.stringify({status})
|
||||
return request.post<any, null>(Api.selectUrl,body);
|
||||
};
|
||||
|
|
@ -30,7 +30,10 @@ export default {
|
|||
ListingType:'Listing Type',
|
||||
APPLY:'Apply',
|
||||
Cancel:'Cancel'
|
||||
}
|
||||
},
|
||||
HongKongDollar:'Hong Kong Dollar',
|
||||
ChineseYuan:'Chinese Yuan',
|
||||
UnitedStatesDollar:'United States Dollar'
|
||||
},
|
||||
dashboard:{
|
||||
Home:'Home',
|
||||
|
|
|
|||
|
|
@ -30,7 +30,10 @@ export default {
|
|||
ListingType:'上市类型',
|
||||
APPLY:'提交',
|
||||
Cancel:'取消'
|
||||
}
|
||||
},
|
||||
HongKongDollar:'港元',
|
||||
ChineseYuan:'人民币',
|
||||
UnitedStatesDollar:'美元'
|
||||
},
|
||||
dashboard:{
|
||||
Home:'主页',
|
||||
|
|
|
|||
|
|
@ -30,7 +30,10 @@ export default {
|
|||
ListingType:'上市類型',
|
||||
APPLY:'提交',
|
||||
Cancel:'取消'
|
||||
}
|
||||
},
|
||||
HongKongDollar:'港元',
|
||||
ChineseYuan:'人民幣',
|
||||
UnitedStatesDollar:'美元'
|
||||
},
|
||||
dashboard:{
|
||||
Home:'主頁',
|
||||
|
|
|
|||
|
|
@ -28,7 +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.config.errorHandler = (msg, instance, trace) => {}//错误捕获，不报给浏览器
|
||||
app
|
||||
// .use(pinia)
|
||||
.use(router)
|
||||
|
|
|
|||
|
|
@ -1,79 +1,87 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="title" v-if="isImage">
|
||||
<img v-lazy="props.src" />
|
||||
</div>
|
||||
<div class="title2" v-else>
|
||||
{{props.number}}
|
||||
</div>
|
||||
<div>
|
||||
<div class="title" v-if="isImage">
|
||||
<img v-lazy="props.src" />
|
||||
</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')
|
||||
}
|
||||
|
||||
<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,onUpdated} 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')
|
||||
}
|
||||
|
||||
}
|
||||
onUpdated(()=>{
|
||||
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>
|
||||
checkImgExists(props.src)
|
||||
},1000)
|
||||
})
|
||||
onMounted(()=>{
|
||||
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>
|
||||
|
|
@ -44,7 +44,7 @@ export default {
|
|||
</script>
|
||||
<script lang="ts" setup>
|
||||
import { size } from 'lodash';
|
||||
import { ref, onMounted, onUpdated } from 'vue'
|
||||
import { ref, onMounted, onUpdated,watch } from 'vue'
|
||||
import { ipoStore } from "@/stores/ipo"
|
||||
import i18n from '@/locales'
|
||||
import { getCurrentInstance } from 'vue'
|
||||
|
|
@ -120,8 +120,9 @@ const code22 = ref('')
|
|||
|
||||
// }
|
||||
// })
|
||||
onMounted(() => {
|
||||
var obj = {
|
||||
watch(props,(newValue:any, oldValue:any)=>{
|
||||
console.log('修改了data',newValue,oldValue);
|
||||
var obj = {
|
||||
25: proxy.$t('home.DealInitiated'),
|
||||
30: proxy.$t('home.PublicOfferClosed'),
|
||||
35: proxy.$t('home.ApplicationValidated'),
|
||||
|
|
@ -159,8 +160,9 @@ onMounted(() => {
|
|||
): key is keyof typeof object {
|
||||
return key in object;
|
||||
}
|
||||
|
||||
},{deep:true})
|
||||
|
||||
})
|
||||
|
||||
const cardDetail = (e: any) => {
|
||||
e.stopPropagation();
|
||||
|
|
|
|||
|
|
@ -6,23 +6,24 @@
|
|||
<div class="word" @click="checkAll(1)">
|
||||
{{ $t(i18n.global.t('home.title.All')) }}
|
||||
<div class="check">
|
||||
<el-icon v-if="checkedAll==1">
|
||||
<Check></Check>
|
||||
</el-icon>
|
||||
<el-icon v-if="checkedAll == 1">
|
||||
<Check></Check>
|
||||
</el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="word" @click="checkAll(2)">{{ $t(i18n.global.t('home.title.None')) }}
|
||||
<div class="word" @click="checkAll(2)">{{ $t(i18n.global.t('home.title.None')) }}
|
||||
<div class="check">
|
||||
<el-icon v-if="checkedAll==2">
|
||||
<Check></Check>
|
||||
</el-icon>
|
||||
<el-icon v-if="checkedAll == 2">
|
||||
<Check></Check>
|
||||
</el-icon>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</li>
|
||||
<div class="title">{{ $t(i18n.global.t('home.title.IPOStatus')) }}</div>
|
||||
<li>
|
||||
<div class="word" v-for="item in obj.ipoStatus" :key="item.key" @click="ipoStatusSlect(item.key)">
|
||||
<div class="word" v-for="item in obj.ipoStatus" :key="item.key"
|
||||
@click="checkOne(item.key, 'ipoStatus')">
|
||||
<div class="check">
|
||||
<el-icon v-if="item.isSelcted">
|
||||
<Check />
|
||||
|
|
@ -34,7 +35,7 @@
|
|||
<div class="title">{{ $t(i18n.global.t('home.title.TradingCurrency')) }}</div>
|
||||
<li>
|
||||
<div class="word" v-for="item in obj.tradingCurrency" :key="item.key"
|
||||
@click="tradingCurrencySlect(item.key)">
|
||||
@click="checkOne(item.key, 'tradingCurrency')">
|
||||
<div class="check">
|
||||
<el-icon v-if="item.isSelcted">
|
||||
<Check />
|
||||
|
|
@ -45,7 +46,8 @@
|
|||
</li>
|
||||
<div class="title">{{ $t(i18n.global.t('home.title.OfferingType')) }}</div>
|
||||
<li>
|
||||
<div class="word" v-for="item in obj.offeringType" :key = "item.key" @click="offeringType(item.key)">
|
||||
<div class="word" v-for="item in obj.offeringType" :key="item.key"
|
||||
@click="checkOne(item.key, 'offeringType')">
|
||||
<div class="check">
|
||||
<el-icon v-if="item.isSelcted">
|
||||
<Check />
|
||||
|
|
@ -56,7 +58,8 @@
|
|||
</li>
|
||||
<div class="title">{{ $t(i18n.global.t('home.title.SecuritiestobeListed')) }}</div>
|
||||
<li>
|
||||
<div class="word" v-for="item in obj.SecuritiestobeListed" :key = "item.key" @click="SecuritiestobeListed(item.key)">
|
||||
<div class="word" v-for="item in obj.SecuritiestobeListed" :key="item.key"
|
||||
@click="checkOne(item.key, 'SecuritiestobeListed')">
|
||||
<div class="check">
|
||||
<el-icon v-if="item.isSelcted">
|
||||
<Check />
|
||||
|
|
@ -65,9 +68,10 @@
|
|||
<span>{{ item.value }}</span>
|
||||
</div>
|
||||
</li>
|
||||
<div class="title">{{ $t(i18n.global.t('home.title.ListingPlatform')) }}</div>
|
||||
<!-- <div class="title">{{ $t(i18n.global.t('home.title.ListingPlatform')) }}</div>
|
||||
<li>
|
||||
<div class="word" v-for="item in obj.ListingPlatform" :key = "item.key" @click="ListingPlatform(item.key)">
|
||||
<div class="word" v-for="item in obj.ListingPlatform" :key="item.key"
|
||||
@click="checkOne(item.key, 'ListingPlatform')">
|
||||
<div class="check">
|
||||
<el-icon v-if="item.isSelcted">
|
||||
<Check />
|
||||
|
|
@ -75,22 +79,12 @@
|
|||
</div>
|
||||
<span>{{ item.value }}</span>
|
||||
</div>
|
||||
</li>
|
||||
<div class="title">{{ $t(i18n.global.t('home.title.ListingType')) }}</div>
|
||||
<li>
|
||||
<div class="word" v-for="item in obj.ListingType" :key = "item.key" @click="ListingType(item.key)">
|
||||
<div class="check">
|
||||
<el-icon v-if="item.isSelcted">
|
||||
<Check />
|
||||
</el-icon>
|
||||
</div>
|
||||
<span>{{ item.value }}</span>
|
||||
</div>
|
||||
</li>
|
||||
</li> -->
|
||||
|
||||
</div>
|
||||
<div class="footer">
|
||||
<button @click="confirm">{{ $t(i18n.global.t('home.title.APPLY')) }}</button>
|
||||
<button @click="confirm">{{ $t(i18n.global.t('home.title.Cancel')) }}</button>
|
||||
<button @click="Cancel">{{ $t(i18n.global.t('home.title.Cancel')) }}</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -105,39 +99,66 @@ export default {
|
|||
</script>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, defineExpose, reactive } from 'vue';
|
||||
import { ref, defineExpose, reactive ,inject} from 'vue';
|
||||
import i18n from '@/locales'
|
||||
import { getCurrentInstance } from 'vue'
|
||||
type keyType='ipoStatus'|'tradingCurrency'|'offeringType'|'SecuritiestobeListed'|'ListingPlatform'|'ListingType'
|
||||
import { getSelectList } from "@/api/reqIpo/ipo"
|
||||
type keyType = 'ipoStatus' | 'tradingCurrency' | 'offeringType' | 'SecuritiestobeListed' | 'ListingPlatform'
|
||||
type requestType = 'status' | 'trade_currency' | 'offer_type' | 'list_securities' | 'list_platform'
|
||||
const { proxy } = (getCurrentInstance() as any)
|
||||
const showSelect = ref(false)
|
||||
const checkedAll=ref(0)
|
||||
const confirm = () => {
|
||||
const checkedAll = ref(0)
|
||||
const selectCards=inject('selectCards') as Function
|
||||
const confirm = async () => {
|
||||
var keyArry = ['status', 'trade_currency', 'offer_type', 'list_securities', 'list_platform',]
|
||||
var reqeustObj = {
|
||||
status: [] as string[],
|
||||
trade_currency: [] as string[],
|
||||
offer_type: [] as string[],
|
||||
list_securities: [] as string[],
|
||||
list_platform: [] as string[],
|
||||
|
||||
}
|
||||
Object.keys(obj).forEach((item: string, index: number) => {
|
||||
obj[item as keyType].forEach((element: any) => {
|
||||
if (element.isSelcted) {
|
||||
reqeustObj[keyArry[index] as requestType].push(element.key as string)
|
||||
}
|
||||
})
|
||||
})
|
||||
const result = await getSelectList(reqeustObj)
|
||||
console.log('result',result);
|
||||
selectCards(result);
|
||||
showSelect.value=false
|
||||
|
||||
}
|
||||
const Cancel = () => {
|
||||
showSelect.value = false;
|
||||
|
||||
}
|
||||
const preVant = (e: any) => {
|
||||
e.stopPropagation();
|
||||
}
|
||||
const obj = reactive({
|
||||
ipoStatus: [{
|
||||
key: 25,
|
||||
key: "25",
|
||||
value: proxy.$t('home.DealInitiated'),
|
||||
isSelcted: false
|
||||
},
|
||||
{
|
||||
key: 30,
|
||||
key: "30",
|
||||
value: proxy.$t('home.PublicOfferClosed'),
|
||||
isSelcted: true
|
||||
}, {
|
||||
key: 35,
|
||||
key: "35",
|
||||
value: proxy.$t('home.ApplicationValidated'),
|
||||
isSelcted: true
|
||||
}, {
|
||||
key: 45,
|
||||
key: "45",
|
||||
value: proxy.$t('home.AllotmentConfirmed'),
|
||||
isSelcted: false
|
||||
}, {
|
||||
key: 50,
|
||||
key: "50",
|
||||
value: proxy.$t('home.MoneySettlement'),
|
||||
isSelcted: false
|
||||
}, {
|
||||
|
|
@ -145,225 +166,185 @@ const obj = reactive({
|
|||
value: proxy.$t('home.AllocationConfirmed'),
|
||||
isSelcted: false
|
||||
}, {
|
||||
key: 60,
|
||||
key: "60",
|
||||
value: proxy.$t('home.placingApproved'),
|
||||
isSelcted: false
|
||||
}, {
|
||||
key: 65,
|
||||
key: "65",
|
||||
value: proxy.$t('home.AllotmentResultsApproved'),
|
||||
isSelcted: false
|
||||
}, {
|
||||
key: 70,
|
||||
key: "70",
|
||||
value: proxy.$t('home.TradingStarted'),
|
||||
isSelcted: false
|
||||
}, {
|
||||
key: 80,
|
||||
key: "80",
|
||||
value: proxy.$t('home.Suspended'),
|
||||
isSelcted: false
|
||||
}, {
|
||||
key: 90,
|
||||
key: "90",
|
||||
value: proxy.$t('home.Cancelled'),
|
||||
isSelcted: false
|
||||
}],
|
||||
tradingCurrency: [
|
||||
{
|
||||
key: 'HKD',
|
||||
value: 'Hong Kong Dollar',
|
||||
value: proxy.$t('home.HongKongDollar'),
|
||||
isSelcted: false
|
||||
},
|
||||
{
|
||||
key: 'CNY',
|
||||
value: 'Chinese Yuan',
|
||||
value: proxy.$t('home.ChineseYuan'),
|
||||
isSelcted: true
|
||||
},
|
||||
{
|
||||
key: 'USD',
|
||||
value: 'United States Dollar',
|
||||
value: proxy.$t('home.UnitedStatesDollar'),
|
||||
isSelcted: false
|
||||
}
|
||||
],
|
||||
offeringType:[{
|
||||
key:'1',
|
||||
value:proxy.$t('ipo.TypeofListing.Globalofferplacingandpublicoffer'),
|
||||
offeringType: [{
|
||||
key: '1',
|
||||
value: proxy.$t('ipo.TypeofListing.Globalofferplacingandpublicoffer'),
|
||||
isSelcted: false
|
||||
},{
|
||||
key:'2',
|
||||
value:proxy.$t('ipo.TypeofListing.Byplacingonly'),
|
||||
}, {
|
||||
key: '2',
|
||||
value: proxy.$t('ipo.TypeofListing.Byplacingonly'),
|
||||
isSelcted: false
|
||||
},{
|
||||
key:'3',
|
||||
value:proxy.$t('ipo.TypeofListing.Bypublicofferonly'),
|
||||
}, {
|
||||
key: '3',
|
||||
value: proxy.$t('ipo.TypeofListing.Bypublicofferonly'),
|
||||
isSelcted: false
|
||||
},{
|
||||
key:'4',
|
||||
value:proxy.$t('ipo.TypeofListing.Byintroduction'),
|
||||
}, {
|
||||
key: '4',
|
||||
value: proxy.$t('ipo.TypeofListing.Byintroduction'),
|
||||
isSelcted: false
|
||||
},
|
||||
{
|
||||
key:'5',
|
||||
value:proxy.$t('ipo.TypeofListing.TransferfromGEM'),
|
||||
key: '5',
|
||||
value: proxy.$t('ipo.TypeofListing.TransferfromGEM'),
|
||||
isSelcted: true
|
||||
}
|
||||
],
|
||||
SecuritiestobeListed:[{
|
||||
key:'1',
|
||||
value:proxy.$t('ipo.TypeofListing.Ordinaryshares'),
|
||||
isSelcted: false
|
||||
},{
|
||||
key:'2',
|
||||
value:proxy.$t('ipo.TypeofListing.OrdinarysharesHshares'),
|
||||
],
|
||||
SecuritiestobeListed: [{
|
||||
key: '1',
|
||||
value: proxy.$t('ipo.TypeofListing.Ordinaryshares'),
|
||||
isSelcted: false
|
||||
},{
|
||||
key:'3',
|
||||
value:proxy.$t('ipo.TypeofListing.OrdinarysharesconversionfromBtoHshares'),
|
||||
}, {
|
||||
key: '2',
|
||||
value: proxy.$t('ipo.TypeofListing.OrdinarysharesHshares'),
|
||||
isSelcted: false
|
||||
},{
|
||||
key:'4',
|
||||
value:proxy.$t('ipo.TypeofListing.Preferenceshares'),
|
||||
}, {
|
||||
key: '3',
|
||||
value: proxy.$t('ipo.TypeofListing.OrdinarysharesconversionfromBtoHshares'),
|
||||
isSelcted: false
|
||||
}, {
|
||||
key: '4',
|
||||
value: proxy.$t('ipo.TypeofListing.Preferenceshares'),
|
||||
isSelcted: false
|
||||
},
|
||||
{
|
||||
key:'5',
|
||||
value:proxy.$t('ipo.TypeofListing.RealEstateInvestmentTrust'),
|
||||
key: '5',
|
||||
value: proxy.$t('ipo.TypeofListing.RealEstateInvestmentTrust'),
|
||||
isSelcted: true
|
||||
},
|
||||
{
|
||||
key:'6',
|
||||
value:proxy.$t('ipo.TypeofListing.ExchangeTradedProduct'),
|
||||
key: '6',
|
||||
value: proxy.$t('ipo.TypeofListing.ExchangeTradedProduct'),
|
||||
isSelcted: true
|
||||
},
|
||||
{
|
||||
key:'7',
|
||||
value:proxy.$t('ipo.TypeofListing.DepositaryReceipts'),
|
||||
key: '7',
|
||||
value: proxy.$t('ipo.TypeofListing.DepositaryReceipts'),
|
||||
isSelcted: true
|
||||
},
|
||||
{
|
||||
key:'8',
|
||||
value:proxy.$t('ipo.TypeofListing.ShareStapledUnits'),
|
||||
key: '8',
|
||||
value: proxy.$t('ipo.TypeofListing.ShareStapledUnits'),
|
||||
isSelcted: true
|
||||
},
|
||||
{
|
||||
key:'99',
|
||||
value:proxy.$t('ipo.TypeofListing.Other'),
|
||||
key: '99',
|
||||
value: proxy.$t('ipo.TypeofListing.Other'),
|
||||
isSelcted: false
|
||||
}
|
||||
],
|
||||
ListingPlatform:[{
|
||||
key:'1',
|
||||
value:proxy.$t('home.Mainboard'),
|
||||
isSelcted: false
|
||||
},{
|
||||
key:'2',
|
||||
value:proxy.$t('home.GEM'),
|
||||
isSelcted: false
|
||||
}],
|
||||
ListingType:[{
|
||||
key:'1',
|
||||
value:proxy.$t('ipo.TypeofListing.Ordinaryshares'),
|
||||
isSelcted: false
|
||||
},{
|
||||
key:'2',
|
||||
value:proxy.$t('ipo.TypeofListing.OrdinarysharesHshares'),
|
||||
],
|
||||
ListingPlatform: [{
|
||||
key: '1',
|
||||
value: proxy.$t('home.Mainboard'),
|
||||
isSelcted: false
|
||||
},{
|
||||
key:'3',
|
||||
value:proxy.$t('ipo.TypeofListing.OrdinarysharesconversionfromBtoHshares'),
|
||||
}, {
|
||||
key: '2',
|
||||
value: proxy.$t('home.GEM'),
|
||||
isSelcted: false
|
||||
},{
|
||||
key:'4',
|
||||
value:proxy.$t('ipo.TypeofListing.Preferenceshares'),
|
||||
isSelcted: false
|
||||
},
|
||||
{
|
||||
key:'5',
|
||||
value:proxy.$t('ipo.TypeofListing.RealEstateInvestmentTrust'),
|
||||
isSelcted: true
|
||||
},
|
||||
{
|
||||
key:'6',
|
||||
value:proxy.$t('ipo.TypeofListing.ExchangeTradedProduct'),
|
||||
isSelcted: true
|
||||
},
|
||||
{
|
||||
key:'7',
|
||||
value:proxy.$t('ipo.TypeofListing.DepositaryReceipts'),
|
||||
isSelcted: true
|
||||
},
|
||||
{
|
||||
key:'8',
|
||||
value:proxy.$t('ipo.TypeofListing.ShareStapledUnits'),
|
||||
isSelcted: true
|
||||
},
|
||||
{
|
||||
key:'99',
|
||||
value:proxy.$t('ipo.TypeofListing.Other'),
|
||||
isSelcted: false
|
||||
}
|
||||
]
|
||||
}],
|
||||
// ListingType: [{
|
||||
// key: '1',
|
||||
// value: proxy.$t('ipo.TypeofListing.Ordinaryshares'),
|
||||
// isSelcted: false
|
||||
// }, {
|
||||
// key: '2',
|
||||
// value: proxy.$t('ipo.TypeofListing.OrdinarysharesHshares'),
|
||||
// isSelcted: false
|
||||
// }, {
|
||||
// key: '3',
|
||||
// value: proxy.$t('ipo.TypeofListing.OrdinarysharesconversionfromBtoHshares'),
|
||||
// isSelcted: false
|
||||
// }, {
|
||||
// key: '4',
|
||||
// value: proxy.$t('ipo.TypeofListing.Preferenceshares'),
|
||||
// isSelcted: false
|
||||
// },
|
||||
// {
|
||||
// key: '5',
|
||||
// value: proxy.$t('ipo.TypeofListing.RealEstateInvestmentTrust'),
|
||||
// isSelcted: true
|
||||
// },
|
||||
// {
|
||||
// key: '6',
|
||||
// value: proxy.$t('ipo.TypeofListing.ExchangeTradedProduct'),
|
||||
// isSelcted: true
|
||||
// },
|
||||
// {
|
||||
// key: '7',
|
||||
// value: proxy.$t('ipo.TypeofListing.DepositaryReceipts'),
|
||||
// isSelcted: true
|
||||
// },
|
||||
// {
|
||||
// key: '8',
|
||||
// value: proxy.$t('ipo.TypeofListing.ShareStapledUnits'),
|
||||
// isSelcted: true
|
||||
// },
|
||||
// {
|
||||
// key: '99',
|
||||
// value: proxy.$t('ipo.TypeofListing.Other'),
|
||||
// isSelcted: false
|
||||
// }
|
||||
// ]
|
||||
})
|
||||
const ipoStatusSlect = (key: number) => {
|
||||
obj.ipoStatus = obj.ipoStatus.map((item: any) => {
|
||||
const checkOne = (key: number | string, objKey: keyType) => {
|
||||
obj[objKey] = obj[objKey].map((item: any) => {
|
||||
if (item.key == key) {
|
||||
return { ...item, isSelcted: !item.isSelcted }
|
||||
}
|
||||
return item
|
||||
})
|
||||
}
|
||||
const tradingCurrencySlect = (key: string) => {
|
||||
obj.tradingCurrency = obj.tradingCurrency.map((item: any) => {
|
||||
if (item.key == key) {
|
||||
return { ...item, isSelcted: !item.isSelcted }
|
||||
}
|
||||
return item
|
||||
})
|
||||
}
|
||||
const offeringType = (key: string) => {
|
||||
obj.offeringType = obj.offeringType.map((item: any) => {
|
||||
if (item.key == key) {
|
||||
return { ...item, isSelcted: !item.isSelcted }
|
||||
}
|
||||
return item
|
||||
})
|
||||
}
|
||||
const SecuritiestobeListed = (key: string) => {
|
||||
obj.SecuritiestobeListed = obj.SecuritiestobeListed.map((item: any) => {
|
||||
if (item.key == key) {
|
||||
return { ...item, isSelcted: !item.isSelcted }
|
||||
}
|
||||
return item
|
||||
})
|
||||
}
|
||||
const ListingPlatform = (key: string) => {
|
||||
obj.ListingPlatform = obj.ListingPlatform.map((item: any) => {
|
||||
if (item.key == key) {
|
||||
return { ...item, isSelcted: !item.isSelcted }
|
||||
}
|
||||
return item
|
||||
})
|
||||
}
|
||||
const ListingType = (key: string) => {
|
||||
obj.ListingType = obj.ListingType.map((item: any) => {
|
||||
if (item.key == key) {
|
||||
return { ...item, isSelcted: !item.isSelcted }
|
||||
}
|
||||
return item
|
||||
})
|
||||
}
|
||||
const checkAll = (number:number)=>{
|
||||
if(checkedAll.value&&checkedAll.value==number){
|
||||
checkedAll.value=0;
|
||||
}else{
|
||||
checkedAll.value=number;
|
||||
selectAll(number as 1|2)
|
||||
const checkAll = (number: number) => {
|
||||
if (checkedAll.value && checkedAll.value == number) {
|
||||
checkedAll.value = 0;
|
||||
} else {
|
||||
checkedAll.value = number;
|
||||
selectAll(number as 1 | 2)
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
function selectAll(all:1|2){
|
||||
// obj['ipoStatus']
|
||||
var boolean=all==1?true:false;
|
||||
Object.keys(obj).forEach((item:string)=>{
|
||||
obj[item as keyType]=obj[item as keyType].map(element=>{
|
||||
return {...element,isSelcted:boolean} as any;
|
||||
function selectAll(all: 1 | 2) {
|
||||
var boolean1 = all == 1 ? true : false;
|
||||
Object.keys(obj).forEach((item: string) => {
|
||||
obj[item as keyType] = obj[item as keyType].map(element => {
|
||||
return { ...element, isSelcted: boolean1 } as any;
|
||||
})
|
||||
})
|
||||
}
|
||||
|
|
@ -383,7 +364,7 @@ defineExpose({
|
|||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
z-index: 10;
|
||||
|
||||
|
||||
.box {
|
||||
box-sizing: border-box;
|
||||
padding: 10px 20px 20px 20px;
|
||||
|
|
|
|||
|
|
@ -1,79 +1,87 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="title" v-if="isImage">
|
||||
<img v-lazy="props.src" />
|
||||
</div>
|
||||
<div class="title2" v-else>
|
||||
{{props.number}}
|
||||
</div>
|
||||
<div>
|
||||
<div class="title" v-if="isImage">
|
||||
<img v-lazy="props.src" />
|
||||
</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')
|
||||
}
|
||||
|
||||
<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,onUpdated} 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')
|
||||
}
|
||||
|
||||
}
|
||||
onUpdated(()=>{
|
||||
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>
|
||||
checkImgExists(props.src)
|
||||
},1000)
|
||||
})
|
||||
onMounted(()=>{
|
||||
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>
|
||||
|
|
@ -12,8 +12,11 @@
|
|||
</div>
|
||||
<!-- <input class="search" /> -->
|
||||
<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">
|
||||
clearable class="inline-input w-50" @select="handleSelect" @keyup.enter="handleSelect"
|
||||
:enterkeyhint="'search'"
|
||||
>
|
||||
<template #prefix>
|
||||
<img class="imgSearch123" src="@/assets/1x/1x/source2.png" alt="找不到图片"
|
||||
@click="handleSelect">
|
||||
|
|
@ -88,9 +91,9 @@ import { getHomeIpo, getIpo } from '@/api/reqIpo/ipo'
|
|||
import moment from "moment"
|
||||
import { useRouter } from 'vue-router';
|
||||
import i18n from '@/locales'
|
||||
import { getCurrentInstance } from 'vue'
|
||||
import { getCurrentInstance ,provide} from 'vue'
|
||||
import Event from './components/Event.vue';
|
||||
import { getEventData, getSearchListing } from "@/api/reqIpo/ipo";
|
||||
import { getEventData, getSearchListing,getSelectList } from "@/api/reqIpo/ipo";
|
||||
import { getDataFromId } from "@/api/mock/home"
|
||||
import { ElMessage } from 'element-plus'
|
||||
import SearchCup from "./components/SearchCup.vue";
|
||||
|
|
@ -99,6 +102,63 @@ import Select from "./components/Select.vue";
|
|||
const selectR = ref();
|
||||
const dayValue = ref(new Date())
|
||||
const drawer = ref(false)
|
||||
|
||||
const selectCards=async (res:any)=>{
|
||||
async function demo() {
|
||||
return new Promise(async (resolve, reject) => {
|
||||
try {
|
||||
if (!(res as any).data.length) {
|
||||
ElMessage.warning('No relevant select data')
|
||||
throw ("222")
|
||||
}
|
||||
const data = (res as any).data.map((item: any) => {
|
||||
|
||||
let { stkCode, dateTime, status, ipoID, companyEngFull, companyChiFull, priceFinal, logoLink, priceMin, priceMax, listingDate, pricingDate } = item;
|
||||
console.log('status',status);
|
||||
return {
|
||||
logolinks: logoLink?logoLink:"",
|
||||
title: companyEngFull + ";" + companyChiFull,
|
||||
status: status,
|
||||
number: stkCode,
|
||||
HKD: priceFinal ? priceFinal.toFixed(3) : priceMinMax(),
|
||||
time: listingDate ? listingDate : pricingDate,
|
||||
ipoID: ipoID,
|
||||
price: priceFinal,
|
||||
listingDate: listingDate
|
||||
}
|
||||
function priceMinMax() {
|
||||
if (priceMin && priceMax) {
|
||||
return `${priceMin.toFixed(3)} - ${priceMax.toFixed(3)}`
|
||||
} else if (priceMin) {
|
||||
return `${priceMin.toFixed(3)} - `
|
||||
} else if (priceMax) {
|
||||
return ` -${priceMax.toFixed(3)}`
|
||||
} else {
|
||||
return " - "
|
||||
}
|
||||
}
|
||||
})
|
||||
resolve(data)
|
||||
} catch (error) {
|
||||
reject()
|
||||
}
|
||||
|
||||
}
|
||||
)
|
||||
}
|
||||
const result = await demo();
|
||||
(result as objType[]).sort((a: any, b: any) => {
|
||||
const preTime = new Date(a.number).getTime();
|
||||
const nextTime = new Date(b.number).getTime();
|
||||
if (preTime == nextTime) {
|
||||
return Number(a.number) - Number(b.number);
|
||||
} else {
|
||||
return preTime - nextTime;
|
||||
}
|
||||
})
|
||||
logos.value = result as objType[]
|
||||
}
|
||||
provide('selectCards',selectCards);
|
||||
const handleDrawer = (done: () => void) => {
|
||||
done();
|
||||
}
|
||||
|
|
@ -252,6 +312,7 @@ onMounted(async () => {
|
|||
const getSearchIpoList = async (keyword: string) => {
|
||||
async function demo() {
|
||||
return new Promise(async (resolve, reject) => {
|
||||
|
||||
try {
|
||||
const res = await getSearchListing(keyword)
|
||||
if (!(res as any).data.length) {
|
||||
|
|
@ -323,46 +384,15 @@ interface objType {
|
|||
|
||||
}
|
||||
const logos = ref<objType[]>([
|
||||
{
|
||||
title: "bestCompany",
|
||||
number: "09985",
|
||||
HKD: "HKD 148.000",
|
||||
price: "final offer Price",
|
||||
time: "2023-03-31 09:00",
|
||||
trading: "Commencement of trading date"
|
||||
},
|
||||
{
|
||||
title: "bestCompany",
|
||||
number: "09985",
|
||||
HKD: "HKD 30.000-40.000",
|
||||
price: "offer Price Range",
|
||||
time: "2022-12-01 12:00:00",
|
||||
trading: "Expected Price Determination Date"
|
||||
},
|
||||
{
|
||||
title: "bestCompany",
|
||||
number: "09985",
|
||||
HKD: "HKD 30.000-40.000",
|
||||
price: "offer Price Range",
|
||||
time: "2022-12-01 12:00:00",
|
||||
trading: "Expected Price Determination Date"
|
||||
},
|
||||
{
|
||||
title: "bestCompany",
|
||||
number: "09985",
|
||||
HKD: "HKD 30.000-40.000",
|
||||
price: "offer Price Range",
|
||||
time: "2022-12-01 12:00:00",
|
||||
trading: "Expected Price Determination Date"
|
||||
},
|
||||
{
|
||||
title: "bestCompany",
|
||||
number: "09985",
|
||||
HKD: "HKD 30.000-40.000",
|
||||
price: "offer Price Range",
|
||||
time: "2022-12-01 12:00:00",
|
||||
trading: "Expected Price Determination Date"
|
||||
}
|
||||
// {
|
||||
// title: "bestCompany",
|
||||
// number: "09985",
|
||||
// HKD: "HKD 148.000",
|
||||
// price: "final offer Price",
|
||||
// time: "2023-03-31 09:00",
|
||||
// trading: "Commencement of trading date"
|
||||
// },
|
||||
|
||||
])
|
||||
|
||||
const jsonData = {
|
||||
|
|
@ -514,6 +544,7 @@ drawer.value = data
|
|||
// height: 20rem;
|
||||
// }
|
||||
// }
|
||||
|
||||
.login2 {
|
||||
background-image: url("@/assets/1x/beijingtu.png");
|
||||
background-repeat: no-repeat;
|
||||
|
|
@ -757,7 +788,7 @@ drawer.value = data
|
|||
width: 420px;
|
||||
background-color: #ffffff;
|
||||
height: 500px;
|
||||
margin-top: 150px;
|
||||
margin-top: 130px;
|
||||
// margin-left: 20px;
|
||||
// text-align: center;
|
||||
// line-height: 500px;
|
||||
|
|
@ -791,7 +822,8 @@ drawer.value = data
|
|||
|
||||
:deep(.el-calendar__body) {
|
||||
background-color: #e8ebee;
|
||||
height: 385px;
|
||||
height:fit-content;
|
||||
padding: 12px 20px 0px;
|
||||
}
|
||||
|
||||
:deep(.el-calendar) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue