-
-
-
- ![]()
-
-
-
-
- ![]()
-
-
-
+
+
![]()
@@ -26,46 +16,46 @@
export default {
name: "LevelStar",
props: ["quality"],
- created(){
- console.log(this.quality,'this.level');
+ created() {
+
+ if (this.quality > 0 && this.quality <= 5) {
+ for (var i = 1; i <= this.quality; i++) {
+ this.starList.push(this.starType[0]);
+ }
+ } else if (this.quality > 5 && this.quality <= 10) {
+ for (var i = 1; i <= this.quality-5; i++) {
+ this.starList.push(this.starType[1]);
+ }
+ } else {
+ for (var i = 1; i <= this.quality-10; i++) {
+ this.starList.push(this.starType[2]);
+ }
+ }
},
- computed: {
- firstList() {
- console.log(this.firstOrder.splice(0, 5 - this.quality),'this.firstOrder.splice(0, 4 - this.level)');
- return this.firstOrder.splice(0, 5 - this.quality);
- },
- secondList() {
- console.log(this.secondOrder.splice(0, 4 - (this.quality -5)),'this.firstOrder.splice(0, 4 - this.level)');
- return this.secondOrder.splice(0, 5 - (this.quality -5));
- },
- thirdList() {
- console.log(this.thirdOrder.splice(0, 4 - (this.quality -10)),'this.firstOrder.splice(0, 4 - this.level)');
- return this.thirdOrder.splice(0, 5 - (this.quality -10));
- },
+ beforeUpdate() {
+ this.starList = [];
+ if (this.quality > 0 && this.quality <= 5) {
+ for (var i = 1; i <= this.quality; i++) {
+ this.starList.push(this.starType[0]);
+ }
+ } else if (this.quality > 5 && this.quality <= 10) {
+ for (var i = 1; i <= this.quality - 5; i++) {
+ this.starList.push(this.starType[1]);
+ }
+ } else {
+ for (var i = 1; i <= this.quality - 10; i++) {
+ this.starList.push(this.starType[2]);
+ }
+ }
},
data() {
return {
- firstOrder: [
+ starType: [
{ Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- ],
- secondOrder: [
- { Image: require("@/assets/market/hero/star02.png") },
- { Image: require("@/assets/market/hero/star02.png") },
- { Image: require("@/assets/market/hero/star02.png") },
- { Image: require("@/assets/market/hero/star02.png") },
+ { Image: require("@/assets/market/hero/star03.png") },
{ Image: require("@/assets/market/hero/star02.png") },
],
- thirdOrder: [
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- ],
+ starList: []
};
},
};
diff --git a/src/components/market/TheSellDialog.vue b/src/components/market/TheSellDialog.vue
index fd59ff7..d053f40 100644
--- a/src/components/market/TheSellDialog.vue
+++ b/src/components/market/TheSellDialog.vue
@@ -107,7 +107,11 @@ export default {
};
},
created() {
- this.getOption();
+ if (this.options.length > 0) {
+ return;
+ } else {
+ this.getOption();
+ }
console.log(this.options, "87887");
},
@@ -129,19 +133,19 @@ export default {
switch (this.type) {
case "hero":
- console.log(this.type, "-=-",AppModule.chainId);
- '1338'
+ console.log(this.type, "-=-", AppModule.chainId);
+ "1338";
console.log(CONTRACT_ADDRESS[AppModule.chainId]);
- this.nft_Token = CONTRACT_ADDRESS['1338'].hero;
+ this.nft_Token = CONTRACT_ADDRESS["1338"].hero;
break;
case "weapon":
- this.nft_Token = CONTRACT_ADDRESS['1338'].weapon;
+ this.nft_Token = CONTRACT_ADDRESS["1338"].weapon;
break;
case "chip":
- this.nft_Token = CONTRACT_ADDRESS['1338'].chip;
+ this.nft_Token = CONTRACT_ADDRESS["1338"].chip;
break;
case "piece":
- this.nft_Token = CONTRACT_ADDRESS['1338'].piece;
+ this.nft_Token = CONTRACT_ADDRESS["1338"].piece;
break;
}
try {
@@ -153,7 +157,7 @@ export default {
: this.data.detail.token_id,
amount: this.piece ? this.cunout : 1,
price: this.price,
- marketAddress: CONTRACT_ADDRESS['1338'].address,
+ marketAddress: CONTRACT_ADDRESS["1338"].address,
};
console.log(shellData, "shellData");
const nftres = await this.chainManager.bc.beginNftSell(
@@ -162,13 +166,12 @@ export default {
this.piece ? this.piece.detail.token_id : this.data.detail.token_id,
this.piece ? this.cunout : 1,
this.price,
- CONTRACT_ADDRESS['1338'].address
+ CONTRACT_ADDRESS["1338"].address
);
console.log(nftres, "beginSell");
} catch (err) {
console.log("query order status error", err);
}
-
},
async getOption() {
const res = await getSupportedCurrenTypes();
diff --git a/src/components/market/nft/HeroNft.vue b/src/components/market/nft/HeroNft.vue
index 36f8449..3a6837f 100644
--- a/src/components/market/nft/HeroNft.vue
+++ b/src/components/market/nft/HeroNft.vue
@@ -59,30 +59,11 @@
Lv:
{{ fillZero(levelNumber) }}
- {{ this.data.detail.quality }}
-
-
-
- ![]()
-
-
-
-
- ![]()
-
-
-
+
+
![]()
@@ -161,7 +142,7 @@ interface DialogConfigtype {
animationLeave: string;
destroyTime: number;
}
-import { Component, Prop, Vue } from "vue-property-decorator";
+import { Component, Prop, Vue, Watch } from "vue-property-decorator";
import Herodialog from "../Herodialog.vue";
import TheBuyDialog from "../TheBuyDialog.vue";
import TheSellDialog from "../TheSellDialog.vue";
@@ -178,6 +159,7 @@ import TheSellDialog from "../TheSellDialog.vue";
export default class HeroNft extends Vue {
// @Prop() data
// boxState = 'n'
+ quality: any = 1;
dialogVisible: boolean = false;
isTab: boolean = false;
isPiecePut: boolean = false;
@@ -186,35 +168,12 @@ export default class HeroNft extends Vue {
// created() {
// console.log(this.data, "nftlist3sdfsadff");
// }
-
- firstOrder = [
+ starType = [
{ Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- ];
- firstOrder2 = [
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- ];
- secondOrder = [
- { Image: require("@/assets/market/hero/star02.png") },
- { Image: require("@/assets/market/hero/star02.png") },
- { Image: require("@/assets/market/hero/star02.png") },
- { Image: require("@/assets/market/hero/star02.png") },
+ { Image: require("@/assets/market/hero/star03.png") },
{ Image: require("@/assets/market/hero/star02.png") },
];
- thirdOrder = [
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- ];
+ starList:any[]=[]
fillZero(str: number | string) {
var realNum;
@@ -232,53 +191,44 @@ export default class HeroNft extends Vue {
showTip(hide: boolean) {
this.isTab = hide;
}
+ @Watch("data.detail.quality")
+ haldQuality(newvalue: any) {
+ this.quality = newvalue;
+ console.log(this.quality, "this.quality");
+ console.log(this.qualityNumber, "this.qualityNumber");
+
+ }
created() {
- // console.log(this.starList, "starList");
- if (this.data.detail.quality > 0 && this.data.detail.quality <= 5) {
- this.firstOrder.splice(0, 5 - this.data.detail.quality);
- // this.firstOrder= this.firstOrder.splice(0, 5 - this.data.detail.quality);
- } else if (this.data.detail.quality > 5 && this.data.detail.quality <= 10) {
- console.log("2");
- this.secondOrder.splice(0, 5 - (this.data.detail.quality - 5));
+ if (this.qualityNumber > 0 && this.qualityNumber <= 5) {
+ for (var i = 1; i <= this.qualityNumber; i++) {
+ this.starList.push(this.starType[0]);
+ }
+ } else if (this.qualityNumber > 5 && this.qualityNumber <= 10) {
+ for (var i = 1; i <= this.qualityNumber-5; i++) {
+ this.starList.push(this.starType[1]);
+ }
} else {
- this.thirdOrder.splice(0, 5 - (this.data.detail.quality - 10));
+ for (var i = 1; i <= this.qualityNumber-10; i++) {
+ this.starList.push(this.starType[2]);
+ }
}
}
- beforeUpdate(){
- if (this.data.detail.quality > 0 && this.data.detail.quality <= 5) {
- this.firstOrder2.splice(0, 5 - this.data.detail.quality);
- // this.firstOrder= this.firstOrder.splice(0, 5 - this.data.detail.quality);
- } else if (this.data.detail.quality > 5 && this.data.detail.quality <= 10) {
- console.log("2");
- this.secondOrder.splice(0, 5 - (this.data.detail.quality - 5));
+ beforeUpdate() {
+ this.starList=[]
+ if (this.qualityNumber > 0 && this.qualityNumber <= 5) {
+ for (var i = 1; i <= this.qualityNumber; i++) {
+ this.starList.push(this.starType[0]);
+ }
+ } else if (this.qualityNumber > 5 && this.qualityNumber <= 10) {
+ for (var i = 1; i <= this.qualityNumber - 5; i++) {
+ this.starList.push(this.starType[1]);
+ }
} else {
- this.thirdOrder.splice(0, 5 - (this.data.detail.quality - 10));
+ for (var i = 1; i <= this.qualityNumber- 10; i++) {
+ this.starList.push(this.starType[2]);
+ }
}
}
- // Update(){
- // if (this.data.detail.quality > 0 && this.data.detail.quality <= 5) {
- // this.firstOrder2.splice(0, 5 - this.data.detail.quality);
- // // this.firstOrder= this.firstOrder.splice(0, 5 - this.data.detail.quality);
- // } else if (this.data.detail.quality > 5 && this.data.detail.quality <= 10) {
- // console.log("2");
- // this.secondOrder.splice(0, 5 - (this.data.detail.quality - 5));
- // } else {
- // this.thirdOrder.splice(0, 5 - (this.data.detail.quality - 10));
- // }
- // }
- // get starList() {
- // if (this.data.detail.quality > 0 && this.data.detail.quality <= 5) {
- // console.log('11111111111111',this.firstOrder.splice(0, 5 - this.data.detail.quality));
-
- // return this.firstOrder.splice(0, 5 - this.data.detail.quality);
- // } else if (this.data.detail.quality > 5 && this.data.detail.quality <= 10) {
- // console.log('2');
- // return this.secondOrder.splice(0, 5 - (this.data.detail.quality - 5));
- // } else {
- // return this.thirdOrder.splice(0, 5 - (this.data.detail.quality - 10));
- // }
- // }
-
get levelNumber() {
return this.data.detail.hero_lv;
}
@@ -411,6 +361,8 @@ export default class HeroNft extends Vue {
}
.level-img {
display: flex;
+ width: 65%;
+ justify-content: center;
}
.level-levelList {
display: flex;
diff --git a/src/components/market/nft/WeaponList.vue b/src/components/market/nft/WeaponList.vue
index e77e07b..005c6f0 100644
--- a/src/components/market/nft/WeaponList.vue
+++ b/src/components/market/nft/WeaponList.vue
@@ -28,34 +28,9 @@
-
-
- ![]()
-
-
-
-
- ![]()
-
-
-
+
![]()
@@ -141,71 +116,51 @@ export default {
type: "weapon",
isBuy: false,
isPiecePut: false,
- firstOrder: [
+ starType: [
{ Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- ],
- firstOrder2: [
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- { Image: require("@/assets/market/hero/star01.png") },
- ],
- secondOrder: [
- { Image: require("@/assets/market/hero/star02.png") },
- { Image: require("@/assets/market/hero/star02.png") },
- { Image: require("@/assets/market/hero/star02.png") },
- { Image: require("@/assets/market/hero/star02.png") },
+ { Image: require("@/assets/market/hero/star03.png") },
{ Image: require("@/assets/market/hero/star02.png") },
],
- thirdOrder: [
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- { Image: require("@/assets/market/hero/star03.png") },
- ],
+ starList: []
};
},
created() {
- // console.log(this.starList, "starList");
- if (this.weapon.detail.quality > 0 && this.weapon.detail.quality <= 5) {
- console.log(
- this.weapon.detail.quality,
- this.firstOrder.splice(0, 5 - this.weapon.detail.quality) ,'opppppppppppppppppppppppp23233'
- );
- // this.firstOrder= this.firstOrder.splice(0, 5 - this.data.detail.quality);
- } else if (
- this.weapon.detail.quality > 5 &&
- this.weapon.detail.quality <= 10
- ) {
- console.log("2");
- this.secondOrder = this.secondOrder.splice(
- 0,
- 5 - (this.weapon.detail.quality - 5)
- );
+
+ if (this.qualityNumber > 0 && this.qualityNumber <= 5) {
+ for (var i = 1; i <= this.qualityNumber; i++) {
+ this.starList.push(this.starType[0]);
+ }
+ } else if (this.qualityNumber > 5 && this.qualityNumber <= 10) {
+ for (var i = 1; i <= this.qualityNumber - 5; i++) {
+ this.starList.push(this.starType[1]);
+ }
} else {
- this.thirdOrder = this.thirdOrder.splice(
- 0,
- 5 - (this.weapon.detail.quality - 10)
- );
+ for (var i = 1; i <= this.qualityNumber - 10; i++) {
+ this.starList.push(this.starType[2]);
+ }
}
},
- beforeUpdate(){
- if (this.weapon.detail.quality > 0 && this.weapon.detail.quality <= 5) {
- this.firstOrder2.splice(0, 5 - this.weapon.detail.quality);
- // this.firstOrder= this.firstOrder.splice(0, 5 - this.data.detail.quality);
- } else if (this.weapon.detail.quality > 5 && this.weapon.detail.quality <= 10) {
- console.log("2");
- this.secondOrder.splice(0, 5 - (this.weapon.detail.quality - 5));
+ beforeUpdate() {
+ this.starList = [];
+ if (this.qualityNumber > 0 && this.qualityNumber <= 5) {
+ for (var i = 1; i <= this.qualityNumber; i++) {
+ this.starList.push(this.starType[0]);
+ }
+ } else if (this.qualityNumber > 5 && this.qualityNumber <= 10) {
+ for (var i = 1; i <= this.qualityNumber - 5; i++) {
+ this.starList.push(this.starType[1]);
+ }
} else {
- this.thirdOrder.splice(0, 5 - (this.weapon.detail.quality - 10));
+ for (var i = 1; i <= this.qualityNumber - 10; i++) {
+ this.starList.push(this.starType[2]);
+ }
}
},
+ computed: {
+ qualityNumber() {
+ return this.weapon.detail.quality;
+ },
+ },
methods: {
ChipDialoghide() {
this.dialogVisible = false;
@@ -316,14 +271,20 @@ export default {
.level-content {
display: flex;
.level-img {
+ margin-top: 7px;
display: flex;
+ width: 78%;
+ justify-content: center;
+ align-items: center;
}
.level-levelList {
display: flex;
+ align-items: center;
margin-left: 14px;
}
.item-Image {
+ align-items: center;
margin-left: 6px;
display: flex;
}