@ -0,0 +1,233 @@ |
|||
<?php |
|||
include("../header.php"); |
|||
require_once("./conn.php"); |
|||
?> |
|||
<link rel="stylesheet" href="./styles/style.css"> |
|||
<link rel="stylesheet" href="semantic/dist/semantic.min.css"> |
|||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" /><script defer src="./js/alpinejs/cdn.min.js"></script> |
|||
<script defer src="./js/alpinejs/cdn.min.js"></script> |
|||
<script src="./js/axios/axios.min.js" integrity="sha512-aoTNnqZcT8B4AmeCFmiSnDlc4Nj/KPaZyB5G7JnOnUEkdNpCZs1LCankiYi01sLTyWy+m2P+W4XM+BuQ3Q4/Dg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> |
|||
|
|||
|
|||
<div class="contract-input-component" x-data="{ |
|||
init(){ |
|||
}, |
|||
data:{ |
|||
contractno:'D23080110', |
|||
customer:'', |
|||
manager:'', |
|||
vat:'', |
|||
case_name:'', |
|||
linkman:'', |
|||
lm_tel:'', |
|||
address:'', |
|||
salesman:'', |
|||
files:[], |
|||
}, |
|||
step:1, |
|||
isLoading:false, |
|||
nextStepFn(){ |
|||
this.isLoading = true |
|||
if(this.step == 1){ |
|||
axios.get('./api/getContractData.php?contracttype=m&contractno=' + this.data.contractno).then(res=>{ |
|||
if(res.data){ |
|||
console.log(res.data); |
|||
this.data.customer = res.data.customer |
|||
this.data.manager = res.data.manager |
|||
this.data.vat = res.data.uscc |
|||
this.data.case_name = res.data.case_name |
|||
this.data.linkman = res.data.linkman |
|||
this.data.lm_tel = res.data.lm_tel |
|||
this.data.address = res.data.address |
|||
this.data.salesman = res.data.salesman |
|||
this.isLoading = false |
|||
this.step = 2 |
|||
} |
|||
}).catch(err=>{ |
|||
console.error(err) |
|||
this.isLoading = false |
|||
}) |
|||
|
|||
} |
|||
}, |
|||
nextStepKeyupFn(){ |
|||
if(e.keyCode !== 13) return |
|||
if(this.step == 1){ |
|||
this.step = 2 |
|||
} |
|||
}, |
|||
preStepFn(){ |
|||
if(this.step == 2){ |
|||
this.step = 1 |
|||
} |
|||
}, |
|||
save(){ |
|||
this.isLoading = true |
|||
const form = new FormData(); |
|||
form.append('contractno', this.data.contractno); |
|||
form.append('customer', this.data.customer); |
|||
form.append('manager', this.data.manager); |
|||
form.append('vat', this.data.vat); |
|||
form.append('case_name', this.data.case_name); |
|||
form.append('linkman', this.data.linkman); |
|||
form.append('lm_tel', this.data.lm_tel); |
|||
form.append('address', this.data.address); |
|||
form.append('salesman', this.data.salesman); |
|||
form.append('contracttype', 'm'); |
|||
form.append('user_id', '<?php echo $user_id; ?>'); |
|||
|
|||
for (var i = 0; i < this.data.files.length; i++) { |
|||
form.append('files[]', this.data.files[i]); |
|||
} |
|||
axios.post('./api/postContractData.php', form).then(res=>{ |
|||
console.log(res.data); |
|||
if(res.status === 201){ |
|||
alert('儲存成功') |
|||
} |
|||
this.isLoading = false |
|||
}).catch(error=>{ |
|||
let code = error.response.status; |
|||
if(code == 422){ |
|||
this.fail_arr = error.response.data |
|||
this.errorFn(); |
|||
} |
|||
|
|||
this.isLoading = false |
|||
}) |
|||
}, |
|||
errorFn(){ |
|||
let msg = '' |
|||
for(let i = 0; i < this.fail_arr.length; i++){ |
|||
msg += this.fail_arr[i] + '、' |
|||
} |
|||
alert(msg) |
|||
}, |
|||
uploadFiles(e){ |
|||
this.data.files = e.target.files |
|||
}, |
|||
}"> |
|||
<div class="form" method="post" id="form" enctype="multipart/form-data" > |
|||
<input type="hidden" name='form_name' value="main_form" /> |
|||
<div> |
|||
<table class="table table-bordered query-table table-striped table-bordered display compact" style="width:99%;margin-left:.5%"> |
|||
<thead> |
|||
<tr> |
|||
<td colspan="9"> |
|||
<h3 style='text-align:center'>合約入力(新梯)</h3> |
|||
</td> |
|||
</tr> |
|||
</thead> |
|||
<template x-if="step==1"> |
|||
<tbody style="font-weight: bolder;margin-bottom: 20px" x-show="step==1"> |
|||
<tr> |
|||
<td style="vertical-align: middle">合約號</td> |
|||
<td> |
|||
<input class="form-control" @keyup="nextStepKeyupFn($event)" type="text" name="contractno" x-model="data.contractno" > |
|||
</td> |
|||
<td style="vertical-align: middle"> |
|||
<label for="customize"> |
|||
<input type="checkbox" x-model="customize" id="customize" />自定義欄位 |
|||
</label> |
|||
</td> |
|||
|
|||
</tr> |
|||
</tbody> |
|||
</template> |
|||
<template x-if="step==2"> |
|||
<tbody style="font-weight: bolder;margin-bottom: 20px" x-show="step==2"> |
|||
<tr> |
|||
<td colspan="7" style='vertical-align: middle;border-right:0px;'> |
|||
<h4>業務確認項</h4> |
|||
</td> |
|||
<td class="text-right" style='border-left:0px;'> |
|||
<button type="button" id="btn_close" class="btn btn-default" onclick="window.history.back();">返回</button> |
|||
<button type="button" id="btn_close" class="btn btn-default" onclick="window.close();">關閉分頁</button> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td style="vertical-align: middle">客戶名稱</td> |
|||
<td> |
|||
<input class="form-control disabled_select" type="text" name="uscc" x-model="data.customer" > |
|||
<p class="alerttext" x-show="data.customer==''"><i class="fa-solid fa-circle-xmark"></i>未填寫</p> |
|||
</td> |
|||
<td style="vertical-align: middle">負責人</td> |
|||
<td> |
|||
<input class="form-control disabled_select" type="text" name="uscc" x-model="data.manager" > |
|||
<p class="alerttext" x-show="data.manager==''"><i class="fa-solid fa-circle-xmark"></i>未填寫</p> |
|||
</td> |
|||
<td style="vertical-align: middle">統一編號/身分證</td> |
|||
<td> |
|||
<input class="form-control disabled_select" type="text" name="uscc" x-model="data.vat" > |
|||
<p class="alerttext" x-show="data.vat==''"><i class="fa-solid fa-circle-xmark"></i>未填寫</p> |
|||
</td> |
|||
<td style="vertical-align: middle">營業員工號</td> |
|||
<td style="vertical-align: middle"> |
|||
<input class="form-control disabled_select" type="text" name="uscc" x-model="data.salesman" > |
|||
<p class="alerttext" x-show="data.case_name==''"><i class="fa-solid fa-circle-xmark"></i>未填寫</p> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td style="vertical-align: middle">聯繫人</td> |
|||
<td> |
|||
<input class="form-control disabled_select" type="text" name="uscc" x-model="data.linkman" > |
|||
<p class="alerttext" x-show="data.linkman==''"><i class="fa-solid fa-circle-xmark"></i>未填寫</p> |
|||
</td> |
|||
<td style="vertical-align: middle">聯繫人電話</td> |
|||
<td> |
|||
<input class="form-control disabled_select" type="text" name="uscc" x-model="data.lm_tel" > |
|||
<p class="alerttext" x-show="data.lm_tel==''"><i class="fa-solid fa-circle-xmark"></i>未填寫</p> |
|||
</td> |
|||
<td style="vertical-align: middle">案件名稱</td> |
|||
<td colspan=3> |
|||
<input class="form-control disabled_select" type="text" name="uscc" x-model="data.case_name" > |
|||
<p class="alerttext" x-show="data.salesman==''"><i class="fa-solid fa-circle-xmark"></i>未填寫</p> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td style="vertical-align: middle">地址</td> |
|||
<td colspan=3> |
|||
<input class="form-control disabled_select" type="text" name="uscc" x-model="data.address" > |
|||
<p class="alerttext" x-show="data.address==''"><i class="fa-solid fa-circle-xmark"></i>未填寫</p> |
|||
</td> |
|||
<td style="vertical-align: middle">附件上傳</td> |
|||
<td colspan=3> |
|||
<input type="file" name="file[]" multiple draggable="true" @change="uploadFiles($event)" /> |
|||
<p class="alerttext" x-show="data.lm_tel==''"><i class="fa-solid fa-circle-xmark"></i>未填寫</p> |
|||
</td> |
|||
</tr> |
|||
</tbody> |
|||
</template> |
|||
</table> |
|||
<button x-show="step==2" @click="save()" :disabled="isLoading" type="button" class="btn btn-primary btn-lg pull-right savebtn"> |
|||
<template x-if="!isLoading"> |
|||
<span>存檔</span> |
|||
</template> |
|||
<template x-if="isLoading"> |
|||
<div class="loader"></div> |
|||
</template> |
|||
</button> |
|||
<button x-show="step<=1" @click="nextStepFn()" type="button" class="btn btn-primary btn-lg pull-right savebtn" :disabled="isLoading"> |
|||
<template x-if="!isLoading"> |
|||
<span>下一步</span> |
|||
</template> |
|||
<template x-if="isLoading"> |
|||
<div class="loader"></div> |
|||
</template> |
|||
</button> |
|||
<button x-show="step>1" @click="preStepFn()" :disabled="isLoading" type="button" class="btn btn-primary btn-lg pull-right savebtn"> |
|||
<template x-if="!isLoading"> |
|||
<span>上一步</span> |
|||
</template> |
|||
<template x-if="isLoading"> |
|||
<div class="loader"></div> |
|||
</template> |
|||
</button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<script |
|||
src="./js/jquery/jquery-3.1.1.min.js" |
|||
integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" |
|||
crossorigin="anonymous"></script> |
|||
<script src="semantic/dist/semantic.min.js" ></script> |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 36 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 36 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 18 KiB |