feat: processing 체계를 일괄 변경
This commit is contained in:
@@ -16,20 +16,21 @@
|
||||
</li>
|
||||
</ul>
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-4">
|
||||
국명 : <b-form-input v-model="destNationName" />
|
||||
<div class="col-4 col-md-2">
|
||||
국명 : <b-form-input maxlength="18" v-model="destNationName" />
|
||||
</div>
|
||||
<div class="col-6 col-md-2">
|
||||
<div class="col-3 col-md-2">
|
||||
색상 : <ColorSelect :colors="colors" v-model="selectedColorID" />
|
||||
</div>
|
||||
<div class="col-6 col-md-2">
|
||||
<div class="col-3 col-md-2">
|
||||
<label>성향 :</label>
|
||||
<b-form-select
|
||||
:options="nationTypesOption"
|
||||
v-model="selectedNationType"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-md-2 d-grid">
|
||||
|
||||
<div class="col-2 col-md-2 d-grid">
|
||||
<b-button @click="submit">{{ commandName }}</b-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
<b-button :pressed="!buyRice" @click="buyRice=false">팜</b-button>
|
||||
</b-button-group>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div class="col-7 col-md-4">
|
||||
금액 :
|
||||
<SelectAmount
|
||||
:amountGuide="amountGuide"
|
||||
@@ -21,7 +21,7 @@
|
||||
:minAmount="minAmount"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-4 col-md-2 d-grid">
|
||||
<div class="col-3 col-md-2 d-grid">
|
||||
<b-button variant="primary" @click="submit">{{ commandName }}</b-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
장수를 선택하세요.<br />
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-6">
|
||||
<div class="col-9 col-md-4">
|
||||
장수 :
|
||||
<SelectGeneral
|
||||
:generals="generalList"
|
||||
@@ -19,7 +19,7 @@
|
||||
v-model="selectedGeneralID"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-4 col-md-2 d-grid">
|
||||
<div class="col-3 col-md-2 d-grid">
|
||||
<b-button variant="primary" @click="submit">{{ commandName }}</b-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
임관할 국가를 목록에서 선택하세요.<br />
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-6">
|
||||
<div class="col-8 col-md-4">
|
||||
장수 :
|
||||
<SelectGeneral
|
||||
:generals="generalList"
|
||||
@@ -25,11 +25,20 @@
|
||||
<div class="nation-header nation-row bg1 center">
|
||||
<div>국가명</div>
|
||||
<div>임관권유문</div>
|
||||
<div class="zoom-toggle d-grid">
|
||||
<b-button
|
||||
:pressed="toggleZoom"
|
||||
:variant="toggleZoom ? 'info' : 'secondary'"
|
||||
v-model="toggleZoom"
|
||||
@click="toggleZoom = !toggleZoom"
|
||||
>{{ toggleZoom ? "작게 보기" : "크게 보기" }}</b-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-for="[, nation] in nationList"
|
||||
:key="nation.id"
|
||||
class="nation-row s-border-b"
|
||||
:class="['nation-row', 's-border-b', toggleZoom ? 'on-zoom' : 'on-fit']"
|
||||
>
|
||||
<div
|
||||
:style="{
|
||||
@@ -87,6 +96,7 @@ export default defineComponent({
|
||||
procRes.generals
|
||||
);
|
||||
|
||||
const toggleZoom = ref(true);
|
||||
const selectedGeneralID = ref(generalList[0].no);
|
||||
|
||||
function textHelpGeneral(gen: procGeneralItem): string {
|
||||
@@ -116,6 +126,7 @@ export default defineComponent({
|
||||
selectedGeneralID,
|
||||
generalList,
|
||||
commandName,
|
||||
toggleZoom,
|
||||
isBrightColor,
|
||||
textHelpGeneral,
|
||||
submit,
|
||||
@@ -132,24 +143,57 @@ export default defineComponent({
|
||||
display: grid;
|
||||
grid-template-columns: 130px 870px;
|
||||
}
|
||||
|
||||
.zoom-toggle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.zoom-toggle > * {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@include media-500px {
|
||||
.nation-list .nation-row.nation-header {
|
||||
display: grid;
|
||||
grid-template-columns: 3fr 1fr;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
|
||||
.zoom-toggle {
|
||||
grid-column: 2/3;
|
||||
grid-row: 1/3;
|
||||
}
|
||||
}
|
||||
|
||||
.nation-list .nation-row {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
grid-template-rows: 1fr minmax(1fr, calc(200px * 500 / 870));
|
||||
}
|
||||
|
||||
.nation-scout-plate {
|
||||
max-height: calc(200px * 500 / 870);
|
||||
overflow: hidden;
|
||||
.on-fit {
|
||||
.nation-scout-plate {
|
||||
max-height: calc(200px * 500 / 870);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.nation-scout-msg {
|
||||
width: 870px;
|
||||
transform-origin: 0px 0px;
|
||||
transform: scale(calc(500 / 870));
|
||||
}
|
||||
}
|
||||
|
||||
.nation-scout-msg {
|
||||
width: 870px;
|
||||
transform-origin: 0px 0px;
|
||||
transform: scale(calc(500 / 870));
|
||||
.on-zoom {
|
||||
.nation-scout-plate {
|
||||
max-height: 200px;
|
||||
overflow-y: hidden;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.nation-scout-msg {
|
||||
max-width: 870px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -61,11 +61,12 @@
|
||||
></div>
|
||||
<div
|
||||
:style="{
|
||||
backgroundColor: (destCrewType.notAvailable
|
||||
? 'red'
|
||||
: destCrewType.reqTech == 0
|
||||
? 'green'
|
||||
: 'limegreen')+' !important',
|
||||
backgroundColor:
|
||||
(destCrewType.notAvailable
|
||||
? 'red'
|
||||
: destCrewType.reqTech == 0
|
||||
? 'green'
|
||||
: 'limegreen') + ' !important',
|
||||
height: '100%',
|
||||
}"
|
||||
class="d-grid"
|
||||
@@ -74,7 +75,7 @@
|
||||
{{ destCrewType.name }}
|
||||
</div>
|
||||
</div>
|
||||
<div>{{ destCrewType.baseCost.toFixed(1) }}</div>
|
||||
<div></div>
|
||||
<div class="crewTypePanel">
|
||||
<b-button-group
|
||||
><b-button class="py-1" variant="dark" @click="beHalf"
|
||||
@@ -107,7 +108,7 @@
|
||||
><div style="margin-left: auto">
|
||||
{{
|
||||
Math.ceil(
|
||||
amount * destCrewType.baseCost
|
||||
amount * destCrewType.baseCost * goldCoeff
|
||||
).toLocaleString()
|
||||
}}금
|
||||
</div></span
|
||||
@@ -116,6 +117,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div></div>
|
||||
<b-button variant="primary" @click="submit">{{
|
||||
commandName
|
||||
}}</b-button>
|
||||
@@ -126,9 +128,9 @@
|
||||
<div>공격</div>
|
||||
<div>방어</div>
|
||||
<div>기동</div>
|
||||
<div>회피</div>
|
||||
<div>가격</div>
|
||||
<div>군량</div>
|
||||
<div>회피</div>
|
||||
<div class="crewTypePanel">병사 수</div>
|
||||
<div class="crewTypeBtn">행동</div>
|
||||
<div class="crewTypeInfo">특징</div>
|
||||
@@ -140,10 +142,17 @@
|
||||
:key="armCrewType.armType"
|
||||
>
|
||||
<div class="s-border-b row gx-0">
|
||||
<div class="col-7 col-md-10 align-self-center px-3" style="font-size:1.3em;">{{ armCrewType.armName }} 계열</div>
|
||||
<div
|
||||
class="col-7 col-md-10 align-self-center px-3"
|
||||
style="font-size: 1.3em"
|
||||
>
|
||||
{{ armCrewType.armName }} 계열
|
||||
</div>
|
||||
<div class="col-5 col-md-2 d-grid">
|
||||
<b-button
|
||||
:variant="showNotAvailable.get(armCrewType.armType) ? 'warning' : 'dark'"
|
||||
:variant="
|
||||
showNotAvailable.get(armCrewType.armType) ? 'warning' : 'dark'
|
||||
"
|
||||
:pressed="showNotAvailable.get(armCrewType.armType)"
|
||||
class="btn-sm"
|
||||
@click="toggleShowNotAvailable(armCrewType.armType)"
|
||||
@@ -166,6 +175,7 @@
|
||||
:commandName="commandName"
|
||||
:currentCrewType="currentCrewType"
|
||||
:crew="crew"
|
||||
:goldCoeff="goldCoeff"
|
||||
@submitOutput="trySubmit"
|
||||
@click="
|
||||
destCrewType = crewTypeMap.get(crewType.id);
|
||||
@@ -262,26 +272,18 @@ export default defineComponent({
|
||||
void submit(e);
|
||||
}
|
||||
|
||||
function toggleShowNotAvailable(armType: number){
|
||||
showNotAvailable.value.set(armType, !(showNotAvailable.value.get(armType)??0));
|
||||
function toggleShowNotAvailable(armType: number) {
|
||||
showNotAvailable.value.set(
|
||||
armType,
|
||||
!(showNotAvailable.value.get(armType) ?? 0)
|
||||
);
|
||||
}
|
||||
|
||||
return {
|
||||
destCrewType,
|
||||
amount,
|
||||
showNotAvailable,
|
||||
relYear: procRes.relYear,
|
||||
year: procRes.year,
|
||||
tech: procRes.tech,
|
||||
techLevel: procRes.techLevel,
|
||||
startYear: procRes.startYear,
|
||||
goldCoeff: procRes.goldCoeff,
|
||||
leadership: procRes.leadership,
|
||||
fullLeadership: procRes.fullLeadership,
|
||||
armCrewTypes: procRes.armCrewTypes,
|
||||
currentCrewType: procRes.currentCrewType,
|
||||
crew: procRes.crew,
|
||||
gold: procRes.gold,
|
||||
...procRes,
|
||||
crewTypeMap,
|
||||
commandName,
|
||||
beHalf,
|
||||
@@ -320,8 +322,8 @@ export default defineComponent({
|
||||
display: none;
|
||||
}
|
||||
|
||||
.only500pxMode{
|
||||
display: none;
|
||||
.only500pxMode {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -367,7 +369,7 @@ export default defineComponent({
|
||||
|
||||
.miniCrewPanel {
|
||||
display: grid;
|
||||
grid-template-columns: 64px 1.5fr 1fr 270px 2fr;
|
||||
grid-template-columns: 64px 1.5fr 0.5fr 270px 0.5fr 2fr;
|
||||
grid-template-rows: 64px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
<b-button :pressed="!isGold" @click="isGold = false">쌀</b-button>
|
||||
</b-button-group>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div class="col-7 col-md-4">
|
||||
금액 :
|
||||
<SelectAmount
|
||||
:amountGuide="amountGuide"
|
||||
@@ -21,7 +21,7 @@
|
||||
:minAmount="minAmount"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-4 col-md-2 d-grid">
|
||||
<div class="col-3 col-md-2 d-grid">
|
||||
<b-button variant="primary" @click="submit">{{ commandName }}</b-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user