Pour tout problème contactez-nous par mail : support@froggit.fr | La FAQ :grey_question: | Rejoignez-nous sur le Chat :speech_balloon:

Skip to content
Snippets Groups Projects
Commit f289bbbf authored by GrayFawkes's avatar GrayFawkes
Browse files

Séparer la vue Clients du formulaire Fixes ##18

parent efe8379b
No related branches found
No related tags found
1 merge request!19Séparer la vue Clients du formulaire Fixes ##18
......@@ -28,6 +28,14 @@ router.post("/clients", (req, res) => {
})
}
});
router.get("/clients/:uuid", (req, res) => {
Client.findByPk(req.params.uuid).then(client => {
res.json(client)
})
.catch(err => {
res.send("Error: " + err)
})
});
// Delete Client
// router.delete("/clients/:uuid", (req, res) => {
......
......@@ -22,7 +22,7 @@ app.use("/api", clients);
// cert: fs.readFileSync('cert.pem')
// }, app).listen(443)
// const port = 3000;
// app.listen(port, function() {
// console.log('Server started on port ' + port);
// });
\ No newline at end of file
const port = 3000;
app.listen(port, function() {
console.log('Server started on port ' + port);
});
\ No newline at end of file
......@@ -2,10 +2,13 @@
<div id="app">
<nav class="navbar navbar-expand navbar-dark bg-dark">
<!-- <a href="#" class="navbar-brand">{{ $t('global.openPharma') }}</a> -->
<a href="#" class="navbar-brand" style="font-family:'Ubuntu Medium"><img src="@/assets/logo.png" style="margin-right: 8px; width:41px">{{ $t('global.openPharma') }}</a>
<a href="/" class="navbar-brand" style="font-family:'Ubuntu Medium"><img src="@/assets/logo.png" style="margin-right: 8px; width:41px">{{ $t('global.openPharma') }}</a>
<div class="navbar-nav mr-auto">
<li class="nav-item">
<a href="/clients" class="nav-link">{{ $t('global.clients') }}</a>
<a href="/clients" class="nav-link">{{ $t('global.views.clients') }}</a>
</li>
<li class="nav-item">
<a href="/products" class="nav-link">{{ $t('global.views.products') }}</a>
</li>
</div>
<form class="form-inline my-2 my-lg-0">
......@@ -19,14 +22,13 @@
</div>
</nav>
<div class="container mt-3">
<div class="container">
<router-view/>
</div>
</div>
</template>
<script>
// import i18n from '@/i18n'
export default {
name: 'App',
data() {
......
<template>
<div>
<form v-on:submit.prevent="addClient">
<span class="row">
<label for="numSSInput">{{$t('clients.numss-input')}}</label>
<input v-model="client.numSS" v-bind:placeholder="$t('clients.numss-input')" type="text" id="numSSInput" class="form-control"/>
<input v-model="client.cleSS" v-bind:placeholder="$t('clients.keyss-input')" type="number" id="cleSSInput" class="form-control input_key" min="0" max="99" value="00"/>
</span>
<span class="row">
<label for="lastNameInput">{{$t('clients.name-input')}}</label>
<input v-model="client.lastName" type="text" id="lastNameInput" class="form-control" v-bind:placeholder="$t('clients.name-input')"/>
</span>
<span class="row">
<label for="firstNameInput">{{$t('clients.firstname-input')}}</label>
<input v-model="client.firstName" type="text" id="firstNameInput" class="form-control" v-bind:placeholder="$t('clients.firstname-input')"
/>
</span>
<span class="row">
<label for="birthDateInput">{{$t('clients.birthdate-input')}}</label>
<input v-model="client.birthDate" type="date" id="birthDateInput" class="form-control" v-bind:placeholder="$t('clients.birthdate-input')"
/>
</span>
<span class="row">
<button v-if="this.client.isEdit == false" type="submit" class="btn btn-success btn-block mt-3" >{{$t('buttons.save-button')}}</button>
<button v-else v-on:click="updateClient()" type="button" class="btn btn-primary btn-block mt-3" >{{$t('buttons.update-button')}}</button>
</span>
</form>
</div>
</template>
<script>
import axios from 'axios'
export default {
name: "Client",
data() {
return {
uuid: '',
client: {
uuid: undefined,
numSS: "",
cleSS: "",
lastName: "",
firstName: "",
birthDate: "",
active: false,
isEdit: false
}
};
},
mounted() {
this.uuid = this.$route.params.uuid
this.getClient(this.uuid);
},
methods: {
getClient(uuid) {
// Call API
var url = "/api/clients/"+uuid
axios.get(url).then(
result => {
console.log(result.data);
this.client = result.data;
},
error => {
console.error(error);
}
);
},
addClient() {
console.log(this.client);
this.client.active = true;
// Call API
axios.post("api/clients", this.client).then(res => {
this.client = {};
this.client.isEdit = false;
this.getClients();
}).catch(err => {
console.log(err);
});
},
editClient(pClient) {
this.client = pClient;
this.client.lastName = this.client.lastName.toUpperCase();
this.client.isEdit = true;
},
updateClient() {
// Call API
axios
.put(`/api/clients/${this.client.uuid}`, this.client)
.then(res => {
this.client = {};
this.client.isEdit = false;
this.getTasks();
console.log(res);
})
.catch(err => {
console.log(err);
});
},
deleteClient(uuid) {
// Call API
axios
.delete(`/api/clients/${uuid}`)
.then(res => {
this.client = {};
this.getTasks();
console.log(res);
})
.catch(err => {
console.log(err);
});
}
}
};
</script>
<style>
</style>
......@@ -2,31 +2,7 @@
<div id="clients-list" class="container-fluid">
<div>
<div class="">
<!-- <h1 class="text-center">Client List</h1> -->
<form v-on:submit.prevent="addClient">
<span class="row">
<label for="numSSInput">{{$t('clients.numss-input')}}</label>
<input v-model="client.numSS" v-bind:placeholder="$t('clients.numss-input')" type="text" id="numSSInput" class="form-control"/>
<input v-model="client.cleSS" v-bind:placeholder="$t('clients.keyss-input')" type="number" id="cleSSInput" class="form-control input_key" min="0" max="99" value="00"/>
</span>
<span class="row">
<label for="lastNameInput">{{$t('clients.name-input')}}</label>
<input v-model="client.lastName" type="text" id="lastNameInput" class="form-control" v-bind:placeholder="$t('clients.name-input')"/>
</span>
<span class="row">
<label for="firstNameInput">{{$t('clients.firstname-input')}}</label>
<input v-model="client.firstName" type="text" id="firstNameInput" class="form-control" v-bind:placeholder="$t('clients.firstname-input')"/>
</span>
<span class="row">
<label for="birthDateInput">{{$t('clients.birthdate-input')}}</label>
<input v-model="client.birthDate" type="date" id="birthDateInput" class="form-control" v-bind:placeholder="$t('clients.birthdate-input')"/>
</span>
<span class="row">
<button v-if="this.client.isEdit == false" type="submit" class="btn btn-success btn-block mt-3">{{$t('buttons.save-button')}}</button>
<button v-else v-on:click="updateClient()" type="button" class="btn btn-primary btn-block mt-3" >{{$t('buttons.update-button')}}</button>
</span>
</form>
<h1 class="text-center">Client List</h1>
<table class="table">
<tr v-for="(line) in clients" v-bind:key="line.uuid" v-bind:title="line.numSS">
<td class="text-left">{{line.lastName}}</td>
......@@ -47,19 +23,20 @@
import axios from 'axios'
export default {
name: 'Clients',
data () {
return {
clients: [],
client: {
uuid: undefined,
numSS: '',
cleSS: '',
lastName: '',
firstName: '',
birthDate: '',
active: false,
isEdit: false
}
// client: {
// uuid: undefined,
// numSS: '',
// cleSS: '',
// lastName: '',
// firstName: '',
// birthDate: '',
// active: false,
// isEdit: false
// }
}
},
mounted () {
......@@ -79,56 +56,57 @@ export default {
}
)
},
addClient () {
console.log(this.client)
this.client.active = true
// addClient () {
// console.log(this.client)
// this.client.active = true
// Call API
axios
.post('api/clients', this.client)
.then(res => {
this.client = {}
this.client.isEdit = false
this.getClients()
})
.catch(err => {
console.log(err)
})
},
// // Call API
// axios
// .post('api/clients', this.client)
// .then(res => {
// this.client = {}
// this.client.isEdit = false
// this.getClients()
// })
// .catch(err => {
// console.log(err)
// })
// },
editClient (pClient) {
this.client = pClient
this.client.lastName = this.client.lastName.toUpperCase()
this.client.isEdit = true
this.$router.push({ name: 'Client', params: { uuid: pClient.uuid } })
// this.client = pClient
// this.client.lastName = this.client.lastName.toUpperCase()
// this.client.isEdit = true
},
updateClient () {
// updateClient () {
// Call API
axios
.put(`/api/clients/${this.client.uuid}`, this.client)
.then(res => {
this.client = {}
this.client.isEdit = false
this.getTasks()
console.log(res)
})
.catch(err => {
console.log(err)
})
},
deleteClient (uuid) {
// // Call API
// axios
// .put(`/api/clients/${this.client.uuid}`, this.client)
// .then(res => {
// this.client = {}
// this.client.isEdit = false
// this.getTasks()
// console.log(res)
// })
// .catch(err => {
// console.log(err)
// })
// },
// deleteClient (uuid) {
// Call API
axios
.delete(`/api/clients/${uuid}`)
.then(res => {
this.client = {}
this.getTasks()
console.log(res)
})
.catch(err => {
console.log(err)
})
}
// // Call API
// axios
// .delete(`/api/clients/${uuid}`)
// .then(res => {
// this.client = {}
// this.getTasks()
// console.log(res)
// })
// .catch(err => {
// console.log(err)
// })
// }
}
}
</script>
......
<template>
<!-- <tr v-for="(line) in clients" v-bind:key="line.uuid" v-bind:title="line.numSS"> -->
<!-- <td class="text-left">{{line.lastName}}</td> -->
<!-- <td class="text-left">{{line.firstName}}</td> -->
<!-- <td class="text-left">{{ $d(new Date(line.birthDate), "short") }}</td> -->
<!-- <td class="text right"> -->
<!-- <button class="btn btn-info" v-on:click="editClient(line)">{{$t('buttons.edit-button')}}</button> -->
<!-- <button class="btn btn-danger" v-on:click="deleteClient(line.uuid)">{{$t('buttons.delete-button')}}</button> -->
<!-- </td> -->
<div class="container">
<div class="card" v-for="(view) in views" :key="view.id"> <!-- v-bind:key="view.id" v-bind:title="{{$t(view.label)}}" -->
<div class="card-body">
{{$t(view.label)}}
</div>
</div>
</div>
</template>
<script>
export default {
name: 'Home',
data () {
return {
views: [
{ id: "Clients", label: 'global.views.clients', text: 'global.views.clients' },
{ id: "Products", label: 'global.views.products', text: 'global.views.products' }
],
// client: {
// uuid: undefined,
// numSS: '',
// cleSS: '',
// lastName: '',
// firstName: '',
// birthDate: '',
// active: false,
// isEdit: false
// }
}
},
mounted () {
this.getTrucs() //TODO: RTO - Faire mieux que ça
},
methods: {
getTrucs () {
console.log("Home: Get trucs")
// Call API
// axios.get('/api/clients').then(
// result => {
// console.log(result.data)
// this.clients = result.data
// },
// error => {
// console.error(error)
// }
// )
},
}
}
</script>
<style>
</style>
\ No newline at end of file
<template>
<div id="products-list" class="container">
<div>
<div class="">
<h1 class="text-center">Product List</h1>
<!-- <table class="table">
<tr v-for="(line) in clients" v-bind:key="line.uuid" v-bind:title="line.numSS">
<td class="text-left">{{line.lastName}}</td>
<td class="text-left">{{line.firstName}}</td>
<td class="text-left">{{ $d(new Date(line.birthDate), "short") }}</td>
<td class="text right">
<button class="btn btn-info" v-on:click="editClient(line)">{{$t('buttons.edit-button')}}</button>
<button class="btn btn-danger" v-on:click="deleteClient(line.uuid)">{{$t('buttons.delete-button')}}</button>
</td>
</tr>
</table> -->
</div>
</div>
</div>
</template>
<script>
export default {
name: 'Products',
data () {
return {}
},
mounted () {
this.getProducts()
},
methods: {
getProducts () {
// Call API
// axios.get('/api/clients').then(
// result => {
// console.log(result.data)
// this.clients = result.data
// },
// error => {
// console.error(error)
// }
// )
}
}
}
</script>
<style>
</style>
\ No newline at end of file
......@@ -3,7 +3,8 @@
"locale": "English",
"openPharma": "OpenPharma",
"clients": "Clients",
"lang": "en"
"lang": "en",
"products": "Products"
},
"buttons": {
"yes-button": "Yes",
......
......@@ -3,7 +3,10 @@
"lang": "fr",
"locale": "Français",
"openPharma": "OpenPharma",
"clients": "Patients"
"views": {
"clients": "Patients",
"products": "Produits"
}
},
"buttons": {
"yes-button": "Oui",
......
import Vue from 'vue'
import Router from 'vue-router'
import Home from '@/components/Home'
import Clients from '@/components/Clients'
import Client from '@/components/Client'
import Products from '@/components/Products'
Vue.use(Router)
export default new Router({
mode: 'history',
routes: [
{
path: '/',
name: 'Clients',
component: Clients
}
{ path: '/', name: 'Home', component: Home },
{ path: '/Clients', name: 'Clients', component: Clients },
{ path: '/Client/:uuid', name: 'Client', component: Client, props: { uuid: '' } },
{ path: '/Products', name: 'Products', component: Products }
]
})
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment