2
0
mirror of https://github.com/frappe/books.git synced 2024-11-10 15:50:56 +00:00

Minor UI Fixes

- Remove top border from Navbar
- Link dropdown in Child Table
- Form Modal
This commit is contained in:
Faris Ansari 2018-07-16 16:50:24 +05:30
parent dc08d8bbbc
commit f5cdbfa620
6 changed files with 31 additions and 17 deletions

View File

@ -1,6 +1,7 @@
<template> <template>
<div class="frappe-form"> <div class="frappe-form">
<form-actions <form-actions
class="p-3 border-bottom"
v-if="shouldRenderForm" v-if="shouldRenderForm"
:doc="doc" :doc="doc"
:links="links" :links="links"
@ -8,15 +9,14 @@
@submit="submit" @submit="submit"
@revert="revert" @revert="revert"
/> />
<div class="p-3"> <form-layout
<form-layout class="p-3"
v-if="shouldRenderForm" v-if="shouldRenderForm"
:doc="doc" :doc="doc"
:fields="meta.fields" :fields="meta.fields"
:layout="meta.layout" :layout="meta.layout"
:invalid="invalid" :invalid="invalid"
/> />
</div>
<not-found v-if="notFound" /> <not-found v-if="notFound" />
</div> </div>
</template> </template>

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="frappe-form-actions d-flex justify-content-between align-items-center p-3 border-bottom"> <div class="frappe-form-actions d-flex justify-content-between align-items-center">
<h5 class="m-0">{{ title }}</h5> <h5 class="m-0">{{ title }}</h5>
<div class="d-flex"> <div class="d-flex">
<f-button primary v-if="showSave" :disabled="disableSave" @click="$emit('save')">{{ _('Save') }}</f-button> <f-button primary v-if="showSave" :disabled="disableSave" @click="$emit('save')">{{ _('Save') }}</f-button>

View File

@ -1,15 +1,15 @@
<template> <template>
<div :class="['modal fade show d-block']" <div :class="['modal fade show d-block']" @click.self="onBackdropClick"
tabindex="-1" role="dialog" aria-labelledby="frappe-modal-label" aria-hidden="true"> tabindex="-1" role="dialog" aria-labelledby="frappe-modal-label" aria-hidden="true">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content shadow"> <div class="modal-content shadow">
<div class="modal-header"> <div class="modal-header" v-if="!noHeader">
<h5 class="modal-title">{{ title }}</h5> <h5 class="modal-title">{{ title }}</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close" @click="closeModal"> <button type="button" class="close" data-dismiss="modal" aria-label="Close" @click="closeModal">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</div> </div>
<div class="modal-body modal-height"> <div class="modal-body modal-height p-0">
<component ref="modalComponent" :is="component" v-bind="props" v-on="events"/> <component ref="modalComponent" :is="component" v-bind="props" v-on="events"/>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
@ -39,6 +39,10 @@ export default {
}, },
events: { events: {
type: Object type: Object
},
noHeader: {
type: Boolean,
default: false
} }
}, },
methods: { methods: {
@ -47,6 +51,9 @@ export default {
}, },
onPrimaryAction() { onPrimaryAction() {
this.primaryAction.handler(this.$refs.modalComponent); this.primaryAction.handler(this.$refs.modalComponent);
},
onBackdropClick(e) {
this.closeModal();
} }
} }
}; };

View File

@ -168,5 +168,13 @@ export default {
height: 100%; height: 100%;
padding: 0; padding: 0;
} }
.awesomplete > ul {
position: fixed;
top: auto;
left: auto;
width: auto;
min-width: 120px;
}
} }
</style> </style>

View File

@ -1,5 +1,5 @@
<template> <template>
<nav class="frappe-navbar navbar navbar-light bg-light row no-gutters border-bottom border-top"> <nav class="frappe-navbar navbar navbar-light bg-light row no-gutters border-bottom">
<form v-if="showSearch" class="form-inline col-4 pr-3"> <form v-if="showSearch" class="form-inline col-4 pr-3">
<input type="text" <input type="text"
v-model="searchValue" v-model="searchValue"

View File

@ -1,4 +1,3 @@
import frappe from 'frappejs';
import Form from '../components/Form/Form'; import Form from '../components/Form/Form';
export default function installFormModal(Vue) { export default function installFormModal(Vue) {
@ -19,7 +18,7 @@ export default function installFormModal(Vue) {
onClose onClose
}, },
modalProps: { modalProps: {
title: frappe._('Form Modal') noHeader: true
} }
}); });
} }