Skip to content

Commit

Permalink
feat:活动告示美人图#152
Browse files Browse the repository at this point in the history
  • Loading branch information
fifthThirteen committed Jan 10, 2025
1 parent 578c8fb commit 83de834
Show file tree
Hide file tree
Showing 8 changed files with 422 additions and 29 deletions.
63 changes: 63 additions & 0 deletions src/assets/css/gonggao/daily.less
Original file line number Diff line number Diff line change
Expand Up @@ -527,6 +527,49 @@
}
}
}
.m-simple-mrt-new {
.flex;
flex-direction: column;
gap: 10px;
.m-mrt-item {
position: relative;
.flex;
justify-content: space-between;
align-items: center;
padding: 10px;
gap: 20px;
width: 100%;
height: 76px;
box-sizing: border-box;

background: #ffffff;
border-radius: 10px;
font-size: 14px;
font-weight: bold;
.u-name {
.flex;
align-items: center;
gap: 10px;
color: #000000;
&.active {
color: #ffad31;
}
}
.u-desc {
font-size: 12px;
color: #999;
font-weight: normal;
}
.u-date {
font-size: 10px;
color: #999;
font-weight: normal;
position: absolute;
right: 10px;
bottom: 10px;
}
}
}

.m-simple-horse {
position: relative;
Expand Down Expand Up @@ -778,4 +821,24 @@
}
}
}
.u-mrt-title {
.flex;
align-items: center;
gap: 10px;
.el-select {
max-width: 72px;
.el-input__inner {
border: none;
padding: 0;
background-color: transparent;
}
input {
font-size: 12px;
padding: 0;
}
.el-input__suffix {
right: -15px;
}
}
}
}
44 changes: 42 additions & 2 deletions src/components/gonggao/Daily.vue
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,20 @@
<div class="u-title">抓马播报</div>
<SimpleHorse class="m-daily-content"></SimpleHorse>
</div>
<div class="m-daily-item">
<div class="u-title">
<div class="u-mrt-title">
美人图 ·
<el-select class="u-select" placeholder="区服" v-model="currentServer" size="small">
<el-option v-for="(item, i) in servers" :key="i" :label="item" :value="item"></el-option>
</el-select>
</div>
<el-button class="u-btn" type="text" @click="visible = true">查询</el-button>
</div>
<SimpleMrt class="m-daily-content" :server="currentServer"></SimpleMrt>
</div>
</template>
<MrtDialog :visible="visible" @close="visible = false"></MrtDialog>
</div>
</template>

