Merge branch 'OLFBP-885' into OLFBP-885
This commit is contained in:
Chad Derya
commit
f3ee6a38b2
|
|
@ -56,6 +56,7 @@
|
|||
"js-cookie": "2.2.0",
|
||||
"jsonlint": "1.6.3",
|
||||
"jszip": "3.2.1",
|
||||
"moment": "^2.24.0",
|
||||
"normalize.css": "7.0.0",
|
||||
"nprogress": "0.2.0",
|
||||
"path-to-regexp": "2.4.0",
|
||||
|
|
|
|||
|
|
@ -7,6 +7,10 @@ export function fetchList(query) {
|
|||
return axios.get(`${apiUrl}/account/search`, { params: query })
|
||||
}
|
||||
|
||||
export function fetchRelationships(query) {
|
||||
return axios.get(`${apiUrl}/account/relationship`, { params: query })
|
||||
}
|
||||
|
||||
export function fetchAccount(id) {
|
||||
return axios.get(`${apiUrl}/account/${id}`)
|
||||
}
|
||||
|
|
@ -14,17 +18,23 @@ export function fetchAccount(id) {
|
|||
export function createAccount(data) {
|
||||
const dto = {
|
||||
'name': data.name,
|
||||
'fullName': data.fullName || data.name,
|
||||
'type': data.type,
|
||||
'email': data.email,
|
||||
'platform': store.state.platform,
|
||||
'phone': data.phone,
|
||||
'status': parseInt(data.status),
|
||||
'orderConfirmationEmail': data.orderConfirmationEmail,
|
||||
'addressLine1': data.address.addressLine1,
|
||||
'addressLine2': data.address.addressLine2,
|
||||
'county': data.address.county,
|
||||
'country': data.address.country,
|
||||
'postCode': data.address.postCode
|
||||
'postCode': data.address.postCode,
|
||||
'fuelRestrictions': data.restrictions.fuels,
|
||||
'terminalRestrictions': data.restrictions.terminals,
|
||||
'paymentTermsRestrictions': data.restrictions.paymentTerms,
|
||||
'liftingPeriodRestrictions': data.restrictions.liftingPeriods,
|
||||
'sendOrderCompleteAlert': data.sendOrderCompleteAlert,
|
||||
'orderCompleteAlertText': data.orderCompleteAlertText
|
||||
}
|
||||
|
||||
return axios.post(`${apiUrl}/account/create`, dto)
|
||||
|
|
@ -33,17 +43,23 @@ export function createAccount(data) {
|
|||
export function updateAccount(data) {
|
||||
const dto = {
|
||||
'name': data.name,
|
||||
'fullName': data.fullName || data.name,
|
||||
'type': data.type,
|
||||
'email': data.email,
|
||||
'platform': data.platform,
|
||||
'phone': data.phone,
|
||||
'status': parseInt(data.status),
|
||||
'orderConfirmationEmail': data.orderConfirmationEmail,
|
||||
'addressLine1': data.address.addressLine1,
|
||||
'addressLine2': data.address.addressLine2,
|
||||
'county': data.address.county,
|
||||
'country': data.address.country,
|
||||
'postCode': data.address.postCode
|
||||
'postCode': data.address.postCode,
|
||||
'fuelRestrictions': data.restrictions.fuels,
|
||||
'terminalRestrictions': data.restrictions.terminals,
|
||||
'paymentTermsRestrictions': data.restrictions.paymentTerms,
|
||||
'liftingPeriodRestrictions': data.restrictions.liftingPeriods,
|
||||
'sendOrderCompleteAlert': data.sendOrderCompleteAlert,
|
||||
'orderCompleteAlertText': data.orderCompleteAlertText
|
||||
}
|
||||
|
||||
return axios.put(`${apiUrl}/account/${data.id}`, dto)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,31 @@
|
|||
import axios from 'axios'
|
||||
|
||||
const FAQEndpointUrl = 'https://metadata.service.development.therig.onlinefuelslabs.io'
|
||||
|
||||
export function fetchList(query) {
|
||||
return axios.get(`${FAQEndpointUrl}/faqs`, { params: query })
|
||||
}
|
||||
|
||||
export function fetchFaq(id) {
|
||||
return axios.get(`${FAQEndpointUrl}/faqs/${id}?platform=OLFDE`)
|
||||
}
|
||||
|
||||
export function createFaq(data) {
|
||||
const dto = __dataToDTO(data)
|
||||
return axios.post(`${FAQEndpointUrl}/faqs`, dto)
|
||||
}
|
||||
|
||||
export function updateFaq(data) {
|
||||
const dto = __dataToDTO(data)
|
||||
return axios.put(`${FAQEndpointUrl}/faqs/${data._id}`, dto)
|
||||
}
|
||||
|
||||
function __dataToDTO(data) {
|
||||
return {
|
||||
'question': data.question,
|
||||
'answer': data.answer,
|
||||
'order': parseInt(data.order),
|
||||
'status': data.status,
|
||||
'platform': 'OLFDE'
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
import axios from 'axios'
|
||||
|
||||
const LiftingPeriodEndpointUrl = 'https://metadata.service.development.therig.onlinefuelslabs.io'
|
||||
|
||||
export function fetchList(query) {
|
||||
return axios.get(`${LiftingPeriodEndpointUrl}/lifting-periods`, { params: query })
|
||||
}
|
||||
|
||||
export function fetchLiftingPeriod(id) {
|
||||
return axios.get(`${LiftingPeriodEndpointUrl}/lifting-periods/${id}?platform=OLFDE`)
|
||||
}
|
||||
|
||||
export function createLiftingPeriod(data) {
|
||||
const dto = {
|
||||
'name': data.name,
|
||||
'days': Number(data.days),
|
||||
'platform': data.platform || 'OLFDE'
|
||||
}
|
||||
|
||||
return axios.post(`${LiftingPeriodEndpointUrl}/lifting-periods`, dto)
|
||||
}
|
||||
|
||||
export function updateLiftingPeriod(data) {
|
||||
const dto = {
|
||||
'name': data.name,
|
||||
'days': Number(data.days),
|
||||
'platform': data.platform || 'OLFDE'
|
||||
}
|
||||
|
||||
return axios.put(`${LiftingPeriodEndpointUrl}/lifting-periods/${data._id}`, dto)
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
import axios from 'axios'
|
||||
|
||||
const apiUrl = 'https://orders.service.development.therig.onlinefuelslabs.io'
|
||||
|
||||
export function fetchList(query) {
|
||||
query.platform = 'OLFDE'
|
||||
query.accountId = '5caf6ca5bca1f9001212b6ec'
|
||||
return axios.get(`${apiUrl}/orders`, { params: query })
|
||||
}
|
||||
|
||||
export function fetchOrder(id) {
|
||||
return axios.get(`${apiUrl}/orders/${id}`)
|
||||
}
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
import axios from 'axios'
|
||||
|
||||
const PaymentTermsEndpointUrl = 'https://metadata.service.development.therig.onlinefuelslabs.io'
|
||||
|
||||
export function fetchList(query) {
|
||||
return axios.get(`${PaymentTermsEndpointUrl}/payment-terms`, { params: query })
|
||||
}
|
||||
|
||||
export function fetchPaymentTerm(id) {
|
||||
return axios.get(`${PaymentTermsEndpointUrl}/payment-terms/${id}?platform=OLFDE`)
|
||||
}
|
||||
|
||||
export function createPaymentTerm(data) {
|
||||
const dto = {
|
||||
'name': data.name,
|
||||
'days': Number(data.days),
|
||||
'platform': data.platform || 'OLFDE'
|
||||
}
|
||||
|
||||
return axios.post(`${PaymentTermsEndpointUrl}/payment-terms`, dto)
|
||||
}
|
||||
|
||||
export function updatePaymentTerm(data) {
|
||||
const dto = {
|
||||
'name': data.name,
|
||||
'days': Number(data.days),
|
||||
'platform': data.platform || 'OLFDE'
|
||||
}
|
||||
|
||||
return axios.put(`${PaymentTermsEndpointUrl}/payment-terms/${data._id}`, dto)
|
||||
}
|
||||
|
|
@ -37,6 +37,10 @@ function __dataToDTO(data) {
|
|||
'county': data.address.county,
|
||||
'country': data.address.country,
|
||||
'postCode': data.address.postCode,
|
||||
'identifier': data.identifier
|
||||
'identifier': data.identifier,
|
||||
'contactNumber': data.contactNumber,
|
||||
'fullName': data.fullName,
|
||||
'meta': data.meta,
|
||||
'regionId': data.region_id
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -62,6 +62,16 @@ export function updateUser(data) {
|
|||
return axios.put(`${apiUrl}/user/${data.id}`, dto)
|
||||
}
|
||||
|
||||
export function sendPasswordReset(email, type) {
|
||||
const dto = {
|
||||
email,
|
||||
type,
|
||||
platform: 'OLFDE'
|
||||
}
|
||||
|
||||
return axios.post(`${apiUrl}/user/password/send-reset-link`, dto)
|
||||
}
|
||||
|
||||
function __dataToDTO(data) {
|
||||
return {
|
||||
'firstName': data.firstName,
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@ export default {
|
|||
},
|
||||
menubar: {
|
||||
type: String,
|
||||
default: 'file edit insert view format table'
|
||||
default: ''
|
||||
},
|
||||
height: {
|
||||
type: [Number, String],
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
// Detail plugins list see https://www.tinymce.com/docs/plugins/
|
||||
// Custom builds see https://www.tinymce.com/download/custom-builds/
|
||||
|
||||
const plugins = ['advlist anchor autolink autosave code codesample colorpicker colorpicker contextmenu directionality emoticons fullscreen hr image imagetools insertdatetime link lists media nonbreaking noneditable pagebreak paste preview print save searchreplace spellchecker tabfocus table template textcolor textpattern visualblocks visualchars wordcount']
|
||||
// const plugins = ['advlist anchor autolink autosave code codesample colorpicker colorpicker contextmenu directionality emoticons fullscreen hr image imagetools insertdatetime link lists media nonbreaking noneditable pagebreak paste preview print save searchreplace spellchecker tabfocus table template textcolor textpattern visualblocks visualchars wordcount']
|
||||
const plugins = []
|
||||
|
||||
export default plugins
|
||||
|
|
|
|||
|
|
@ -134,6 +134,12 @@ export const asyncRoutes = [
|
|||
component: () => import('@/views/accounts/list'),
|
||||
name: 'SellerAccountList',
|
||||
meta: { title: 'Seller Account List', icon: 'list', type: 'seller' }
|
||||
},
|
||||
{
|
||||
path: 'relationship-list',
|
||||
component: () => import('@/views/accounts/relationships'),
|
||||
name: 'RelationshipMatrix',
|
||||
meta: { title: 'Relationships', icon: 'list' }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
@ -244,7 +250,7 @@ export const asyncRoutes = [
|
|||
path: 'create',
|
||||
component: () => import('@/views/products/create'),
|
||||
name: 'CreateProduct',
|
||||
meta: { title: 'Create Products', icon: 'edit' }
|
||||
meta: { title: 'Create Product', icon: 'edit' }
|
||||
},
|
||||
{
|
||||
path: 'edit/:id',
|
||||
|
|
@ -261,6 +267,130 @@ export const asyncRoutes = [
|
|||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/lifting-periods',
|
||||
component: Layout,
|
||||
redirect: '/lifting-periods/list',
|
||||
name: 'LiftingPeriods',
|
||||
meta: {
|
||||
title: 'Lifting Periods',
|
||||
icon: 'example'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'create',
|
||||
component: () => import('@/views/liftingperiods/create'),
|
||||
name: 'CreateLiftingPeriod',
|
||||
meta: { title: 'Create Lifting Period', icon: 'edit' }
|
||||
},
|
||||
{
|
||||
path: 'edit/:id',
|
||||
component: () => import('@/views/liftingperiods/edit'),
|
||||
name: 'EditLiftingPeriod',
|
||||
meta: { title: 'Edit Lifting Period', noCache: true, activeMenu: '/liftingperiods/list' },
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: 'list',
|
||||
component: () => import('@/views/liftingperiods/list'),
|
||||
name: 'LiftingPeriodList',
|
||||
meta: { title: 'Lifting Period List', icon: 'list' }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/payment-terms',
|
||||
component: Layout,
|
||||
redirect: '/payment-terms/list',
|
||||
name: 'PaymentTerms',
|
||||
meta: {
|
||||
title: 'Payment Terms',
|
||||
icon: 'example'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'create',
|
||||
component: () => import('@/views/paymentterms/create'),
|
||||
name: 'CreatePaymentTerm',
|
||||
meta: { title: 'Create Payment Terms', icon: 'edit' }
|
||||
},
|
||||
{
|
||||
path: 'edit/:id',
|
||||
component: () => import('@/views/paymentterms/edit'),
|
||||
name: 'EditPaymentTerm',
|
||||
meta: { title: 'Edit Payment Terms', noCache: true, activeMenu: '/paymentterms/list' },
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: 'list',
|
||||
component: () => import('@/views/paymentterms/list'),
|
||||
name: 'LiftingPaymentTerm',
|
||||
meta: { title: 'Payment Terms List', icon: 'list' }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/faqs',
|
||||
component: Layout,
|
||||
redirect: '/faqs/list',
|
||||
name: 'FAQs',
|
||||
meta: {
|
||||
title: 'FAQs',
|
||||
icon: 'example'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'create',
|
||||
component: () => import('@/views/faqs/create'),
|
||||
name: 'CreateFAQ',
|
||||
meta: { title: 'Create FAQ', icon: 'edit' }
|
||||
},
|
||||
{
|
||||
path: 'edit/:id',
|
||||
component: () => import('@/views/faqs/edit'),
|
||||
name: 'EditFAQs',
|
||||
meta: { title: 'Edit FAQ', noCache: true, activeMenu: '/faqs/list' },
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: 'list',
|
||||
component: () => import('@/views/faqs/list'),
|
||||
name: 'FAQList',
|
||||
meta: { title: 'FAQ List', icon: 'list' }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/orders',
|
||||
component: Layout,
|
||||
redirect: '/orders/list',
|
||||
name: 'Orders',
|
||||
meta: {
|
||||
title: 'Orders',
|
||||
icon: 'example'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'create',
|
||||
component: () => import('@/views/orders/create'),
|
||||
name: 'CreateOrder',
|
||||
meta: { title: 'Create Order', icon: 'edit' }
|
||||
},
|
||||
{
|
||||
path: 'edit/:id',
|
||||
component: () => import('@/views/orders/edit'),
|
||||
name: 'EditOrder',
|
||||
meta: { title: 'Edit Order', noCache: true, activeMenu: '/orders/list' },
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: 'list',
|
||||
component: () => import('@/views/orders/list'),
|
||||
name: 'OrderList',
|
||||
meta: { title: 'Order List', icon: 'list' }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/permission',
|
||||
component: Layout,
|
||||
|
|
|
|||
|
|
@ -22,8 +22,15 @@
|
|||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Name" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.name" placeholder="Account Name" />
|
||||
<el-form-item label-width="120px" label="Display Name" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.name" placeholder="Display Name" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Full Name" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.fullName" placeholder="Full Name" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
|
@ -86,6 +93,65 @@
|
|||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="postForm.type === 'seller'">
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Send Order Complete Alert" class="postInfo-container-item">
|
||||
<el-switch v-model="postForm.sendOrderCompleteAlert" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="postForm.type === 'seller' && postForm.sendOrderCompleteAlert">
|
||||
<el-col :span="20">
|
||||
<el-form-item label-width="120px" label="Order Complete Email Text" class="postInfo-container-item">
|
||||
<tinymce v-model="postForm.orderCompleteAlertText" :height="150" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row v-if="postForm.type === 'seller'">
|
||||
<el-col :span="12">
|
||||
<el-form-item label-width="120px" label="Fuel Restriction" class="postInfo-container-item">
|
||||
<el-transfer
|
||||
v-model="postForm.restrictions.fuels"
|
||||
:titles="['Disabled', 'Enabled']"
|
||||
:data="fuelsAvailable"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="postForm.type === 'seller'">
|
||||
<el-col :span="12">
|
||||
<el-form-item label-width="120px" label="Terminal Restriction" class="postInfo-container-item">
|
||||
<el-transfer
|
||||
v-model="postForm.restrictions.terminals"
|
||||
:titles="['Disabled', 'Enabled']"
|
||||
:data="terminalsAvailable"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="postForm.type === 'seller'">
|
||||
<el-col :span="12">
|
||||
<el-form-item label-width="120px" label="Lifting Restriction" class="postInfo-container-item">
|
||||
<el-transfer
|
||||
v-model="postForm.restrictions.liftingPeriods"
|
||||
:titles="['Disabled', 'Enabled']"
|
||||
:data="liftingPeriodsAvailable"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="postForm.type === 'seller'">
|
||||
<el-col :span="12">
|
||||
<el-form-item label-width="120px" label="Payment Restriction" class="postInfo-container-item">
|
||||
<el-transfer
|
||||
v-model="postForm.restrictions.paymentTerms"
|
||||
:titles="['Disabled', 'Enabled']"
|
||||
:data="paymentTermsAvailable"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Status" class="postInfo-container-item">
|
||||
|
|
@ -109,6 +175,11 @@
|
|||
<script>
|
||||
import Sticky from '@/components/Sticky' // 粘性header组件
|
||||
import { fetchAccount, updateAccount, createAccount } from '@/api/account'
|
||||
import Tinymce from '@/components/Tinymce'
|
||||
const fetchFuelList = require('@/api/product').fetchList
|
||||
const fetchTerminalList = require('@/api/terminal').fetchList
|
||||
const fetchLiftingPeriodsList = require('@/api/liftingPeriod').fetchList
|
||||
const fetchPaymentTermsList = require('@/api/paymentTerm').fetchList
|
||||
|
||||
const defaultForm = {
|
||||
id: '',
|
||||
|
|
@ -116,6 +187,14 @@ const defaultForm = {
|
|||
phone: '',
|
||||
email: '',
|
||||
orderConfirmationEmail: '',
|
||||
sendOrderCompleteAlert: false,
|
||||
orderCompleteAlertText: '',
|
||||
restrictions: {
|
||||
fuels: [],
|
||||
terminals: [],
|
||||
liftingPeriods: [],
|
||||
paymentTerms: []
|
||||
},
|
||||
address: {
|
||||
addressLine1: '',
|
||||
addressLine2: '',
|
||||
|
|
@ -127,7 +206,7 @@ const defaultForm = {
|
|||
|
||||
export default {
|
||||
name: 'AccountDetail',
|
||||
components: { Sticky },
|
||||
components: { Sticky, Tinymce },
|
||||
props: {
|
||||
isEdit: {
|
||||
type: Boolean,
|
||||
|
|
@ -156,7 +235,12 @@ export default {
|
|||
// content: [{ validator: validateRequire }],
|
||||
// source_uri: [{ validator: validateSourceUri, trigger: 'blur' }]
|
||||
},
|
||||
tempRoute: {}
|
||||
tempRoute: {},
|
||||
terminals: [],
|
||||
fuels: [],
|
||||
paymentTerms: [],
|
||||
liftingPeriods: [],
|
||||
fuelRestrictions: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -171,6 +255,58 @@ export default {
|
|||
set(val) {
|
||||
this.postForm.display_time = new Date(val)
|
||||
}
|
||||
},
|
||||
fuelsAvailable: {
|
||||
get() {
|
||||
return this.fuels.map(f => {
|
||||
return {
|
||||
label: f.name,
|
||||
key: f._id
|
||||
}
|
||||
})
|
||||
},
|
||||
set(value) {
|
||||
this.postForm.restrictions.fuels = value
|
||||
}
|
||||
},
|
||||
terminalsAvailable: {
|
||||
get() {
|
||||
return this.terminals.map(f => {
|
||||
return {
|
||||
label: f.name,
|
||||
key: f._id
|
||||
}
|
||||
})
|
||||
},
|
||||
set(value) {
|
||||
this.postForm.restrictions.terminals = value
|
||||
}
|
||||
},
|
||||
liftingPeriodsAvailable: {
|
||||
get() {
|
||||
return this.liftingPeriods.map(f => {
|
||||
return {
|
||||
label: f.name,
|
||||
key: f._id
|
||||
}
|
||||
})
|
||||
},
|
||||
set(value) {
|
||||
this.postForm.restrictions.liftingPeriods = value
|
||||
}
|
||||
},
|
||||
paymentTermsAvailable: {
|
||||
get() {
|
||||
return this.paymentTerms.map(f => {
|
||||
return {
|
||||
label: f.name,
|
||||
key: f._id
|
||||
}
|
||||
})
|
||||
},
|
||||
set(value) {
|
||||
this.postForm.restrictions.paymentTerms = value
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
|
@ -181,6 +317,21 @@ export default {
|
|||
this.postForm = Object.assign({}, defaultForm)
|
||||
}
|
||||
|
||||
// Fetch the fuels and terminals, to be used as part of the restriction process
|
||||
const requestPromises = [
|
||||
fetchFuelList({ platform: 'OLFDE' }),
|
||||
fetchTerminalList({ platform: 'OLFDE' }),
|
||||
fetchLiftingPeriodsList({ platform: 'OLFDE' }),
|
||||
fetchPaymentTermsList({ platform: 'OLFDE' })
|
||||
]
|
||||
|
||||
Promise.all(requestPromises).then((responses) => {
|
||||
this.fuels = responses[0].data.fuels
|
||||
this.terminals = responses[1].data.terminals
|
||||
this.liftingPeriods = responses[2].data.liftingPeriods
|
||||
this.paymentTerms = responses[3].data.paymentTerms
|
||||
})
|
||||
|
||||
// Why need to make a copy of this.$route here?
|
||||
// Because if you enter this page and quickly switch tag, may be in the execution of the setTagsViewTitle function, this.$route is no longer pointing to the current page
|
||||
// https://github.com/PanJiaChen/vue-element-admin/issues/1221
|
||||
|
|
@ -189,7 +340,35 @@ export default {
|
|||
methods: {
|
||||
fetchData(id) {
|
||||
fetchAccount(id).then(response => {
|
||||
this.postForm = response.data
|
||||
const account = response.data
|
||||
console.dir(account)
|
||||
|
||||
if (!account.restrictions) {
|
||||
account.restrictions = {
|
||||
fuels: [],
|
||||
terminals: [],
|
||||
paymentTerms: [],
|
||||
liftingPeriods: []
|
||||
}
|
||||
}
|
||||
|
||||
if (account.restrictions.fuels.length === 0) {
|
||||
account.restrictions.fuels = this.fuels.map(f => f._id)
|
||||
}
|
||||
|
||||
if (account.restrictions.terminals.length === 0) {
|
||||
account.restrictions.terminals = this.terminals.map(f => f._id)
|
||||
}
|
||||
|
||||
if (account.restrictions.paymentTerms != null && account.restrictions.paymentTerms.length === 0) {
|
||||
account.restrictions.paymentTerms = this.paymentTerms.map(f => f._id)
|
||||
}
|
||||
|
||||
if (account.restrictions.liftingPeriods != null && account.restrictions.liftingPeriods.length === 0) {
|
||||
account.restrictions.liftingPeriods = this.liftingPeriods.map(f => f._id)
|
||||
}
|
||||
|
||||
this.postForm = account
|
||||
|
||||
// // set tagsview title
|
||||
this.setTagsViewTitle()
|
||||
|
|
@ -207,16 +386,19 @@ export default {
|
|||
},
|
||||
setPageTitle() {
|
||||
const title = 'Edit Account'
|
||||
document.title = `${title} - ${this.postForm.id}`
|
||||
document.title = `${title} - ${this.postForm.name}`
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs.postForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
|
||||
// Make a clone of the object
|
||||
const accountToSave = Object.assign({}, this.postForm)
|
||||
|
||||
// Save the account
|
||||
const methodToCall = this.isEdit ? updateAccount : createAccount
|
||||
methodToCall(this.postForm).then((r) => {
|
||||
methodToCall(accountToSave).then((r) => {
|
||||
this.$notify({
|
||||
title: 'Success',
|
||||
message: 'Account Saved',
|
||||
|
|
|
|||
|
|
@ -15,15 +15,15 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Email" width="250">
|
||||
<el-table-column align="center" label="Full Name" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.email }}</span>
|
||||
<span>{{ scope.row.fullName || scope.row.name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Order Confirmation Email" width="200">
|
||||
<el-table-column align="center" label="Email" width="250">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.orderConfirmationEmail }}</span>
|
||||
<span>{{ scope.row.email }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,97 @@
|
|||
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<el-table v-loading="listLoading" :data="buyerAccounts" border fit style="width: 100%">
|
||||
|
||||
<el-table-column label="X" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-for="seller in sellerAccounts" :key="seller._id" align="center" :label="seller.name">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="relationshipMatrix[`${buyerAccounts[scope.$index].id}-${seller.id}`]">
|
||||
|
||||
<span style="color: green">B: Enabled<br></span>
|
||||
|
||||
<span v-if="relationshipMatrix[`${buyerAccounts[scope.$index].id}-${seller.id}`].other.enabled_spot" style="color: green">S: Enabled<br></span>
|
||||
<span v-else style="color: red">S: Disabled<br></span>
|
||||
</span>
|
||||
<span v-else style="color: red;">
|
||||
No Relationship
|
||||
<br>
|
||||
<br>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList, fetchRelationships } from '@/api/account'
|
||||
|
||||
export default {
|
||||
name: 'RelationshipList',
|
||||
data() {
|
||||
return {
|
||||
sellerAccounts: [],
|
||||
buyerAccounts: [],
|
||||
relationshipMatrix: [],
|
||||
originalList: null,
|
||||
list: null,
|
||||
total: 0,
|
||||
listLoading: false,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
buyerAccountId: '',
|
||||
sellerAccountId: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.listQuery.platform = 'OLFDE'
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getRemoteAccountList(query) {
|
||||
query = {}
|
||||
query.platform = 'OLFDE'
|
||||
query.limit = 100
|
||||
},
|
||||
getList() {
|
||||
Promise.all([fetchRelationships({ platform: 'OLFDE' }), fetchList({ platform: 'OLFDE', limit: 100 })]).then((results) => {
|
||||
const allRelationships = results[0].data.relationships
|
||||
this.sellerAccounts = results[1].data.docs.filter(a => a.type === 'seller').map(v => { return { name: v.name, id: v._id } })
|
||||
this.buyerAccounts = results[1].data.docs.filter(a => a.type === 'buyer').map(v => { return { name: v.name, id: v._id } })
|
||||
|
||||
// Map the seller accounts
|
||||
const relationshipData = []
|
||||
allRelationships.forEach((a) => {
|
||||
relationshipData[`${a.buyer.account_id}-${a.other.account_id}`] = a
|
||||
})
|
||||
this.relationshipMatrix = relationshipData
|
||||
})
|
||||
},
|
||||
resetFilter() {
|
||||
},
|
||||
handleFilter() {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,230 @@
|
|||
<template>
|
||||
<div class="createProduct-container">
|
||||
<el-form ref="postForm" :model="postForm" :rules="rules" class="form-container">
|
||||
|
||||
<sticky :z-index="10" :class-name="'sub-navbar '+postForm.status">
|
||||
<el-button v-loading="loading" style="margin-left: 10px;" type="success" @click="submitForm">
|
||||
Save
|
||||
</el-button>
|
||||
</sticky>
|
||||
|
||||
<div class="createPost-main-container">
|
||||
|
||||
<el-row>
|
||||
<el-col :span="20">
|
||||
<div class="postInfo-container">
|
||||
<el-row v-if="isEdit">
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Id" class="postInfo-container-item">
|
||||
<el-input v-model="postForm._id" placeholder="Id" readonly />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Order" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.order" placeholder="FAQ Order" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Status" class="postInfo-container-item">
|
||||
<el-radio-group v-model="postForm.status">
|
||||
<el-radio-button label="ENABLED">Enabled</el-radio-button>
|
||||
<el-radio-button label="DISABLED">Disabled</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-form-item label-width="120px" label="Question" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.question" placeholder="Question" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-form-item label-width="120px" label="Answer" class="postInfo-container-item">
|
||||
<markdown-editor ref="markdownEditor" v-model="postForm.answer" mode="wysiwyg" :options="{previewStyle:'tab'}" height="200px" width="600px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Sticky from '@/components/Sticky' // 粘性header组件
|
||||
import MarkdownEditor from '@/components/MarkdownEditor'
|
||||
import { fetchFaq, updateFaq, createFaq } from '@/api/faq'
|
||||
|
||||
const defaultForm = {
|
||||
id: '',
|
||||
question: '',
|
||||
answer: '',
|
||||
status: '',
|
||||
order: 0
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'FaqDetail',
|
||||
components: { Sticky, MarkdownEditor },
|
||||
props: {
|
||||
isEdit: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
const validateRequire = (rule, value, callback) => {
|
||||
if (value === '') {
|
||||
this.$message({
|
||||
message: rule.field + 'Epic Success brudda',
|
||||
type: 'error'
|
||||
})
|
||||
callback(new Error(rule.field + ' ERRRR'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
return {
|
||||
postForm: Object.assign({}, defaultForm),
|
||||
loading: false,
|
||||
regionListOptions: [],
|
||||
rules: {
|
||||
// image_uri: [{ validator: validateRequire }],
|
||||
name: [{ validator: validateRequire }]
|
||||
// content: [{ validator: validateRequire }],
|
||||
// source_uri: [{ validator: validateSourceUri, trigger: 'blur' }]
|
||||
},
|
||||
tempRoute: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
displayTime: {
|
||||
// set and get is useful when the data
|
||||
// returned by the back end api is different from the front end
|
||||
// back end return => "2013-06-25 06:59:25"
|
||||
// front end need timestamp => 1372114765000
|
||||
get() {
|
||||
return (+new Date(this.postForm.display_time))
|
||||
},
|
||||
set(val) {
|
||||
this.postForm.display_time = new Date(val)
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.isEdit) {
|
||||
const id = this.$route.params && this.$route.params.id
|
||||
this.fetchData(id)
|
||||
} else {
|
||||
this.postForm = Object.assign({}, defaultForm)
|
||||
}
|
||||
|
||||
// Why need to make a copy of this.$route here?
|
||||
// Because if you enter this page and quickly switch tag, may be in the execution of the setTagsViewTitle function, this.$route is no longer pointing to the current page
|
||||
// https://github.com/PanJiaChen/vue-element-admin/issues/1221
|
||||
this.tempRoute = Object.assign({}, this.$route)
|
||||
},
|
||||
methods: {
|
||||
fetchData(id) {
|
||||
fetchFaq(id).then(response => {
|
||||
const faq = response.data
|
||||
|
||||
this.postForm = faq
|
||||
|
||||
// // set tagsview title
|
||||
this.setTagsViewTitle()
|
||||
|
||||
// // set page title
|
||||
this.setPageTitle()
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
},
|
||||
setTagsViewTitle() {
|
||||
const title = 'Edit FAQ'
|
||||
const route = Object.assign({}, this.tempRoute, { title: `${title} - ${this.postForm.question}` })
|
||||
this.$store.dispatch('tagsView/updateVisitedView', route)
|
||||
},
|
||||
setPageTitle() {
|
||||
const title = 'Edit FAQ'
|
||||
document.title = `${title} - ${this.postForm.id}`
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs.postForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
|
||||
// Save the account
|
||||
const methodToCall = this.isEdit ? updateFaq : createFaq
|
||||
methodToCall(this.postForm).then((r) => {
|
||||
this.$notify({
|
||||
title: 'Success',
|
||||
message: 'FAQ Saved',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
})
|
||||
|
||||
// Redirect to the edit page when we create a new one
|
||||
if (!this.isEdit) { this.$router.push(`/faqs/edit/${r.data.createdFaq._id}`) }
|
||||
|
||||
this.loading = false
|
||||
}).catch((e) => {
|
||||
console.dir(e)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!')
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "~@/styles/mixin.scss";
|
||||
|
||||
.createPost-container {
|
||||
position: relative;
|
||||
|
||||
.createPost-main-container {
|
||||
padding: 40px 45px 20px 50px;
|
||||
|
||||
.postInfo-container {
|
||||
position: relative;
|
||||
@include clearfix;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.postInfo-container-item {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.word-counter {
|
||||
width: 40px;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.article-textarea /deep/ {
|
||||
textarea {
|
||||
padding-right: 40px;
|
||||
resize: none;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
border-bottom: 1px solid #bfcbd9;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<template>
|
||||
<faq-detail :is-edit="false" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import FaqDetail from './components/FaqDetail'
|
||||
|
||||
export default {
|
||||
name: 'CreateForm',
|
||||
components: { FaqDetail }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<template>
|
||||
<faq-detail :is-edit="true" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import FaqDetail from './components/FaqDetail'
|
||||
|
||||
export default {
|
||||
name: 'EditForm',
|
||||
components: { FaqDetail }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,93 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<el-table v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column align="center" label="Question" width="300">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.question }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Order" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.order }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Status" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.status }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Actions" width="120">
|
||||
<template slot-scope="scope">
|
||||
<router-link :to="'/faqs/edit/' + scope.row._id">
|
||||
<el-button type="primary" size="small" icon="el-icon-edit">
|
||||
Edit
|
||||
</el-button>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from '@/api/faq'
|
||||
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
|
||||
|
||||
export default {
|
||||
name: 'FaqList',
|
||||
components: { Pagination },
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'info',
|
||||
deleted: 'danger'
|
||||
}
|
||||
return statusMap[status]
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.listQuery.platform = 'OLFDE'
|
||||
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.faqs
|
||||
this.total = response.data.faqs.length
|
||||
this.listLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,210 @@
|
|||
<template>
|
||||
<div class="createAccount-container">
|
||||
<el-form ref="postForm" :model="postForm" :rules="rules" class="form-container">
|
||||
|
||||
<sticky :z-index="10" :class-name="'sub-navbar ' + postForm.status">
|
||||
<el-button v-loading="loading" style="margin-left: 10px;" type="success" @click="submitForm">
|
||||
Save
|
||||
</el-button>
|
||||
</sticky>
|
||||
|
||||
<div class="createPost-main-container">
|
||||
|
||||
<el-row>
|
||||
<el-col :span="20">
|
||||
<div class="postInfo-container">
|
||||
<el-row v-if="isEdit">
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Id" class="postInfo-container-item">
|
||||
<el-input v-model="postForm._id" placeholder="Id" readonly />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Name" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.name" placeholder="Lifting Period Name" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Days" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.days" placeholder="Lifting Period Days" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Sticky from '@/components/Sticky' // 粘性header组件
|
||||
import { fetchLiftingPeriod, updateLiftingPeriod, createLiftingPeriod } from '@/api/liftingPeriod'
|
||||
|
||||
const defaultForm = {
|
||||
id: '',
|
||||
name: '',
|
||||
days: 0
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'AccountDetail',
|
||||
components: { Sticky },
|
||||
props: {
|
||||
isEdit: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
const validateRequire = (rule, value, callback) => {
|
||||
if (value === '') {
|
||||
this.$message({
|
||||
message: rule.field + 'Epic Success brudda',
|
||||
type: 'error'
|
||||
})
|
||||
callback(new Error(rule.field + ' ERRRR'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
return {
|
||||
postForm: Object.assign({}, defaultForm),
|
||||
loading: false,
|
||||
userListOptions: [],
|
||||
rules: {
|
||||
// image_uri: [{ validator: validateRequire }],
|
||||
name: [{ validator: validateRequire }]
|
||||
// content: [{ validator: validateRequire }],
|
||||
// source_uri: [{ validator: validateSourceUri, trigger: 'blur' }]
|
||||
},
|
||||
tempRoute: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
displayTime: {
|
||||
// set and get is useful when the data
|
||||
// returned by the back end api is different from the front end
|
||||
// back end return => "2013-06-25 06:59:25"
|
||||
// front end need timestamp => 1372114765000
|
||||
get() {
|
||||
return (+new Date(this.postForm.display_time))
|
||||
},
|
||||
set(val) {
|
||||
this.postForm.display_time = new Date(val)
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.isEdit) {
|
||||
const id = this.$route.params && this.$route.params.id
|
||||
this.fetchData(id)
|
||||
} else {
|
||||
this.postForm = Object.assign({}, defaultForm)
|
||||
}
|
||||
|
||||
// Why need to make a copy of this.$route here?
|
||||
// Because if you enter this page and quickly switch tag, may be in the execution of the setTagsViewTitle function, this.$route is no longer pointing to the current page
|
||||
// https://github.com/PanJiaChen/vue-element-admin/issues/1221
|
||||
this.tempRoute = Object.assign({}, this.$route)
|
||||
},
|
||||
methods: {
|
||||
fetchData(id) {
|
||||
fetchLiftingPeriod(id).then(response => {
|
||||
this.postForm = response.data.liftingPeriod
|
||||
|
||||
// // set tagsview title
|
||||
this.setTagsViewTitle()
|
||||
|
||||
// // set page title
|
||||
this.setPageTitle()
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
},
|
||||
setTagsViewTitle() {
|
||||
const title = 'Edit Lifting Period'
|
||||
const route = Object.assign({}, this.tempRoute, { title: `${title} - ${this.postForm.name}` })
|
||||
this.$store.dispatch('tagsView/updateVisitedView', route)
|
||||
},
|
||||
setPageTitle() {
|
||||
const title = 'Edit Lifting Period'
|
||||
document.title = `${title} - ${this.postForm.name}`
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs.postForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
|
||||
// Save the account
|
||||
const methodToCall = this.isEdit ? updateLiftingPeriod : createLiftingPeriod
|
||||
methodToCall(this.postForm).then((r) => {
|
||||
this.$notify({
|
||||
title: 'Success',
|
||||
message: 'Lifting Period Saved',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
})
|
||||
|
||||
// Redirect to the edit page when we create a new one
|
||||
if (!this.isEdit) { this.$router.push(`/lifting-periods/edit/${r.data.createdLiftingPeriod._id}`) }
|
||||
|
||||
this.loading = false
|
||||
}).catch((e) => {
|
||||
console.dir(e)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!')
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "~@/styles/mixin.scss";
|
||||
|
||||
.createPost-container {
|
||||
position: relative;
|
||||
|
||||
.createPost-main-container {
|
||||
padding: 40px 45px 20px 50px;
|
||||
|
||||
.postInfo-container {
|
||||
position: relative;
|
||||
@include clearfix;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.postInfo-container-item {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.word-counter {
|
||||
width: 40px;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.article-textarea /deep/ {
|
||||
textarea {
|
||||
padding-right: 40px;
|
||||
resize: none;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
border-bottom: 1px solid #bfcbd9;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<template>
|
||||
<lifting-period-detail :is-edit="false" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import LiftingPeriodDetail from './components/LiftingPeriodDetail'
|
||||
|
||||
export default {
|
||||
name: 'CreateForm',
|
||||
components: { LiftingPeriodDetail }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<template>
|
||||
<lifting-period-detail :is-edit="true" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import LiftingPeriodDetail from './components/LiftingPeriodDetail'
|
||||
|
||||
export default {
|
||||
name: 'EditForm',
|
||||
components: { LiftingPeriodDetail }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,78 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<el-table v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column align="center" label="Name" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Name" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.days }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Actions" width="120">
|
||||
<template slot-scope="scope">
|
||||
<router-link :to="'/lifting-periods/edit/' + scope.row._id">
|
||||
<el-button type="primary" size="small" icon="el-icon-edit">
|
||||
Edit
|
||||
</el-button>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from '@/api/liftingPeriod'
|
||||
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
|
||||
|
||||
export default {
|
||||
name: 'LiftingPeriodList',
|
||||
components: { Pagination },
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// Set the type for the query
|
||||
this.listQuery.platform = 'OLFDE'
|
||||
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.liftingPeriods
|
||||
this.total = response.data.liftingPeriods.length
|
||||
this.listLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,334 @@
|
|||
<template>
|
||||
<div class="createProduct-container">
|
||||
<el-form ref="postForm" :model="postForm" :rules="rules" class="form-container">
|
||||
|
||||
<sticky :z-index="10" :class-name="'sub-navbar '+postForm.status">
|
||||
<el-button v-loading="loading" style="margin-left: 10px;" type="success" @click="submitForm">
|
||||
Save
|
||||
</el-button>
|
||||
</sticky>
|
||||
|
||||
<div class="createPost-main-container">
|
||||
|
||||
<el-row>
|
||||
<el-col :span="20">
|
||||
<div class="postInfo-container">
|
||||
<el-row v-if="isEdit">
|
||||
<el-col :span="4">
|
||||
<el-form-item label-width="120px" label="Id" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.orderId" placeholder="Id" readonly />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="isEdit">
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Seller" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.offers[0].seller.name" placeholder="Seller" readonly />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="isEdit">
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Buyer" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.buyer.name" placeholder="Buyer" readonly />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Status" class="postInfo-container-item">
|
||||
<el-radio-group v-model="postForm.status">
|
||||
<el-radio-button label="Complete">Complete</el-radio-button>
|
||||
<el-radio-button label="Cancelled">Cancelled</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="isEdit">
|
||||
<el-col :span="18">
|
||||
<el-form-item label-width="120px" label="Items" class="postInfo-container-item">
|
||||
|
||||
<el-table :data="postForm.offers" border style="width: 100%">
|
||||
<el-table-column align="center" label="Id" width="100">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ postForm.orderId }}-{{ scope.$index + 1 }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Product" width="170">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.fuel.name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Terminal" width="170">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.terminal.name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Lifting" width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row | collectionTime }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Credit" width="120">
|
||||
<template>
|
||||
<span>Wie Vereinbart</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Price" width="90">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-model="scope.row.price" placeholder="0.00" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Volume" width="80">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-model="scope.row.quantityOrdered" placeholder="0" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Line Total">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ Number((scope.row.quantityOrdered * scope.row.price) * 10).toFixed(2) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="isEdit">
|
||||
<el-col :span="4">
|
||||
<el-form-item label-width="120px" label="Ex. VAT" class="postInfo-container-item">
|
||||
<el-input v-model="exVatPrice" placeholder="0" readonly />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="isEdit">
|
||||
<el-col :span="4">
|
||||
<el-form-item label-width="120px" label="VAT" class="postInfo-container-item">
|
||||
<el-input v-model="vatPrice" placeholder="0" readonly />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="isEdit">
|
||||
<el-col :span="4">
|
||||
<el-form-item label-width="120px" label="Total" class="postInfo-container-item">
|
||||
<el-input v-model="totalPrice" placeholder="0" readonly />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Sticky from '@/components/Sticky' // 粘性header组件
|
||||
import { fetchOrder } from '@/api/order'
|
||||
|
||||
const defaultForm = {
|
||||
id: '',
|
||||
orderId: ''
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'OrderDetail',
|
||||
components: { Sticky },
|
||||
filters: {
|
||||
collectionTime(offer) {
|
||||
if (offer.collectionRange) {
|
||||
return 'Range'
|
||||
} else {
|
||||
return 'Add on days'
|
||||
}
|
||||
},
|
||||
credit(offer) {
|
||||
if (offer.collectionRange) {
|
||||
return 'Range'
|
||||
} else {
|
||||
return 'Add on days'
|
||||
}
|
||||
}
|
||||
},
|
||||
props: {
|
||||
isEdit: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
const validateRequire = (rule, value, callback) => {
|
||||
if (value === '') {
|
||||
this.$message({
|
||||
message: rule.field + 'Epic Success brudda',
|
||||
type: 'error'
|
||||
})
|
||||
callback(new Error(rule.field + ' ERRRR'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
return {
|
||||
postForm: Object.assign({}, defaultForm),
|
||||
loading: false,
|
||||
regionListOptions: [],
|
||||
rules: {
|
||||
// image_uri: [{ validator: validateRequire }],
|
||||
name: [{ validator: validateRequire }]
|
||||
// content: [{ validator: validateRequire }],
|
||||
// source_uri: [{ validator: validateSourceUri, trigger: 'blur' }]
|
||||
},
|
||||
tempRoute: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
displayTime: {
|
||||
// set and get is useful when the data
|
||||
// returned by the back end api is different from the front end
|
||||
// back end return => "2013-06-25 06:59:25"
|
||||
// front end need timestamp => 1372114765000
|
||||
get() {
|
||||
return (+new Date(this.postForm.display_time))
|
||||
},
|
||||
set(val) {
|
||||
this.postForm.display_time = new Date(val)
|
||||
}
|
||||
},
|
||||
exVatPrice: {
|
||||
get() {
|
||||
let price = 0
|
||||
this.postForm.offers.forEach(element => {
|
||||
price += ((element.price * 10) * element.quantityOrdered)
|
||||
})
|
||||
return price.toFixed(2)
|
||||
}
|
||||
},
|
||||
vatPrice: {
|
||||
get() {
|
||||
return (Number(this.exVatPrice) * 0.19).toFixed(2)
|
||||
}
|
||||
},
|
||||
totalPrice: {
|
||||
get() {
|
||||
return (Number(this.exVatPrice) + Number(this.vatPrice)).toFixed(2)
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.isEdit) {
|
||||
const id = this.$route.params && this.$route.params.id
|
||||
this.fetchData(id)
|
||||
} else {
|
||||
this.postForm = Object.assign({}, defaultForm)
|
||||
}
|
||||
|
||||
// Why need to make a copy of this.$route here?
|
||||
// Because if you enter this page and quickly switch tag, may be in the execution of the setTagsViewTitle function, this.$route is no longer pointing to the current page
|
||||
// https://github.com/PanJiaChen/vue-element-admin/issues/1221
|
||||
this.tempRoute = Object.assign({}, this.$route)
|
||||
},
|
||||
methods: {
|
||||
fetchData(id) {
|
||||
fetchOrder(id).then(response => {
|
||||
const order = response.data.order
|
||||
|
||||
this.postForm = order
|
||||
|
||||
// // set tagsview title
|
||||
this.setTagsViewTitle()
|
||||
|
||||
// // set page title
|
||||
this.setPageTitle()
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
},
|
||||
setTagsViewTitle() {
|
||||
const title = 'Edit Order'
|
||||
const route = Object.assign({}, this.tempRoute, { title: `${title} - ${this.postForm.orderId}` })
|
||||
this.$store.dispatch('tagsView/updateVisitedView', route)
|
||||
},
|
||||
setPageTitle() {
|
||||
const title = 'Edit Order'
|
||||
document.title = `${title} - ${this.postForm.id}`
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs.postForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
|
||||
// Save the account
|
||||
const methodToCall = this.isEdit ? function() {} : function() {}
|
||||
methodToCall(this.postForm).then((r) => {
|
||||
this.$notify({
|
||||
title: 'Success',
|
||||
message: 'FAQ Saved',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
})
|
||||
|
||||
// Redirect to the edit page when we create a new one
|
||||
if (!this.isEdit) { this.$router.push(`/faqs/edit/${r.data.createdFaq._id}`) }
|
||||
|
||||
this.loading = false
|
||||
}).catch((e) => {
|
||||
console.dir(e)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!')
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "~@/styles/mixin.scss";
|
||||
|
||||
.createPost-container {
|
||||
position: relative;
|
||||
|
||||
.createPost-main-container {
|
||||
padding: 40px 45px 20px 50px;
|
||||
|
||||
.postInfo-container {
|
||||
position: relative;
|
||||
@include clearfix;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.postInfo-container-item {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.word-counter {
|
||||
width: 40px;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.article-textarea /deep/ {
|
||||
textarea {
|
||||
padding-right: 40px;
|
||||
resize: none;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
border-bottom: 1px solid #bfcbd9;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<template>
|
||||
<order-detail :is-edit="false" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import OrderDetail from './components/OrderDetail'
|
||||
|
||||
export default {
|
||||
name: 'CreateForm',
|
||||
components: { OrderDetail }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<template>
|
||||
<order-detail :is-edit="true" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import OrderDetail from './components/OrderDetail'
|
||||
|
||||
export default {
|
||||
name: 'EditForm',
|
||||
components: { OrderDetail }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,204 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input v-model="listQuery.orderId" placeholder="Order Id" width="10%" />
|
||||
<el-date-picker
|
||||
v-model="listQuery.dateRange"
|
||||
type="daterange"
|
||||
range-separator="To"
|
||||
start-placeholder="Start date"
|
||||
end-placeholder="End date"
|
||||
/>
|
||||
<el-select v-model="listQuery.sellerAccountId" :remote-method="getRemoteAccountList" filterable default-first-option remote placeholder="Seller Accounts" loading-text="Loading...">
|
||||
<el-option v-for="(item,index) in sellerAccounts" :key="item+index" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
<el-select v-model="listQuery.buyerAccountId" :remote-method="getRemoteAccountList" filterable default-first-option remote placeholder="Buyer Accounts" loading-text="Loading...">
|
||||
<el-option v-for="(item,index) in buyerAccounts" :key="item+index" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
<el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
|
||||
Search
|
||||
</el-button>
|
||||
<el-button class="filter-item" type="danger" icon="el-icon-remove" @click="resetFilter">
|
||||
Reset
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table v-loading="listLoading" :data="list" border fit style="width: 100%" :summary-method="getSummary" show-summary>
|
||||
<el-table-column align="center" label="Date" sortable prop="created" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.created }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" prop="orderId" sortable label="Order Id" width="100" />
|
||||
|
||||
<el-table-column align="center" prop="offers[0].seller.name" sortable label="Seller" width="250" />
|
||||
|
||||
<el-table-column align="center" prop="buyer.name" sortable label="Buyer" width="250" />
|
||||
|
||||
<el-table-column align="center" label="Total" width="120">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.offers | totalPrice }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Products" width="100">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.offers.length }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column class-name="status-col" label="Status" width="110">
|
||||
<template slot-scope="{row}">
|
||||
<el-tag :type="row.status | statusFilter">
|
||||
{{ row.status }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Actions" width="120">
|
||||
<template slot-scope="scope">
|
||||
<router-link :to="'/orders/edit/' + scope.row._id">
|
||||
<el-button type="primary" size="small" icon="el-icon-edit">
|
||||
Edit
|
||||
</el-button>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const fetchAccountList = require('@/api/account').fetchList
|
||||
import { fetchList } from '@/api/order'
|
||||
import moment from 'moment'
|
||||
|
||||
export default {
|
||||
name: 'OrderList',
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
Complete: 'success',
|
||||
Cancelled: 'danger'
|
||||
}
|
||||
return statusMap[status]
|
||||
},
|
||||
totalPrice(offers) {
|
||||
let price = 0
|
||||
offers.forEach(element => {
|
||||
price += ((element.price * 10) * element.quantityOrdered)
|
||||
})
|
||||
return `€${(price * 1.19).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
sellerAccounts: [],
|
||||
buyerAccounts: [],
|
||||
originalList: null,
|
||||
list: null,
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
orderId: '',
|
||||
buyerAccountId: '',
|
||||
sellerAccountId: '',
|
||||
dateRange: [moment().startOf('day').startOf('week').toDate(), moment().toDate()]
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.listQuery.platform = 'OLFDE'
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getRemoteAccountList(query) {
|
||||
query = {}
|
||||
query.platform = 'OLFDE'
|
||||
query.limit = 100
|
||||
fetchAccountList(query).then(response => {
|
||||
if (!response.data.docs) return
|
||||
this.sellerAccounts = response.data.docs.filter(a => a.type === 'seller').map(v => { return { name: v.name, id: v._id } })
|
||||
this.buyerAccounts = response.data.docs.filter(a => a.type === 'buyer').map(v => { return { name: v.name, id: v._id } })
|
||||
})
|
||||
},
|
||||
getSummary(param) {
|
||||
const { data } = param
|
||||
const sums = []
|
||||
|
||||
let totalPrice = 0
|
||||
data.forEach(order => {
|
||||
order.offers.forEach(element => {
|
||||
totalPrice += ((element.price * 10) * element.quantityOrdered)
|
||||
})
|
||||
})
|
||||
|
||||
// Set the sum on the 4th column, as that's the cost one
|
||||
sums[4] = Number(totalPrice * 1.19).toFixed(2)
|
||||
|
||||
return sums
|
||||
},
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.originalList = response.data.orders
|
||||
this.total = response.data.orders.length
|
||||
this.listLoading = false
|
||||
|
||||
// Handle the filter for the initial load
|
||||
this.handleFilter()
|
||||
})
|
||||
},
|
||||
resetFilter() {
|
||||
this.listQuery.orderId = ''
|
||||
this.listQuery.dateRange = []
|
||||
this.listQuery.sellerAccountId = ''
|
||||
this.listQuery.buyerAccountId = ''
|
||||
},
|
||||
handleFilter() {
|
||||
const allItems = this.originalList
|
||||
|
||||
// If we have an orderId, that trumps all other fields
|
||||
if (this.listQuery.orderId && this.listQuery.orderId.length > 0) {
|
||||
this.list = allItems.filter(o => o.orderId.indexOf(this.listQuery.orderId) > -1)
|
||||
} else {
|
||||
// We don't have an order id, let's check the other fields to use
|
||||
let newResults = allItems
|
||||
|
||||
if (this.listQuery.dateRange.length === 2) {
|
||||
newResults = newResults.filter(o => {
|
||||
const created = new Date(o.created).getTime()
|
||||
return created > this.listQuery.dateRange[0].getTime() && created < this.listQuery.dateRange[1].getTime()
|
||||
})
|
||||
}
|
||||
|
||||
if (this.listQuery.sellerAccountId.length > 0) {
|
||||
newResults = newResults.filter(o => o.offers[0].seller._id === this.listQuery.sellerAccountId)
|
||||
}
|
||||
|
||||
if (this.listQuery.buyerAccountId.length > 0) {
|
||||
newResults = newResults.filter(o => o.buyer._id === this.listQuery.buyerAccountId)
|
||||
}
|
||||
|
||||
this.list = newResults
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,210 @@
|
|||
<template>
|
||||
<div class="createAccount-container">
|
||||
<el-form ref="postForm" :model="postForm" :rules="rules" class="form-container">
|
||||
|
||||
<sticky :z-index="10" :class-name="'sub-navbar ' + postForm.status">
|
||||
<el-button v-loading="loading" style="margin-left: 10px;" type="success" @click="submitForm">
|
||||
Save
|
||||
</el-button>
|
||||
</sticky>
|
||||
|
||||
<div class="createPost-main-container">
|
||||
|
||||
<el-row>
|
||||
<el-col :span="20">
|
||||
<div class="postInfo-container">
|
||||
<el-row v-if="isEdit">
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Id" class="postInfo-container-item">
|
||||
<el-input v-model="postForm._id" placeholder="Id" readonly />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Name" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.name" placeholder="Lifting Period Name" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Days" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.days" placeholder="Lifting Period Days" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Sticky from '@/components/Sticky' // 粘性header组件
|
||||
import { fetchPaymentTerm, updatePaymentTerm, createPaymentTerm } from '@/api/paymentTerm'
|
||||
|
||||
const defaultForm = {
|
||||
id: '',
|
||||
name: '',
|
||||
days: 0
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'AccountDetail',
|
||||
components: { Sticky },
|
||||
props: {
|
||||
isEdit: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
const validateRequire = (rule, value, callback) => {
|
||||
if (value === '') {
|
||||
this.$message({
|
||||
message: rule.field + 'Epic Success brudda',
|
||||
type: 'error'
|
||||
})
|
||||
callback(new Error(rule.field + ' ERRRR'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
return {
|
||||
postForm: Object.assign({}, defaultForm),
|
||||
loading: false,
|
||||
userListOptions: [],
|
||||
rules: {
|
||||
// image_uri: [{ validator: validateRequire }],
|
||||
name: [{ validator: validateRequire }]
|
||||
// content: [{ validator: validateRequire }],
|
||||
// source_uri: [{ validator: validateSourceUri, trigger: 'blur' }]
|
||||
},
|
||||
tempRoute: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
displayTime: {
|
||||
// set and get is useful when the data
|
||||
// returned by the back end api is different from the front end
|
||||
// back end return => "2013-06-25 06:59:25"
|
||||
// front end need timestamp => 1372114765000
|
||||
get() {
|
||||
return (+new Date(this.postForm.display_time))
|
||||
},
|
||||
set(val) {
|
||||
this.postForm.display_time = new Date(val)
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.isEdit) {
|
||||
const id = this.$route.params && this.$route.params.id
|
||||
this.fetchData(id)
|
||||
} else {
|
||||
this.postForm = Object.assign({}, defaultForm)
|
||||
}
|
||||
|
||||
// Why need to make a copy of this.$route here?
|
||||
// Because if you enter this page and quickly switch tag, may be in the execution of the setTagsViewTitle function, this.$route is no longer pointing to the current page
|
||||
// https://github.com/PanJiaChen/vue-element-admin/issues/1221
|
||||
this.tempRoute = Object.assign({}, this.$route)
|
||||
},
|
||||
methods: {
|
||||
fetchData(id) {
|
||||
fetchPaymentTerm(id).then(response => {
|
||||
this.postForm = response.data.paymentTerms
|
||||
|
||||
// // set tagsview title
|
||||
this.setTagsViewTitle()
|
||||
|
||||
// // set page title
|
||||
this.setPageTitle()
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
},
|
||||
setTagsViewTitle() {
|
||||
const title = 'Edit Payment Terms'
|
||||
const route = Object.assign({}, this.tempRoute, { title: `${title} - ${this.postForm.name}` })
|
||||
this.$store.dispatch('tagsView/updateVisitedView', route)
|
||||
},
|
||||
setPageTitle() {
|
||||
const title = 'Edit Payment Terms'
|
||||
document.title = `${title} - ${this.postForm.name}`
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs.postForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
|
||||
// Save the account
|
||||
const methodToCall = this.isEdit ? updatePaymentTerm : createPaymentTerm
|
||||
methodToCall(this.postForm).then((r) => {
|
||||
this.$notify({
|
||||
title: 'Success',
|
||||
message: 'Payment Terms Saved',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
})
|
||||
|
||||
// Redirect to the edit page when we create a new one
|
||||
if (!this.isEdit) { this.$router.push(`/payment-terms/edit/${r.data.createdPaymentTerms._id}`) }
|
||||
|
||||
this.loading = false
|
||||
}).catch((e) => {
|
||||
console.dir(e)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!')
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "~@/styles/mixin.scss";
|
||||
|
||||
.createPost-container {
|
||||
position: relative;
|
||||
|
||||
.createPost-main-container {
|
||||
padding: 40px 45px 20px 50px;
|
||||
|
||||
.postInfo-container {
|
||||
position: relative;
|
||||
@include clearfix;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.postInfo-container-item {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.word-counter {
|
||||
width: 40px;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.article-textarea /deep/ {
|
||||
textarea {
|
||||
padding-right: 40px;
|
||||
resize: none;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
border-bottom: 1px solid #bfcbd9;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<template>
|
||||
<payment-terms-details :is-edit="false" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PaymentTermsDetails from './components/PaymentTermsDetails'
|
||||
|
||||
export default {
|
||||
name: 'CreateForm',
|
||||
components: { PaymentTermsDetails }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<template>
|
||||
<payment-terms-details :is-edit="true" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PaymentTermsDetails from './components/PaymentTermsDetails'
|
||||
|
||||
export default {
|
||||
name: 'EditForm',
|
||||
components: { PaymentTermsDetails }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -0,0 +1,78 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<el-table v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column align="center" label="Name" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Name" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.days }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Actions" width="120">
|
||||
<template slot-scope="scope">
|
||||
<router-link :to="'/payment-terms/edit/' + scope.row._id">
|
||||
<el-button type="primary" size="small" icon="el-icon-edit">
|
||||
Edit
|
||||
</el-button>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from '@/api/paymentTerm'
|
||||
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
|
||||
|
||||
export default {
|
||||
name: 'PaymentTermsList',
|
||||
components: { Pagination },
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// Set the type for the query
|
||||
this.listQuery.platform = 'OLFDE'
|
||||
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.paymentTerms
|
||||
this.total = response.data.paymentTerms.length
|
||||
this.listLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -9,6 +9,7 @@
|
|||
</sticky>
|
||||
|
||||
<div class="createPost-main-container">
|
||||
|
||||
<el-row>
|
||||
<el-col :span="20">
|
||||
<div class="postInfo-container">
|
||||
|
|
@ -19,7 +20,7 @@
|
|||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="$store.state.settings.platform === 'OLFDE'">
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Region:" class="postInfo-container-item">
|
||||
<el-select v-model="postForm.region_id" :remote-method="getRemoteRegionList" filterable default-first-option remote placeholder="Search Regions" loading-text="Loading...">
|
||||
|
|
@ -31,14 +32,21 @@
|
|||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Name" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.name" placeholder="Terminal Name" />
|
||||
<el-input v-model="postForm.name" placeholder="Terminal Display Name" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row v-if="$store.state.settings.platform === 'OLFUK'">
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Identifier" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.identifier" placeholder="DeliveredIn Identifier" />
|
||||
<el-form-item label-width="120px" label="Full Name" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.fullName" placeholder="Terminal Full Name" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Contact Num" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.contactNumber" placeholder="Terminal Contact Number" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
|
@ -77,6 +85,13 @@
|
|||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Opening Hours" class="postInfo-container-item">
|
||||
<el-input v-model="postForm.meta.openingHours" type="textarea" rows="2" placeholder="Terminal Opening Hours" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="120px" label="Status" class="postInfo-container-item">
|
||||
|
|
@ -105,19 +120,23 @@ const fetchRegionList = require('@/api/region').fetchList
|
|||
const defaultForm = {
|
||||
id: '',
|
||||
name: '',
|
||||
fullName: '',
|
||||
contactNumber: '',
|
||||
region_id: '',
|
||||
identifier: '',
|
||||
address: {
|
||||
line1: '',
|
||||
line2: '',
|
||||
county: '',
|
||||
postCode: '',
|
||||
country: ''
|
||||
},
|
||||
meta: {
|
||||
openingHours: ''
|
||||
}
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'TerminalDetail',
|
||||
name: 'AccountDetail',
|
||||
components: { Sticky },
|
||||
props: {
|
||||
isEdit: {
|
||||
|
|
@ -170,7 +189,6 @@ export default {
|
|||
this.fetchData(id)
|
||||
} else {
|
||||
this.postForm = Object.assign({}, defaultForm)
|
||||
this.postForm.address = Object.assign({}, defaultForm.address)
|
||||
}
|
||||
|
||||
// Why need to make a copy of this.$route here?
|
||||
|
|
@ -181,7 +199,15 @@ export default {
|
|||
methods: {
|
||||
fetchData(id) {
|
||||
fetchTerminal(id).then(response => {
|
||||
this.postForm = response.data
|
||||
const terminal = response.data
|
||||
|
||||
if (!terminal.meta) {
|
||||
terminal.meta = {
|
||||
openingHours: ''
|
||||
}
|
||||
}
|
||||
|
||||
this.postForm = terminal
|
||||
|
||||
// // set tagsview title
|
||||
this.setTagsViewTitle()
|
||||
|
|
@ -206,7 +232,7 @@ export default {
|
|||
if (valid) {
|
||||
this.loading = true
|
||||
|
||||
// Save the terminal
|
||||
// Save the account
|
||||
const methodToCall = this.isEdit ? updateTerminal : createTerminal
|
||||
methodToCall(this.postForm).then((r) => {
|
||||
this.$notify({
|
||||
|
|
@ -217,7 +243,8 @@ export default {
|
|||
})
|
||||
|
||||
// Redirect to the edit page when we create a new one
|
||||
if (!this.isEdit) { this.$router.push(`/terminals/edit/${r.data.createdTerminal._id}`) }
|
||||
if (!this.isEdit) { this.$router.push(`/terminals/edit/${r.data.id}`) }
|
||||
|
||||
this.loading = false
|
||||
}).catch((e) => {
|
||||
console.dir(e)
|
||||
|
|
@ -230,7 +257,7 @@ export default {
|
|||
},
|
||||
getRemoteRegionList(query) {
|
||||
query = {}
|
||||
query.platform = this.$store.state.platform
|
||||
query.platform = 'OLFDE'
|
||||
query.limit = 100
|
||||
fetchRegionList(query).then(response => {
|
||||
if (!response.data.regions) return
|
||||
|
|
|
|||
|
|
@ -50,13 +50,16 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Actions" width="120">
|
||||
<el-table-column align="center" label="Actions" width="250">
|
||||
<template slot-scope="scope">
|
||||
<router-link :to="'/users/edit/' + scope.row.id">
|
||||
<el-button type="primary" size="small" icon="el-icon-edit">
|
||||
Edit
|
||||
</el-button>
|
||||
</router-link>
|
||||
<el-button type="primary" size="small" icon="el-icon-message" @click="sendPasswordResetConfirm(scope.row.email)">
|
||||
Send PW Reset
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
|
@ -67,7 +70,7 @@
|
|||
|
||||
<script>
|
||||
const fetchAccountList = require('@/api/account').fetchList
|
||||
import { fetchList } from '@/api/user'
|
||||
import { fetchList, sendPasswordReset } from '@/api/user'
|
||||
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
|
||||
|
||||
export default {
|
||||
|
|
@ -124,6 +127,30 @@ export default {
|
|||
handleFilter(query) {
|
||||
this.listQuery.page = 1
|
||||
this.getList()
|
||||
},
|
||||
sendPasswordResetConfirm(email) {
|
||||
this.$confirm(`This will send an email to <b>${email}</b>, prompting them to reset their password with the provided link. Are you sure you want to do this?`, 'Warning', {
|
||||
confirmButtonText: 'Proceed',
|
||||
cancelButtonText: 'Cancel',
|
||||
dangerouslyUseHTMLString: true,
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
sendPasswordReset(email, 'RESET').then(() => {
|
||||
// Send the request
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: 'Password Reset Sent'
|
||||
})
|
||||
}).catch(() => {
|
||||
// Send the request
|
||||
this.$message({
|
||||
type: 'danger',
|
||||
message: 'Password Reset Failed'
|
||||
})
|
||||
})
|
||||
}).catch(() => {
|
||||
// Do nothing, we don't care that they clicked cancel, but if we don't catch it, we get a console error
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue