<body>
<div id='app'>
<h1>소모품대장 계산 도우미</h1>
<div class="inputBox">
<small>현재 재고는 <b>{{ inStock }}</b>입니다.</small>
<input class="use" type="text" placeholder="불출량 입력하세요" v-model="use">
<button v-on:click="usingInStock(use)" v-on:keyup.enter="usingInStock(use)">사용</button>
</div>
<div class="inputBox">
<small>추가 입고분이 있다면 입력해주세요.</small>
<input class="store" type="text" placeholder="입고량 입력하세요" v-model="store">
<button v-on:click="storingInStock(store)" v-on:keyup.enter="storingInStock(store)">사용</button>
</div>
<ul class="todoList">
<li v-for="(record, index) in records">
<span>{{index}} :: 날짜는 : {{record.Today_date}} - 재고는 : {{ record.currunt_data }} </span>
</li>
</ul>
</div>
<script src="https://unpkg.com/vue@2.6.10/dist/vue.js"></script>
<script>
function getRandomIntInclusive(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
var vm = new Vue({
el: '#app',
data: {
inStock: '1581',
use: '',
store: '',
str1: '',
tempDate: new Date(2018, 0, 1),
fistDate: '',
records: [
{Today_date: '', currunt_data: ''}
],
},
methods: {
usingInStock: function(use){
this.inStock -= this.use
var d = new Date();
var week = new Array('일', '월', '화', '수', '목', '금', '토');
// this.tempDate.setDate(this.tempDate.getDate() + getRandomIntInclusive(6, 7))
this.tempDate.setDate(this.tempDate.getDate() + 7)
// this.str1 = week[this.tempDate.getDay()]
// console.log("하하하", this.str1, d.getDate(), d.getDay())
this.records.unshift({Today_date:this.tempDate.toLocaleString('ko-KR', {year: "numeric", month:"2-digit", day:"2-digit", weekday: 'short' }), currunt_data: this.inStock})
},
storingInStock: function(store){
this.store = parseInt(this.store)
this.inStock = parseInt(this.inStock)
this.inStock += this.store
}
}
}
)
</script>
</body>