Expand All @@ -55,7 +68,13 @@ import SimpleCelebrity from "./daily/SimpleCelebrity.vue";
// import SimpleReputation from "./daily/SimpleReputation.vue";
// import SimpleFurniture from "./daily/SimpleFurniture.vue";
import SimpleHorse from "./daily/SimpleHorse.vue";
import SimpleMrt from "./daily/SimpleMrt.vue";
import MrtDialog from "./daily/MrtDialog.vue";
import dailyKeys from "@/assets/data/daily_keys.json";
import servers_std from "@jx3box/jx3box-data/data/server/server_std.json";
import servers_origin from "@jx3box/jx3box-data/data/server/server_origin.json";
export default {
name: "Daily",
components: {
Expand All @@ -67,6 +86,8 @@ export default {
// SimpleWeek,
// SimpleFurniture,
SimpleHorse,
SimpleMrt,
MrtDialog,
},
data() {
return {
Expand All @@ -79,14 +100,23 @@ export default {
currentFurniture: {},
nextFurniture: {},
activities: [], // 日常配置列表
visible: false,
currentServer: "",
};
},
computed: {
client() {
return this.$store.state.client;
return this.$store.state.client || "std";
},
server() {
return this.$store.state.server;
return this.$store.state.server || "梦江南";
},
servers: function () {
if (this.client == "std") {
return servers_std;
} else {
return servers_origin;
}
},
isOrigin() {
return location.href.includes("origin");
Expand All @@ -109,6 +139,16 @@ export default {
return week === currentWeek;
},
},
watch: {
server: {
immediate: true,
handler(server) {
if (server) {
this.currentServer = server;
}
},
},
},
methods: {
changeCelebrity(i) {
this.currentCelebrity = i;
Expand Down
178 changes: 178 additions & 0 deletions src/components/gonggao/daily/MrtDialog.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,178 @@
<template>
<el-dialog title="美人图查询" :visible.sync="show" width="90%" custom-class="m-mrt-dialog" @close="close">
<div class="m-toolbar">
<el-select v-model="server" filterable clearable>
<template #prefix>
<div class="u-select-label">区服</div>
</template>
<el-option v-for="(item, i) in servers" :key="i" :label="item" :value="item"></el-option>
</el-select>
<el-select v-model="school_id" filterable clearable>
<template #prefix>
<div class="u-select-label">门派</div>
</template>
<el-option
v-for="item in schoolList"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
<el-select v-model="body_id" filterable clearable>
<template #prefix>
<div class="u-select-label">体型</div>
</template>
<el-option
v-for="item in bodyList"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
<!-- <el-input class="u-input" v-model="desc" clearable placeholder="请输入画像 例如 英少"></el-input> -->
<el-button type="primary" :loading="loading" :disabled="loading" @click="onSearch">查询</el-button>
</div>
<div class="m-content">
<div class="u-content" v-if="data.date">
<div class="u-title">{{ schoolMap[school_id] }}{{ data.item.desc }}画像</div>
<!-- eslint-disable-next-line vue/no-parsing-error -->
<div class="u-date">下个日期: {{ `< ${data.date} >` }}{{ `< ${getWeek(data.date)} >` }}</div>
</div>
<el-empty v-else></el-empty>
</div>
</el-dialog>
</template>
<script>
import { getMeirentuPredict } from "@/service/gonggao";
import { bodyMap } from "@jx3box/jx3box-data/data/role/body.json";
import schoolMap from "@jx3box/jx3box-data/data/xf/schoolid.json";
import servers_std from "@jx3box/jx3box-data/data/server/server_std.json";
import servers_origin from "@jx3box/jx3box-data/data/server/server_origin.json";
import dayjs from "@/plugins/day";
export default {
name: "MrtDialog",
props: ["visible"],
components: {},
data: function () {
return {
loading: false,
server: "",
desc: "",
school_id: "",
body_id: "",
data: {
date: "",
item: {},
},
schoolMap,
};
},
computed: {
show: {
get() {
return this.visible;
},
set() {
this.close();
},
},
bodyList() {
return Object.entries(bodyMap).map(([value, label]) => {
return {
value,
label,
};
});
},
schoolList() {
return Object.entries(schoolMap)
.map(([value, label]) => {
return {
value,
label,
};
})
.filter((item) => item.value != 0);
},
client: function () {
return this.$store.state.client || "std";
},
servers: function () {
if (this.client == "std") {
return servers_std;
} else {
return servers_origin;
}
},
},
watch: {},
methods: {
close() {
this.$emit("close");
},
getWeek(date) {
var data = dayjs.tz(date).day();
var week = ["", "", "", "", "", "", ""];
return "" + week[data];
},
onSearch() {
if (!this.server || !this.school_id || !this.body_id) {
return this.$message.error("请输入查询条件");
}
const params = {
client: this.client,
server: this.server,
school_id: this.school_id,
body_id: this.body_id,
_no_cache: 1,
};
this.loading = true;
getMeirentuPredict(params)
.then((res) => {
this.data = res.data.data || {};
})
.finally(() => {
this.loading = false;
});
},
},
};
</script>
<style lang="less">
.m-mrt-dialog {
.m-toolbar {
.flex;
gap: 10px;
flex-wrap: wrap;
}
.u-select-label {
color: #606266;
line-height: 38px;
padding: 0 10px;
}
.el-input--prefix .el-input__inner {
padding-left: 50px;
}
.u-input {
width: 228px;
}
.m-content {
padding: 60px 40px 40px;
.flex;
align-items: center;
justify-content: center;
.u-content {
.flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 10px;
}
.u-title {
font-size: 20px;
color: #ffad31;
.bold;
}
}
}
</style>
Loading

0 comments on commit 83de834

Please sign in to comment.