%PDF-
%PDF-
Mini Shell
Mini Shell
<template>
<div class="page-content">
<h2>Add Property Task</h2>
<form action="/tasks" method="POST" @submit.prevent="addtask()" class="task-form">
<div class="form-group">
<input type="text" placeholder="Enter Client Phone" v-model="searchQuery" @keyup="getData(searchQuery)" autocomplete="off" class="form-control input-lg" list="users"/>
<datalist id="users" >
<option v-for="user in users.data" :key='user' :value="user.id">{{user.name}}-{{user.phone }}</option>
</datalist>
</div>
<label for="">Select Source</label>
<div class="lt">
<ul>
<li><label class="checkbox-inline"><input type="radio" id="radio1" v-model="options" value="1" selected checked>Property</label></li>
<li><label class="checkbox-inline"><input type="radio" id="radio1" v-model="options" value="2" selected>Lead</label></li>
</ul>
</div>
<div class="form-group" v-if="options==1">
<label for="property">Select Property</label>
<select v-on:click="getclientProperties" v-model="property_name" class="form-control">
<option v-for="property in clientproperties" :key="property.id" v-bind:value="{ id: property.id, text: property.property_name }">{{property.property_name}}</option>
</select>
<!-- <select class="form-control tx" name="template" v-model="property_id">
<option v-for="property in clientproperties" :key="property.id" :value="property.id">
{{ property.property_name }}
</option>
</select> -->
</div>
<div class="form-group" v-else>
<label for="property">Select Lead</label>
<select v-on:click="getclientleads" class="form-control">
<option v-for="lead in clientleads" :key="lead" >{{lead.leadid}}</option>
</select>
</div>
<div class="form-group">
<label for="task">Task</label>
<input type="text" class="form-control" name="task" v-model="task" placeholder="Task">
</div>
<div class="form-group">
<label for="task">Task Description</label>
<textarea class="form-control" id="exampleFormControlTextarea1" rows="5" v-model="task_description"></textarea>
</div>
<div class="form-row">
<div class="form-group">
<label for="assigned">Assigned</label>
<select class="form-control tx" name="template" v-model="assigned">
<option v-for="staff in staffs" :key="staff.id" :value="staff.id">
{{ staff.name }}
</option>
</select>
</div>
</div>
<div class="form-row">
<div class="form-group">
<label for="duedatee">Due Date</label>
<input type="date" class="form-control" name="due_date" v-model="due_date">
</div>
</div>
<div class="form-group">
<label for="">Task Priority</label>
<select name="" v-model="priority">
<option value="1">Low</option>
<option value="2">Medium</option>
<option value="3">High</option>
</select>
</div>
<div class="form-group">
<input type="radio" name="" id="">Billable
<input type="radio" name="" id="">Non Billable
</div>
<button type="submit" value="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</template>
<script>
export default {
data(){
return{
task:'',
status:'',
assigned:'',
due_date:'',
staffs:[],
searchQuery:'',
priority:'',
options:'',
property_id:'',
property_name:'',
clientid:'',
task_description:'',
users:[],
clientproperties:[],
clientleads:[]
}
},
mounted() {
this. loadstaffs(),
this.loadtheusers()
},
methods: {
addtask(){
axios
.post('/tasks', {
client_id:this.searchQuery,
property_id:this.property_name.id,
property_name:this.property_name.text,
task: this.task,
description:this.task_description,
task_type:2,
status:1,
priority:this.priority,
assigned:this.assigned,
assignee:this.clientid,
due_date:this.due_date
}) .then(response => {
this.$toaster.success('Task Added'),
this.$router.push({ path: '/allpropertytasks'})
})
},
getData:function(searchQuery) {
this.isLoading = true;
axios.get('client/searchquery?q=' + searchQuery)
.then(response => {
this.users = response.data;
});
},
getclientProperties(){
axios.get('/properties/clientproperties/'+ this.searchQuery)
.then(response => {
this.clientproperties = response.data;
});
},
getclientleads(){
axios.get('/leads/getclientleads/'+ this.searchQuery)
.then(response => {
this.clientleads = response.data;
});
},
loadstaffs(){
axios.get('/users') .then(response => {
this.staffs = response.data;
})
},
loadtheusers(){
axios.get('/dashboard').then(response =>{
this.clientid=response.data.name;
});
},
}
}
</script>
<style scoped>
.lt ul{
list-style: none;
margin: 0;
padding: 0;
}
.lt li{
display: inline-block;
}
</style>
Zerion Mini Shell 1.0