Мутим формы
This commit is contained in:
parent
2d4151847c
commit
34becd64a0
|
@ -26,6 +26,7 @@ class ComputerController extends Controller
|
|||
'user_id' => 'required|exists:users,id',
|
||||
'name' => 'required|string|max:256',
|
||||
'cpu' => 'nullable|string|max:256',
|
||||
'ram' => 'nullable|string|max:256',
|
||||
'motherboard' => 'nullable|string|max:256',
|
||||
'gpu' => 'nullable|string|max:256',
|
||||
'additional_info' => 'nullable|string|max:256',
|
||||
|
@ -41,6 +42,7 @@ class ComputerController extends Controller
|
|||
'id' => 'required|exists:computers,id',
|
||||
'name' => 'required|string|max:256',
|
||||
'cpu' => 'nullable|string|max:256',
|
||||
'ram' => 'nullable|string|max:256',
|
||||
'motherboard' => 'nullable|string|max:256',
|
||||
'gpu' => 'nullable|string|max:256',
|
||||
'additional_info' => 'nullable|string|max:256',
|
||||
|
@ -60,10 +62,11 @@ class ComputerController extends Controller
|
|||
public function destroy(Request $request)
|
||||
{
|
||||
$request->validate([
|
||||
'id' => 'required|exists:wishes,id',
|
||||
'id' => 'required|exists:computers,id',
|
||||
]);
|
||||
$computer = Computer::find($request->get('id'));
|
||||
JobController::destroyByComputerId($computer);
|
||||
$destroyed = Computer::destroy($request->get('id'));
|
||||
return response()->json($destroyed, 204);
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
namespace App\Http\Controllers;
|
||||
|
||||
use App\Models\Job;
|
||||
use App\Models\Computer;
|
||||
use Illuminate\Http\Request;
|
||||
|
||||
class JobController extends Controller
|
||||
|
@ -53,4 +54,14 @@ class JobController extends Controller
|
|||
$destroyed = Job::destroy($request->get('id'));
|
||||
return response()->json($destroyed, 204);
|
||||
}
|
||||
|
||||
public static function destroyByComputerId(Computer $computer)
|
||||
{
|
||||
$computerId = $computer->id;
|
||||
$jobs = Job::select()->where('computer_id', '=', $computerId)->get();
|
||||
foreach ($jobs as $job){
|
||||
Job::destroy($job->id);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -8,7 +8,7 @@ use Illuminate\Database\Eloquent\Model;
|
|||
class Computer extends Model
|
||||
{
|
||||
use HasFactory;
|
||||
protected $fillable = ['user_id', 'name', 'cpu', 'motherboard', 'gpu', 'additional_info'];
|
||||
protected $fillable = ['user_id', 'name', 'cpu', 'ram', 'motherboard', 'gpu', 'additional_info'];
|
||||
|
||||
public function user(){
|
||||
return $this->belongsTo(User::class);
|
||||
|
|
|
@ -17,6 +17,7 @@ return new class extends Migration
|
|||
$table->foreign('user_id')->references('id')->on('users');
|
||||
$table->string('name', length: 256);
|
||||
$table->string('cpu', length: 256)->nullable();
|
||||
$table->string('ram', length: 256)->nullable();
|
||||
$table->string('motherboard', length: 256)->nullable();
|
||||
$table->string('gpu', length: 256)->nullable();
|
||||
$table->string('additional_info', length: 256)->nullable();
|
||||
|
|
|
@ -44,7 +44,6 @@
|
|||
<RouterView v-slot="{ Component }">
|
||||
<Component
|
||||
:is="Component"
|
||||
:is-wide="isWide"
|
||||
/>
|
||||
</RouterView>
|
||||
</v-sheet>
|
||||
|
@ -93,6 +92,11 @@ export default {
|
|||
this.userStore.checkUser();
|
||||
watch(this.userStore, (newStore)=>{
|
||||
this.authenticated = newStore.user !== null && newStore.user !== undefined;
|
||||
if (!this.authenticated){
|
||||
this.$router.push('/login');
|
||||
} else {
|
||||
this.$router.push('/');
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -34,7 +34,7 @@ export const useComputersStore = defineStore('computers', {
|
|||
this.computers = response.data;
|
||||
})
|
||||
},
|
||||
async create(name, cpu, motherboard, gpu, additional_info){
|
||||
async create(name, cpu, ram, motherboard, gpu, additional_info){
|
||||
if (this.token === null){
|
||||
this.checkToken();
|
||||
}
|
||||
|
@ -42,6 +42,7 @@ export const useComputersStore = defineStore('computers', {
|
|||
user_id: useUserStore().user['id'],
|
||||
name: name,
|
||||
cpu: cpu,
|
||||
ram: ram,
|
||||
motherboard: motherboard,
|
||||
gpu: gpu,
|
||||
additional_info: additional_info,
|
||||
|
@ -56,6 +57,24 @@ export const useComputersStore = defineStore('computers', {
|
|||
}).catch(()=>{
|
||||
return false;
|
||||
});
|
||||
},
|
||||
async delete(id){
|
||||
if (this.token === null){
|
||||
this.checkToken();
|
||||
}
|
||||
await axios.post('/api/data/computers/delete', {
|
||||
id: id,
|
||||
}, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${this.token}`,
|
||||
token: this.token
|
||||
},
|
||||
}).then(()=>{
|
||||
this.getComputerList(useUserStore().user['id']);
|
||||
return true;
|
||||
}).catch(()=>{
|
||||
return false;
|
||||
});
|
||||
}
|
||||
},
|
||||
})
|
||||
|
|
|
@ -16,6 +16,7 @@ export default {
|
|||
return {
|
||||
computerName: null,
|
||||
computerCpu: null,
|
||||
computerRam: null,
|
||||
computerMotherboard: null,
|
||||
computerGpu: null,
|
||||
computerAdditional: null,
|
||||
|
@ -34,6 +35,7 @@ export default {
|
|||
this.computersStore.create(
|
||||
this.computerName,
|
||||
this.computerCpu,
|
||||
this.computerRam,
|
||||
this.computerMotherboard,
|
||||
this.computerGpu,
|
||||
this.computerAdditional
|
||||
|
@ -48,15 +50,19 @@ export default {
|
|||
|
||||
<template>
|
||||
<v-card class="main-bg">
|
||||
<v-card-title>Создание нового компьютера</v-card-title>
|
||||
<v-card-title class="d-flex justify-space-between">
|
||||
<span>Создание нового компьютера</span>
|
||||
<v-icon @click="dialogClose" class="cursor-pointer" icon="mdi-close-thick"></v-icon>
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
<v-text-field :rules="[rules.notNull]" label="Название" v-model="computerName" placeholder="Мой компьютер"></v-text-field>
|
||||
<v-text-field label="CPU" v-model="computerCpu" placeholder="Intel Core i5-12400F"></v-text-field>
|
||||
<v-text-field label="Оперативная память" v-model="computerRam" placeholder="Kingston Fury 2x16GB DDR4"></v-text-field>
|
||||
<v-text-field label="Материнская плата" v-model="computerMotherboard" placeholder="Asus ROG B650"></v-text-field>
|
||||
<v-text-field label="Gpu" v-model="computerGpu" placeholder="Nvidia RTX 3060ti"></v-text-field>
|
||||
<v-textarea label="Дополнительная информация" v-model="computerAdditional"></v-textarea>
|
||||
<div class="d-flex justify-center">
|
||||
<v-btn :loading="loading" @click="createComputer">Создать</v-btn>
|
||||
<v-btn color="#F0A068FF" :loading="loading" @click="createComputer">Создать</v-btn>
|
||||
</div>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
|
|
|
@ -4,7 +4,7 @@ import { useUserStore } from '../store/auth.js';
|
|||
import {useComputersStore} from "../store/computers.js";
|
||||
import CreateForm from './Computers/CreateForm.vue';
|
||||
export default {
|
||||
name: "About",
|
||||
name: "ComputersList",
|
||||
components: {CreateForm},
|
||||
data() {
|
||||
return {
|
||||
|
@ -13,9 +13,12 @@ export default {
|
|||
computerList: [],
|
||||
createDialogShow: false,
|
||||
editDialogShow: false,
|
||||
deleteDialogShow: false,
|
||||
fetching: false,
|
||||
authenticated: false,
|
||||
editLoading: false
|
||||
editLoading: false,
|
||||
deleteLoading: false,
|
||||
computerToDeleteId: null
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
@ -27,6 +30,19 @@ export default {
|
|||
},
|
||||
showEditDialog(){
|
||||
this.editDialogShow = true;
|
||||
},
|
||||
showDeleteDialog(id){
|
||||
this.deleteDialogShow = true;
|
||||
this.computerToDeleteId = id;
|
||||
},
|
||||
hideDeleteDialog(){
|
||||
this.deleteDialogShow = false;
|
||||
},
|
||||
deleteComputer(){
|
||||
this.deleteLoading = true;
|
||||
this.computersStore.delete(this.computerToDeleteId).then(()=>{
|
||||
this.deleteLoading = false;
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
@ -35,13 +51,19 @@ export default {
|
|||
this.fetching = true;
|
||||
this.authenticated = newStore.user !== null && newStore.user !== undefined;
|
||||
this.computersStore.setToken(this.userStore.token);
|
||||
if (this.userStore.user['id']){
|
||||
if (this.userStore.user !== null){
|
||||
this.computersStore.getComputerList(this.userStore.user['id']).then(()=>{
|
||||
this.computerList = this.computersStore.computers;
|
||||
this.fetching = false;
|
||||
})
|
||||
}
|
||||
});
|
||||
watch(this.computersStore, (newStore)=>{
|
||||
this.fetching = true;
|
||||
this.computerList = this.computersStore.computers;
|
||||
this.fetching = false;
|
||||
this.hideDeleteDialog();
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
@ -56,15 +78,19 @@ export default {
|
|||
<v-card-title>{{ computer['name'] }}</v-card-title>
|
||||
<v-card-text class="d-flex flex-column cursor-pointer">
|
||||
<v-label class="cursor-pointer">CPU: {{ computer['cpu'] }}</v-label>
|
||||
<v-label class="cursor-pointer">RAM: {{ computer['ram'] }}</v-label>
|
||||
<v-label class="cursor-pointer">Motherboard: {{ computer['motherboard'] }}</v-label>
|
||||
<v-label class="cursor-pointer">GPU: {{ computer['gpu'] }}</v-label>
|
||||
<v-label class="cursor-pointer">Дополнительная информация: {{ computer['additional_info'] }}</v-label>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</router-link>
|
||||
<div @click="showEditDialog" class="card-bg align-self-stretch pa-2 d-flex justify-center align-center rounded-sm">
|
||||
<div @click="showEditDialog" class="card-bg align-self-stretch pa-2 d-flex justify-center align-center rounded-sm cursor-pointer mr-2 ml-2">
|
||||
<v-icon icon="mdi-pencil"></v-icon>
|
||||
</div>
|
||||
<div @click="showDeleteDialog(computer['id'])" class="card-bg align-self-stretch pa-2 d-flex justify-center align-center rounded-sm cursor-pointer mr-2 ml-2">
|
||||
<v-icon icon="mdi-trash-can"></v-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-100 pa-5" v-if="!fetching">
|
||||
|
@ -73,9 +99,21 @@ export default {
|
|||
</v-btn>
|
||||
</div>
|
||||
</div>
|
||||
<v-dialog :model-value="createDialogShow">
|
||||
<v-dialog v-model="createDialogShow">
|
||||
<CreateForm :dialogClose="hideCreateDialog" />
|
||||
</v-dialog>
|
||||
<v-dialog v-model="deleteDialogShow" class="w-33">
|
||||
<v-card class="main-bg">
|
||||
<v-card-text class="d-flex flex-column">
|
||||
<v-label class="w-100 text-h5">Вы уверены?</v-label>
|
||||
<v-label class="w-100">Это действие удалит компьютер и все действия связанные с ним</v-label>
|
||||
<div class="d-flex w-100 justify-center">
|
||||
<v-btn color="#F0A068FF" class="ma-2" :loading="deleteLoading" @click="deleteComputer">Да</v-btn>
|
||||
<v-btn color="#F0A068FF" class="ma-2" @click="hideDeleteDialog">Нет</v-btn>
|
||||
</div>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
|
Loading…
Reference in New Issue