Вынес моки в компонент
This commit is contained in:
Sipachev Igor
parent
1fec9d9408
commit
b6e5d9199c
4
popup/src/components/mocks/main.vue
Normal file
4
popup/src/components/mocks/main.vue
Normal file
@ -0,0 +1,4 @@
|
||||
<template src="./template.html"></template>
|
||||
<script lang="ts" src="./script.ts"></script>
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style scoped lang="scss" src="./style.scss"></style>
|
||||
17
popup/src/components/mocks/script.ts
Normal file
17
popup/src/components/mocks/script.ts
Normal file
@ -0,0 +1,17 @@
|
||||
import { Component, Prop, Vue } from 'vue-property-decorator'
|
||||
import VueClipboard from 'vue-clipboard2'
|
||||
import { Registers } from '@/classes/DTO/Registers'
|
||||
|
||||
Vue.use(VueClipboard)
|
||||
|
||||
@Component
|
||||
export default class Mocks extends Vue {
|
||||
@Prop()
|
||||
personalId!: string
|
||||
|
||||
registers = new Registers()
|
||||
|
||||
mounted () {
|
||||
console.log('mounted')
|
||||
}
|
||||
}
|
||||
3
popup/src/components/mocks/style.scss
Normal file
3
popup/src/components/mocks/style.scss
Normal file
@ -0,0 +1,3 @@
|
||||
.option-select {
|
||||
width: 350px;
|
||||
}
|
||||
39
popup/src/components/mocks/template.html
Normal file
39
popup/src/components/mocks/template.html
Normal file
@ -0,0 +1,39 @@
|
||||
<div>
|
||||
<!-- 0 - не замокано(делать запрос) -->
|
||||
<!-- 1 - выписка на хороший доход-->
|
||||
<!-- 2 - выписка на маленький доход-->
|
||||
<!-- 3 - ошибка загрузки выписки (перезапрос)-->
|
||||
<!-- 4 - ошибка загрузки выписки (нет данных)-->
|
||||
<!-- 5 - по персональному коду (3 - выписка с хорошим доходом, остальные - ошибка загрузки выписки)-->
|
||||
<!-- 6 - выписка на хороший доход, последние два месяца доход 0-->
|
||||
<!-- 7 - выписка на хороший доход, последний месяц доход 0-->
|
||||
<!-- 8 - выписка на хороший доход, но у пользователя нет активного работодателя. Не можем выдать-->
|
||||
<!-- 9 - выписка на хороший доход, в выписке есть выплаты, которые не учитываются в подсчёте среднего дохода-->
|
||||
<label>
|
||||
XTEE MTA
|
||||
<select class="option-select" v-model="registers.xteeMta">
|
||||
<option value="">-</option>
|
||||
<option value="0">Не замокано (делать запрос)</option>
|
||||
<option value="1">Выписка на хороший доход</option>
|
||||
<option value="2">Выписка на маленький доход</option>
|
||||
<option value="3">Ошибка загрузки выписки (перезапрос)</option>
|
||||
<option value="4">Ошибка загрузки выписки (нет данных)</option>
|
||||
<option value="5">По персональному коду (3 - выписка с хорошим доходом, остальные - ошибка загрузки выписки)</option>
|
||||
<option value="6">Выписка на хороший доход, последние два месяца доход 0</option>
|
||||
<option value="7">Выписка на хороший доход, последний месяц доход 0</option>
|
||||
<option value="8">Выписка на хороший доход, но у пользователя нет активного работодателя. Не можем выдать</option>
|
||||
<option value="9">Выписка на хороший доход, в выписке есть выплаты, которые не учитываются в подсчёте среднего дохода</option>
|
||||
</select>
|
||||
</label>
|
||||
<br /><br />
|
||||
<label>
|
||||
XTEE Pension
|
||||
<select class="option-select" v-model="registers.xteePension">
|
||||
<option value="">-</option>
|
||||
<option value="0">Не замокано (делать запрос)</option>
|
||||
<option value="2">Ошибка сервиса. (перезапросы)</option>
|
||||
</select>
|
||||
</label>
|
||||
<br /><br />
|
||||
<button @click="saveMocks">Сохранить моки</button>
|
||||
</div>
|
||||
4
popup/src/components/person-tab/main.vue
Normal file
4
popup/src/components/person-tab/main.vue
Normal file
@ -0,0 +1,4 @@
|
||||
<template src="./template.html"></template>
|
||||
<script lang="ts" src="./script.ts"></script>
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style scoped lang="scss" src="./style.scss"></style>
|
||||
115
popup/src/components/person-tab/script.ts
Normal file
115
popup/src/components/person-tab/script.ts
Normal file
@ -0,0 +1,115 @@
|
||||
import { Component, Vue } from 'vue-property-decorator'
|
||||
import personalIdGenerator from '@/classes/Service/Generators/PersonalIdGenerator'
|
||||
import ibanGenerator from '@/classes/Service/Generators/IbanGenerator'
|
||||
import phoneGenerator from '@/classes/Service/Generators/PhoneGenerator'
|
||||
import firstNameGenerator from '@/classes/Service/Generators/FirstNameGenerator'
|
||||
import lastNameGenerator from '@/classes/Service/Generators/LastNameGenerator'
|
||||
import { Person } from '@/classes/DTO/Person'
|
||||
import VueClipboard from 'vue-clipboard2'
|
||||
import { Target } from '@/classes/Enum/Target'
|
||||
import sender from '@/classes/Service/Browser/Chrome/Sender'
|
||||
import { Action } from '@/classes/Enum/Action'
|
||||
import notificationCleaner from '@/classes/Service/NotificationCleaner'
|
||||
import { Registers } from '@/classes/DTO/Registers'
|
||||
import Mocks from '@/components/mocks/main.vue'
|
||||
|
||||
Vue.use(VueClipboard)
|
||||
|
||||
@Component({
|
||||
components: {
|
||||
Mocks
|
||||
}
|
||||
})
|
||||
export default class PersonTab extends Vue {
|
||||
personalId = ''
|
||||
person = new Person()
|
||||
registers = new Registers()
|
||||
isAutoCleaner = false
|
||||
copyText = ''
|
||||
|
||||
get allowedMonths () {
|
||||
const result = []
|
||||
for (let i = 1; i <= 12; i++) {
|
||||
result.push(i)
|
||||
}
|
||||
return result
|
||||
}
|
||||
|
||||
get allowedYears () {
|
||||
const result = []
|
||||
const currentYear = (new Date()).getFullYear()
|
||||
for (let i = 1960; i <= currentYear; i++) {
|
||||
result.push(i)
|
||||
}
|
||||
return result
|
||||
}
|
||||
|
||||
mounted () {
|
||||
/** todo заполнить первоначальное значение */
|
||||
notificationCleaner.state().then((isAutoCleaner) => {
|
||||
this.isAutoCleaner = isAutoCleaner
|
||||
console.log('this.isAutoCleaner = ' + isAutoCleaner)
|
||||
})
|
||||
}
|
||||
|
||||
copyPersonalId () {
|
||||
const personalId = personalIdGenerator.generate(this.person)
|
||||
this.personalId = personalId
|
||||
this.copy(personalId)
|
||||
}
|
||||
|
||||
copyIban () {
|
||||
const iban = ibanGenerator.generate(this.person.country)
|
||||
this.copy(iban)
|
||||
}
|
||||
|
||||
copyPhone () {
|
||||
const phone = phoneGenerator.generate(this.person.country)
|
||||
this.copy(phone)
|
||||
}
|
||||
|
||||
copy (text: string) {
|
||||
this.copyText = text
|
||||
this.$copyText(text)
|
||||
}
|
||||
|
||||
autocomplete () {
|
||||
const personalId = personalIdGenerator.generate(this.person)
|
||||
this.insertValueToNode(Target.PERSONAL_ID, personalId)
|
||||
const iban = ibanGenerator.generate(this.person.country)
|
||||
this.insertValueToNode(Target.IBAN, iban)
|
||||
const phone = phoneGenerator.generate(this.person.country)
|
||||
this.insertValueToNode(Target.PHONE, phone)
|
||||
const firstName = firstNameGenerator.generate(this.person.country, this.person.gender)
|
||||
this.insertValueToNode(Target.FIRST_NAME, firstName)
|
||||
const lastName = lastNameGenerator.generate(this.person.country)
|
||||
this.insertValueToNode(Target.LAST_NAME, lastName)
|
||||
}
|
||||
|
||||
insertValueToNode (target: Target, value: string): void {
|
||||
sender.send({
|
||||
action: Action.INSERT,
|
||||
target: target,
|
||||
value: value
|
||||
})
|
||||
}
|
||||
|
||||
cleanNotifications (): void {
|
||||
sender.send({
|
||||
action: Action.CLEAN_NOTIFICATION
|
||||
})
|
||||
}
|
||||
|
||||
onChangeAutoCleaner () {
|
||||
console.log(this.isAutoCleaner)
|
||||
if (this.isAutoCleaner) {
|
||||
notificationCleaner.enable()
|
||||
} else {
|
||||
notificationCleaner.disable()
|
||||
}
|
||||
}
|
||||
|
||||
saveMocks () {
|
||||
console.log(this.personalId, this.registers)
|
||||
}
|
||||
}
|
||||
3
popup/src/components/person-tab/style.scss
Normal file
3
popup/src/components/person-tab/style.scss
Normal file
@ -0,0 +1,3 @@
|
||||
.option-select {
|
||||
width: 350px;
|
||||
}
|
||||
61
popup/src/components/person-tab/template.html
Normal file
61
popup/src/components/person-tab/template.html
Normal file
@ -0,0 +1,61 @@
|
||||
<div class="tab-page__item tab-page__item_show">
|
||||
<div class="form-row">
|
||||
<div class="form-row__item">
|
||||
<input title="Day" class="form-row__item-input" type="text" v-model="person.birthday.day" placeholder="Day">
|
||||
</div>
|
||||
<div class="form-row__item">
|
||||
<select title="Month" v-model="person.birthday.month">
|
||||
<option v-for="allowedMonth in allowedMonths" :value="allowedMonth">{{ allowedMonth }}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-row__item">
|
||||
<select title="Year" v-model="person.birthday.year">
|
||||
<option v-for="allowedYear in allowedYears" :value="allowedYear">{{ allowedYear }}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-row__item">
|
||||
<label>
|
||||
Country
|
||||
<select v-model="person.country">
|
||||
<option value="ee">Estonia</option>
|
||||
<option value="lt">Lithuania</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-row__item">
|
||||
<label>
|
||||
Gender
|
||||
<select v-model="person.gender">
|
||||
<option value="male">Male</option>
|
||||
<option value="female">Female</option>
|
||||
<option value="random">Random</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div
|
||||
@click="autocomplete"
|
||||
class="form-row__item copy-button" data-clipboard-text="text1">
|
||||
<button>Autocomplete</button>
|
||||
</div>
|
||||
<div
|
||||
@click="copyPersonalId"
|
||||
class="form-row__item copy-button" data-clipboard-text="text2">
|
||||
<button>PersonalId</button>
|
||||
</div>
|
||||
<div
|
||||
@click="copyIban"
|
||||
class="form-row__item copy-button" data-clipboard-text="text3">
|
||||
<button>Iban</button>
|
||||
</div>
|
||||
<div
|
||||
@click="copyPhone"
|
||||
class="form-row__item copy-button" data-clipboard-text="text3">
|
||||
<button>Phone</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="memory-panel">Memory: {{copyText}}</div>
|
||||
</div>
|
||||
@ -11,10 +11,15 @@ import sender from '@/classes/Service/Browser/Chrome/Sender'
|
||||
import { Action } from '@/classes/Enum/Action'
|
||||
import notificationCleaner from '@/classes/Service/NotificationCleaner'
|
||||
import { Registers } from '@/classes/DTO/Registers'
|
||||
import Mocks from '@/components/mocks/main.vue'
|
||||
|
||||
Vue.use(VueClipboard)
|
||||
|
||||
@Component
|
||||
@Component({
|
||||
components: {
|
||||
Mocks
|
||||
}
|
||||
})
|
||||
export default class HelloWorld extends Vue {
|
||||
tab = 'person'
|
||||
personalId = ''
|
||||
@ -71,6 +76,8 @@ export default class HelloWorld extends Vue {
|
||||
|
||||
autocomplete () {
|
||||
const personalId = personalIdGenerator.generate(this.person)
|
||||
this.personalId = personalId
|
||||
this.copy(personalId)
|
||||
this.insertValueToNode(Target.PERSONAL_ID, personalId)
|
||||
const iban = ibanGenerator.generate(this.person.country)
|
||||
this.insertValueToNode(Target.IBAN, iban)
|
||||
|
||||
@ -72,6 +72,20 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="memory-panel">Memory: {{copyText}}</div>
|
||||
<div v-if="personalId">
|
||||
<hr />
|
||||
<Mocks :personalId="personalId"></Mocks>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-page__item" :class="{'tab-page__item_show': tab === 'mocks'}">
|
||||
<label>
|
||||
Personal id
|
||||
<input type="text" v-model="personalId"/>
|
||||
<div v-if="personalId">
|
||||
<hr />
|
||||
<Mocks :personalId="personalId"></Mocks>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
<div class="tab-page__item" :class="{'tab-page__item_show': tab === 'ember'}">
|
||||
<div class="form-row">
|
||||
@ -90,54 +104,6 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-page__item" :class="{'tab-page__item_show': tab === 'mocks'}">
|
||||
<label>
|
||||
Personal id
|
||||
<input type="text" v-model="personalId"/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="personalId && (tab === 'person' || tab === 'mocks')">
|
||||
<hr />
|
||||
<!-- /**-->
|
||||
<!-- * 0 - не замокано(делать запрос) -->
|
||||
<!-- * 1 - выписка на хороший доход-->
|
||||
<!-- * 2 - выписка на маленький доход-->
|
||||
<!-- * 3 - ошибка загрузки выписки (перезапрос)-->
|
||||
<!-- * 4 - ошибка загрузки выписки (нет данных)-->
|
||||
<!-- * 5 - по персональному коду (3 - выписка с хорошим доходом, остальные - ошибка загрузки выписки)-->
|
||||
<!-- * 6 - выписка на хороший доход, последние два месяца доход 0-->
|
||||
<!-- * 7 - выписка на хороший доход, последний месяц доход 0-->
|
||||
<!-- * 8 - выписка на хороший доход, но у пользователя нет активного работодателя. Не можем выдать-->
|
||||
<!-- * 9 - выписка на хороший доход, в выписке есть выплаты, которые не учитываются в подсчёте среднего дохода-->
|
||||
<!-- */-->
|
||||
<label>
|
||||
XTEE MTA
|
||||
<select class="option-select" v-model="registers.xteeMta">
|
||||
<option value="">-</option>
|
||||
<option value="0">Не замокано (делать запрос)</option>
|
||||
<option value="1">Выписка на хороший доход</option>
|
||||
<option value="2">Выписка на маленький доход</option>
|
||||
<option value="3">Ошибка загрузки выписки (перезапрос)</option>
|
||||
<option value="4">Ошибка загрузки выписки (нет данных)</option>
|
||||
<option value="5">По персональному коду (3 - выписка с хорошим доходом, остальные - ошибка загрузки выписки)</option>
|
||||
<option value="6">Выписка на хороший доход, последние два месяца доход 0</option>
|
||||
<option value="7">Выписка на хороший доход, последний месяц доход 0</option>
|
||||
<option value="8">Выписка на хороший доход, но у пользователя нет активного работодателя. Не можем выдать</option>
|
||||
<option value="9">Выписка на хороший доход, в выписке есть выплаты, которые не учитываются в подсчёте среднего дохода</option>
|
||||
</select>
|
||||
</label>
|
||||
<br /><br />
|
||||
<label>
|
||||
XTEE Pension
|
||||
<select class="option-select" v-model="registers.xteePension">
|
||||
<option value="">-</option>
|
||||
<option value="0">Не замокано (делать запрос)</option>
|
||||
<option value="2">Ошибка сервиса. (перезапросы)</option>
|
||||
</select>
|
||||
</label>
|
||||
<br /><br />
|
||||
<button @click="saveMocks">Сохранить моки</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user