mindol1004/ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

surveys

Browse Source
This commit is contained in:
lee-soo-heon
2019-09-10 10:42:13 +09:00
parent 9e200ada71
commit fb0f2b01af
14 changed files with 299 additions and 156 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
package-lock.json generated
View File

@@ -979,11 +979,18 @@
"babel-runtime": "^6.26.0"
}
},
"babel-plugin-transform-runtime": {
"version": "6.23.0",
"resolved": "https://registry.npmjs.org/babel-plugin-transform-runtime/-/babel-plugin-transform-runtime-6.23.0.tgz",
"integrity": "sha1-iEkNRGUC6puOfvsP4J7E2ZR5se4=",
"requires": {
"babel-runtime": "^6.22.0"
}
},
"babel-runtime": {
"version": "6.26.0",
"resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
"integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
"dev": true,
"requires": {
"core-js": "^2.4.0",
"regenerator-runtime": "^0.11.0"
@@ -7120,8 +7127,7 @@
"regenerator-runtime": {
"version": "0.11.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
"integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==",
"dev": true
"integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
},
"regex-not": {
"version": "1.0.2",

1
package.json
View File

@@ -9,6 +9,7 @@
"dependencies": {
"@chenfengyuan/vue-number-input": "^1.1.1",
"axios": "^0.19.0",
"babel-plugin-transform-runtime": "^6.23.0",
"register-service-worker": "^1.6.2",
"vue": "^2.6.10",
"vue-router": "^3.0.3",

28
src/App.vue
View File

@@ -7,7 +7,7 @@
color="amber"
>
<v-app-bar-nav-icon @click="drawer = !drawer"></v-app-bar-nav-icon>
<span class="title ml-3 mr-5">12&nbsp;<span class="font-weight-light">Street</span></span>
<v-btn text @click="$router.push('/')"><span class="title ml-3 mr-5">12&nbsp;<span class="font-weight-light">Street</span></span></v-btn>
<v-text-field
v-if="$route.path == '/products'"
v-model="productSearch"
@@ -21,13 +21,14 @@
<div class="flex-grow-1"></div>
<v-btn text v-if="$route.path == '/products' && $store.state.login == true" @click="repositoryDialog = true" >상품추가</v-btn>
<v-btn text
v-if="$route.path == '/mypage' && oderBlackList && $store.state.login == true "
@click="pageList()"
style="background: red;" >블랙리스트</v-btn>
<v-btn text
v-if="$route.path == '/mypage' && !oderBlackList && $store.state.login == true "
@click="pageList()" >구매리스트</v-btn>
<v-btn text v-if="$route.path == '/products' && $store.state.login == true" @click="deleteDialog = true" >상품삭제</v-btn>
<!-- <v-btn text-->
<!-- v-if="$route.path == '/mypage' && oderBlackList && $store.state.login == true "-->
<!-- @click="pageList()"-->
<!-- style="background: red;" >블랙리스트</v-btn>-->
<!-- <v-btn text-->
<!-- v-if="$route.path == '/mypage' && !oderBlackList && $store.state.login == true "-->
<!-- @click="pageList()" >구매리스트</v-btn>-->
<v-btn text @click="dialog = true" v-if="$store.state.login == false">Login</v-btn>
<v-btn text @click="logout" v-else>Logout</v-btn>
<!--<v-btn text>-->
@@ -125,6 +126,16 @@
></product-repository>
</v-dialog>
<v-dialog
v-model="deleteDialog"
width="500"
persistent
>
<product-delete
:deleteDialog.sync="deleteDialog"
></product-delete>
</v-dialog>
<v-snackbar
v-model="snackbar"
:color="'success'"
@@ -177,6 +188,7 @@
drawer: null,
dialog: false,
repositoryDialog: false,
deleteDialog: false,
oderBlackList:false,
items: [
{icon: 'home', text: 'Home', routelink: '/'},

1
src/components/marketing/Survey.vue
View File

@@ -9,7 +9,6 @@
export default {
data: () => ({
orderData: {},
}),
created() {
this.orderData=this.$route.params;

13
src/components/marketing/SurveyForm.vue
View File

@@ -1,5 +1,5 @@
<template >
<v-container style="width: 600px" class="elevation-12">
<v-container style="width: 600px; margin-top: 30px" class="elevation-12">
<v-card >
<v-card-title style="color: crimson; font-size: 25px; justify-content: left">리뷰 작성</v-card-title>
<v-row >
@@ -46,7 +46,7 @@
></v-radio>
</v-radio-group>
</v-row>
<v-card-title style="font-size: 15px; justify-content: left">> 배송이빨라나요?</v-card-title>
<v-card-title style="font-size: 15px; justify-content: left">> 배송이 빨라나요?</v-card-title>
<v-row justify="center" >
<v-radio-group v-model="surveyDelivery" row>
<v-radio
@@ -94,6 +94,7 @@
surveyRecommend:2,
surveyDelivery:2,
surveyComment:'',
user:`${localStorage.getItem('userId')}`
}),
created() {
@@ -106,9 +107,7 @@
console.log(value);
}
},
mounted() {
},
mounted() {},
computed: {},
methods: {
getComponent(componentName) {
@@ -128,11 +127,11 @@
// http http://localhost:8084/surveys customerName="1@uengine.org" surveyMessage="nonooooo" productSatisfaction=1
let param = {
'customerName': '1@uengine.org',
'customerName': me.user,
'surveyMessage': me.surveyComment,
'productSatisfaction': (me.surveyDelivery+me.surveyRecommend+me.rating)/3,
}
me.$http.post(`http://localhost:8084/surveys`, param).then(function (e) {
me.$http.post(`${API_HOST}/surveys`, param).then(function () {
console.log('Survey POST');
app.surveySnackbar = true
})

7
src/components/mypage/MyPage.vue
View File

@@ -3,8 +3,11 @@
<user-info
:is-navi=false
></user-info>
<order-list v-if=show style="margin-top: 10px;"></order-list>
<black-list-user-info v-else style="margin-top: 10px;" ></black-list-user-info>
<!-- <order-list v-if=show style="margin-top: 10px;"></order-list>-->
<!-- <black-list-user-info v-else style="margin-top: 10px;" ></black-list-user-info>-->
<order-list style="margin-top: 10px;"></order-list>
<black-list-user-info style="margin-top: 10px;" ></black-list-user-info>
</v-container>
</template>

59
src/components/order/OrderList.vue
View File

@@ -12,30 +12,14 @@
sort-by="calories"
class="elevation-1"
>
<template v-slot:top>
<v-dialog v-model="dialog"
max-width="800px"
scrollable>
<v-card>
<!-- <order-page></order-page>-->
<delivery-status
:prod-name="editedItem.name"
></delivery-status>
<v-card-actions>
<div class="flex-grow-1"></div>
<v-btn color="blue darken-1" text @click="close">Cancel</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</template>
<template v-slot:item.action="{ item }">
<!--<v-icon-->
<!--small-->
<!--class="mr-2"-->
<!--@click="openDelivery(item)"-->
<!--small-->
<!--class="mr-2"-->
<!--@click="openDelivery(item)"-->
<!--&gt;-->
<!--배송완료-->
<!--배송완료-->
<!--</v-icon>-->
<v-chip :color="'green'"
dark
@@ -56,17 +40,15 @@
<template v-slot:item.Survey="{ item }">
<v-icon
small
class="mr-2"
@click="openSurvey(item)"
v-if="surveyComplete"
small
@click="openSurvey(item)"
v-if="surveyComplete"
>
리뷰작성
리뷰작성
</v-icon>
<v-icon v-else
small
class="mr-2"
@click="openSurvey(item)"
style="color: darkolivegreen; background: chartreuse"
>
@@ -74,6 +56,24 @@
</v-icon>
</template>
<template v-slot:top>
<v-dialog v-model="dialog"
max-width="800px"
scrollable>
<v-card>
<!-- <order-page></order-page>-->
<delivery-status
:prod-name="editedItem.name"
></delivery-status>
<v-card-actions>
<div class="flex-grow-1"></div>
<v-btn color="blue darken-1" text @click="close">Cancel</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</template>
</v-data-table>
</v-card>
</template>
@@ -83,7 +83,7 @@
name: 'OrderList',
data: () => ({
dialog: false,
surveyComplete :true,
surveyComplete: true,
loadData: false,
headers: [
{
@@ -160,8 +160,9 @@
this.editedIndex = -1
}, 300)
},
openSurvey(item){
var me = this
openSurvey(item) {
var me = this
console.log(item)
me.$router.push({name: 'survey', params: item});
}

2
src/components/order/OrderPage.vue
View File

@@ -229,7 +229,7 @@
'totalAmount': me.totalAmount
}
me.$router.push({name: 'orderfinish', params: data});
me.$EventBus.$emit('message', JSON.parse(JSON.stringify(data)));
// me.$EventBus.$emit('message', JSON.parse(JSON.stringify(data)));
})
}
},

100
src/components/products/ProductDelete.vue Normal file
View File

@@ -0,0 +1,100 @@
<template>
<v-container>
<v-card>
<v-card-title>상품삭제</v-card-title>
</v-card>
<v-card>
<v-data-table
v-model="selectItem"
:headers="headers"
:items="items"
item-key="name"
show-select
class="elevation-1"
>
</v-data-table>
</v-card>
<v-card>
<div align="right">
<v-btn text
color="red accent-4"
@click="deleteItem"
>삭제
</v-btn>
<v-btn text
color="primary accent-4"
@click="cancel"
>닫기
</v-btn>
</div>
</v-card>
</v-container>
</template>
<script>
export default {
props:{
deleteDialog: Boolean
},
data() {
return {
sortBy: 'id',
headers: [
{
text: '상품 번호',
align: 'left',
sortable: false,
value: 'id',
},
{
text: '상품 이름',
align: 'left',
sortable: false,
value: 'name',
},
{text: '상품 가격', value: 'price'},
{text: '상품 재고량', value: 'stock', align: 'center'},
// {text: '삭제', value: 'Survey', align: 'center'}
],
items: [],
selectItem: {},
}
},
mounted() {
this.getProdList();
},
computed: {
},
methods: {
getProdList() {
var me = this
me.$http.get(`${API_HOST}/products`).then(function (e) {
console.log(e)
me.items = e.data._embedded.products;
me.items.map( item => item.host = API_HOST)
})
},
cancel(){
var me = this
me.$emit('update:deleteDialog', false)
},
deleteItem(){
var me = this
console.log(me.selectItem)
}
},
}
</script>
<style scoped>
</style>

1
src/components/products/ProductDetail.vue
View File

@@ -54,7 +54,6 @@
<br> 상품이름 : {{ selectItem.name }}
<br> 상품가격 : {{ selectItem.price }}
<br> 재고량 : {{selectItem.stock}}
<br> 옵션 :
</div>
</v-col>

5
src/components/products/ProductList.vue
View File

@@ -23,7 +23,7 @@
<v-row>
<v-col
v-for="item in props.items"
:key="item.name"
:key="item.id"
cols="12"
sm="6"
md="4"
@@ -49,7 +49,6 @@
<div align="right">
<v-btn text @click="showDetail(item)"> DETAIL </v-btn>
<v-btn text @click="showBuy(item)"> BUY </v-btn>
</div>
</v-list>
</v-card>
@@ -134,7 +133,6 @@
'Name',
'Price',
'Stock',
'Option',
],
items: [],
selectItem: {},
@@ -155,6 +153,7 @@
me.showBuy(newVal);
})
console.log(this.$route)
},
computed: {
numberOfPages() {

168
src/components/products/ProductRecommend.vue
View File

@@ -1,104 +1,116 @@
<template>
<v-container fluid>
<v-row>
<v-col
v-for="item in items"
:key="item.name"
cols="12"
sm="6"
md="4"
lg="3"
>
<v-card >
<v-card-title class="subheading font-weight-bold">{{ item.name}}</v-card-title>
<v-divider></v-divider>
<v-img src='https://svgsilh.com/svg/1295383-ff9800.svg' aspect-ratio="1.7" contain></v-img>
<v-list dense>
<v-list-item
v-for="(key, index) in filteredKeys"
:key="index"
<v-row>
<v-col
v-for="(list,idx) in recommendList"
:key="list.item.id"
cols="12"
sm="6"
md="4"
lg="3"
v-if="idx<4"
>
<v-list-item-content>{{ key }}:</v-list-item-content>
<v-list-item-content class="align-end" >{{ item[key.toLowerCase()] }}</v-list-item-content>
</v-list-item>
<div align="right">
<v-btn text @click="showDetail(item.name)"> DETAIL </v-btn>
<v-btn text> BUY </v-btn>
</div>
</v-list>
</v-card>
</v-col>
</v-row>
</v-container>
<v-card>
<v-card-title class="subheading font-weight-bold">{{ list.item.name}}</v-card-title>
<v-divider></v-divider>
<v-img :src='host+list.item.imageUrl' aspect-ratio="1.7" contain></v-img>
<v-list dense>
<v-list-item
v-for="(key, index) in filteredKeys"
:key="index"
>
<v-list-item-content>{{ key }}:</v-list-item-content>
<v-list-item-content class="align-end">{{ list.item[key.toLowerCase()] }}</v-list-item-content>
</v-list-item>
<div align="right">
<v-btn text @click="showDetail(list.item.name)"> DETAIL</v-btn>
<v-btn text> BUY</v-btn>
</div>
</v-list>
</v-card>
</v-col>
</v-row>
</v-container>
</template>
<script>
export default {
data () {
data() {
return {
keys: [
'Name',
'Id',
'Price',
'Stock',
'Option',
],
items: [
{
name: 'Frozen',
id:1,
price: 10000,
stock: 6,
option: '',
},
{
name: 'sandwich',
id:2,
price: 20000,
stock: 1,
option: '',
},
{
name: 'Eclair',
id:3,
price: 30000,
stock: 16,
option: '',
},
{
name: 'Cupcake',
id:4,
price: 40000,
stock: 11,
option: '',
},
]
productList: [],
orderList: [],
recommendList: [],
cnt:0,
host:`${API_HOST}`,
}
},
computed: {
filteredKeys () {
return this.keys.filter(key => key !== `Name`&& key !== 'Image')
filteredKeys() {
return this.keys.filter(key => key !== `Name` && key !== 'Image')
},
},
mounted() {
this.getProdReCommendList();
created() {},
async mounted() {
var me = this
var productList = await me.getProductList();
var orderList = await me.getOrderList()
me.productList = productList;
me.orderList = orderList;
me.productList.forEach(function (productVal,idx) {
me.orderList.forEach(function (orderVal,idx) {
if(productVal.id == orderVal.productId){
me.cnt=me.cnt+1;
}
})
let data={
'item':productVal,
'cnt': me.cnt,
}
me.recommendList.push(data);
me.cnt=0;
})
me.recommendList.sort(function(a, b) { // 내림차순
return b['cnt'] - a['cnt'];
});
console.log(me.recommendList)
},
methods: {
getProdReCommendList () {
// var me = this
// me.$http.get('http://localhost:8088/products').then(function(e) {
// console.log();
// me.items=e.data._embedded.products;
// })
getProductList: function () {
var me = this
return new Promise(function (resolve, reject) {
me.$http.get(`${API_HOST}/products`).then(function (e) {
resolve(e.data._embedded.products)
});
});
},
showDetail(val){
this.$router.push('/products/'+val)
getOrderList: function () {
var me = this
return new Promise(function (resolve, reject) {
me.$http.get(`${API_HOST}/mypage/order/${localStorage.getItem('userId')}`).then(function (e) {
resolve(e.data)
});
});
},
updateItemsPerPage (number) {
sortList:function(){
},
showDetail(val) {
this.$router.push('/products/' + val)
},
updateItemsPerPage(number) {
this.itemsPerPage = number
},
},

56
src/components/products/ProductRepository.vue
View File

@@ -1,4 +1,4 @@
<template>
<template style="margin: 10px">
<v-container>
<v-card
color="amber"
@@ -6,20 +6,26 @@
<v-card-title>상품등록</v-card-title>
</v-card>
<v-card>
<v-card-text style="width: auto">
<v-img
src="http://localhost:8088/goods/img/TV.jpg"
>
</v-img>
<v-card >
<v-card flat >
<v-row>
<v-img
contain
style="height: 300px; width: 300px; position: center"
:src='this.host+this.img'
>
</v-img>
</v-row>
</v-card>
<v-card-text>
<v-row cols="8" md="4">
<v-text-field
v-model="name"
label="상품명"
placeholder="Name"
outlined
required
></v-text-field>
</v-row>
@@ -29,6 +35,7 @@
label="상품 가격"
placeholder="Price"
outlined
required
numberonly
></v-text-field>
@@ -37,19 +44,19 @@
label="상품 재고량"
placeholder="Stock"
outlined
required
></v-text-field>
</v-row>
<v-row cols="8" md="6">
<v-file-input
accept="image/png, image/jpeg, image/bmp"
placeholder="상품 이미지 (png, jpeg, bmp 가능)"
prepend-icon="mdi-camera"
label="이미지"
></v-file-input>
<v-row >
<v-text-field
v-model="img">
<template v-slot:label>
What Image you want? <v-icon style="vertical-align: middle">find_in_page</v-icon>
</template>
</v-text-field>
</v-row>
</v-card-text>
</v-card>
@@ -76,9 +83,15 @@
name:'',
price:'',
stock:'',
src:'/goods/img/TV.jpg'
img:'/goods/img/TV.jpg',
host:`${API_HOST}`
}),
watch:{
img:function(newVal){
this.img=newVal
}
},
methods: {
getComponent(componentName) {
let component = null
@@ -93,20 +106,17 @@
},
register(){
var me = this
var app = me.getComponent('App')
let item={
'name':me.name,
'price': me.price,
'stock': me.stock,
'imageUrl': me.src
}
me.$http.post(`http://localhost:8085/products`, item).then(function (e) {
console.log("post Item")
console.log(e)
app.productSnackbar = true
me.$http.post(`${API_HOST}/products`, item).then(function (e) {
me.$emit('update:repositoryDialog', false)
})
},
cancel(){
var me = this

2
src/main.js
View File

@@ -23,6 +23,7 @@ import OrderPage from './components/order/OrderPage'
import Survey from "./components/marketing/Survey";
import SurveyForm from "./components/marketing/SurveyForm";
import ProductRepository from "./components/products/ProductRepository";
import ProductDelete from "./components/products/ProductDelete";
@@ -50,6 +51,7 @@ Vue.component('UserInfo', UserInfo)
Vue.component('DeliveryStatus', DeliveryStatus)
Vue.component('ProductSimple', ProductSimple)
Vue.component('ProductRepository',ProductRepository)
Vue.component('ProductDelete',ProductDelete)
Vue.config.productionTip = false