Merge branch 'frontend/making-uploaded-images-responsive' into 'master'

Frontend/making uploaded images responsive

See merge request CIEFWorldwideSdnBhd/exchange!56
This commit is contained in:
Jack Goh
2018-07-05 01:45:07 +00:00
9 changed files with 98 additions and 18 deletions
+1
View File
@@ -15,4 +15,5 @@ Homestead.yaml
npm-debug.log
yarn-error.log
.env
vendor/composer/autoload_static.php
package-lock.json
-3
View File
@@ -1,3 +0,0 @@
*.sqlite
vendor/composer/autoload_static.php
package-lock.json
@@ -20,7 +20,7 @@
</div>
<el-row :gutter="12" type="flex">
<el-col :span="12">
<a target=" _blank" href="#">
<a target=" _blank" :href="booking_details.user_po_path">
<img v-bind:src="booking_details.user_po_path" class="image">
</a>
</el-col>
@@ -36,7 +36,7 @@
</div>
<el-row :gutter="12" type="flex">
<el-col :span="12">
<a target=" _blank" href="#">
<a target=" _blank" :href="booking_details.china_bankslip_path">
<img v-bind:src="booking_details.china_bankslip_path" class="image">
</a>
</el-col>
@@ -50,8 +50,10 @@
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
</div>
<el-row :gutter="12" type="flex">
<el-col :span="12">
<el-col :span="12">
<a target="_blank" :href="booking_details.invoice_path">
<img v-bind:src="booking_details.invoice_path" class="image">
</a>
</el-col>
</el-row>
</el-card>
@@ -262,7 +264,9 @@
</div>
<el-row :gutter="12">
<el-col :span="22" style="text-align:center">
<img v-bind:src="booking_details.user_bankslip_path" class="image">
<a target="_blank" :href="booking_details.user_bankslip_path">
<img v-bind:src="booking_details.user_bankslip_path" class="image">
</a>
</el-col>
</el-row>
</el-card>
@@ -273,6 +277,17 @@
.booking-details {
font-weight: bold;
}
.image {
border: 1px solid #ddd;
border-radius: 4px;
margin-left: auto;
margin-right: auto;
width: 150px;
display: block;
}
.image:hover {
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}
</style>
<script>
import VueCountdown from '@dmaksimovic/vue-countdown'
@@ -215,7 +215,9 @@
</div>
<el-row :gutter="12">
<el-col :span="22" style="text-align:center">
<img v-bind:src="booking_details.user_bankslip_path" class="image">
<a target="_blank" :href="booking_details.user_bankslip_path">
<img v-bind:src="booking_details.user_bankslip_path" class="image">
</a>
</el-col>
</el-row>
</el-card>
@@ -235,6 +237,17 @@
.booking-details {
font-weight: bold;
}
.image {
border: 1px solid #ddd;
border-radius: 4px;
margin-left: auto;
margin-right: auto;
width: 150px;
display: block;
}
.image:hover {
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}
</style>
<script>
import ProgressTrack from '~/components/AdminProgressTrack'
@@ -208,7 +208,7 @@
<el-upload class="upload-demo" :action="'/api/booking/' + booking_id + '/upload-china-bankslip'" :on-preview="handlePreview"
:on-remove="handleRemove" :multiple="false" list-type="picture">
<el-button size="small" type="primary">Click to upload</el-button>
<div slot="tip" class="el-upload__tip">jpg/png files with a size less than 3mb</div>
<div slot="tip" class="el-upload__tip">jpg/png files with a size less than 3 MB</div>
</el-upload>
<br>
@@ -219,7 +219,9 @@
</div>
<el-row :gutter="12" type="flex">
<el-col :span="12">
<a target="_blank" :href="booking_details.user_po_path">
<img v-bind:src="booking_details.user_po_path" class="image">
</a>
</el-col>
</el-row>
</el-card>
@@ -231,6 +233,17 @@
.booking-details {
font-weight: bold;
}
.image {
border: 1px solid #ddd;
border-radius: 4px;
margin-left: auto;
margin-right: auto;
width: 150px;
display: block;
}
.image:hover {
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}
</style>
<script>
import ProgressTrack from '~/components/AdminProgressTrack'
@@ -201,16 +201,20 @@
<!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
</div>
<el-row :gutter="12">
<el-col :span="22" style="text-align:center">
<a target="_blank" :href="booking_details.user_bankslip_path">
<img v-bind:src="booking_details.user_bankslip_path" class="image">
</el-col>
</a>
<!--<el-col :span="22" style="text-align:center">
<img v-bind:src="booking_details.user_bankslip_path" class="image">
</el-col>-->
</el-row>
</el-card>
<el-card class="box-card">
<el-row :gutter="12">
<el-col :span="22" style="text-align:center">
<el-button :loading="loading_btn" @click="approveUserSlip" type="success">Aprrove</el-button>
<el-button :loading="loading_btn" @click="approveUserSlip" type="success">Approve</el-button>
<el-button :loading="loading_btn" @click="rejectDialogVisible = true" type="danger">Reject</el-button>
</el-col>
</el-row>
@@ -239,6 +243,17 @@
.booking-details {
font-weight: bold;
}
.image {
border: 1px solid #ddd;
border-radius: 4px;
margin-left: auto;
margin-right: auto;
width: 150px;
display: block;
}
.image:hover {
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}
</style>
<script>
import ProgressTrack from '~/components/AdminProgressTrack'
+17 -4
View File
@@ -20,7 +20,7 @@
</div>
<el-row :gutter="12" type="flex">
<el-col :span="12">
<a target=" _blank" href="#">
<a target=" _blank" :href="booking_details.user_po_path">
<img v-bind:src="booking_details.user_po_path" class="image">
</a>
</el-col>
@@ -36,7 +36,7 @@
</div>
<el-row :gutter="12" type="flex">
<el-col :span="12">
<a target=" _blank" href="#">
<a target=" _blank" :href="booking_details.china_bankslip_path">
<img v-bind:src="booking_details.china_bankslip_path" class="image">
</a>
</el-col>
@@ -51,7 +51,7 @@
</div>
<el-row :gutter="12" type="flex">
<el-col :span="12">
<img width="100%" height="100%" src="http://via.placeholder.com/700x800">
<img width="100%" height="100%" src="http://via.placeholder.com/900x1615">
</el-col>
</el-row>
</el-card>
@@ -262,7 +262,9 @@
</div>
<el-row :gutter="12">
<el-col :span="22" style="text-align:center">
<img v-bind:src="booking_details.user_bankslip_path" class="image">
<a target="_blank" :href="booking_details.user_bankslip_path">
<img v-bind:src="booking_details.user_bankslip_path" class="image">
</a>
</el-col>
</el-row>
</el-card>
@@ -273,6 +275,17 @@
.booking-details {
font-weight: bold;
}
.image {
border: 1px solid #ddd;
border-radius: 4px;
margin-left: auto;
margin-right: auto;
width: 150px;
display: block;
}
.image:hover {
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}
</style>
<script>
import VueCountdown from '@dmaksimovic/vue-countdown'
+15 -2
View File
@@ -48,7 +48,7 @@
</div>
<el-row :gutter="12" type="flex">
<el-col :span="12">
<a href="https://placeholder.com">
<a target="_blank" :href="booking_details.china_bankslip_path">
<img v-bind:src="booking_details.china_bankslip_path" class="image">
</a>
</el-col>
@@ -231,7 +231,9 @@
</div>
<el-row :gutter="12">
<el-col :span="22" style="text-align:center">
<img v-bind:src="booking_details.user_bankslip_path" class="image">
<a target="_blank" :href="booking_details.user_bankslip_path">
<img v-bind:src="booking_details.user_bankslip_path" class="image">
</a>
</el-col>
</el-row>
</el-card>
@@ -242,6 +244,17 @@
.booking-details {
font-weight: bold;
}
.image {
border: 1px solid #ddd;
border-radius: 4px;
margin-left: auto;
margin-right: auto;
width: 150px;
display: block;
}
.image:hover {
box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}
</style>
<script>
import VueCountdown from '@dmaksimovic/vue-countdown'