<template>
|
<div class="patch-dlg flex flex-col bg-gray-100 font-sans w-[434px] h-[389px] border border-gray-400">
|
|
<!-- Scanner Settings GroupBox -->
|
<fieldset class="scanner-gb border border-gray-400 m-2 p-2 relative h-[216px]">
|
<legend class="text-black text-base px-1">掃描器設定</legend>
|
|
<div class="relative h-full">
|
<!-- DPI Setting -->
|
<label class="absolute left-[19px] top-[7px] text-base">DPI</label>
|
<select class="absolute left-[57px] top-[4px] w-[120px] h-[24px] border border-gray-400 bg-white"
|
v-model="dpi" :disabled="!isDpiEnabled" @keypress="ComboBox1KeyPress" @blur="ComboBox1Exit">
|
<option value="75">75</option>
|
<option value="100">100</option>
|
<option value="150">150</option>
|
<option value="180">180</option>
|
<option value="200">200</option>
|
<option value="240">240</option>
|
<option value="300">300</option>
|
<option value="360">360</option>
|
<option value="400">400</option>
|
<option value="600">600</option>
|
<option value="720">720</option>
|
</select>
|
|
<!-- Checkboxes -->
|
<label class="absolute left-[16px] top-[60px] flex items-center space-x-1">
|
<input type="checkbox" v-model="borderClear" />
|
<span>清黑邊</span>
|
</label>
|
|
<label class="absolute left-[161px] top-[37px] flex items-center space-x-1">
|
<input type="checkbox" v-model="deskew" />
|
<span>傾斜校正</span>
|
</label>
|
|
<label class="absolute left-[161px] top-[60px] flex items-center space-x-1">
|
<input type="checkbox" v-model="reverse" />
|
<span>影像是否需反相</span>
|
</label>
|
|
<label class="absolute left-[16px] top-[37px] flex items-center space-x-1">
|
<input type="checkbox" v-model="duplex" disabled />
|
<span class="text-gray-500">雙面掃描</span>
|
</label>
|
|
<!-- Image Adjustment GroupBox -->
|
<fieldset class="absolute bottom-[47px] left-0 w-full h-[64px] border border-gray-400 p-1">
|
<legend class="text-black text-sm px-1">掃描器亮度對比調整</legend>
|
<div class="flex items-center space-x-4 h-full px-2">
|
<label class="flex items-center space-x-1">
|
<input type="checkbox" v-model="imgSetUse" />
|
<span>啟用</span>
|
</label>
|
|
<div class="flex items-center space-x-1">
|
<label>亮度</label>
|
<input type="number" v-model.number="bright" min="-127" max="127" class="w-[60px] border border-gray-400 p-1" />
|
</div>
|
|
<div class="flex items-center space-x-1">
|
<label>對比</label>
|
<input type="number" v-model.number="contrast" min="-127" max="127" class="w-[65px] border border-gray-400 p-1" />
|
</div>
|
</div>
|
</fieldset>
|
|
<!-- Scan Show Mode RadioGroup -->
|
<fieldset class="absolute bottom-0 left-0 w-full h-[47px] border border-gray-400 p-1">
|
<legend class="text-black text-sm px-1">掃描時影像顯示</legend>
|
<div class="flex items-center justify-around h-full">
|
<label><input type="radio" v-model="scanShowMode" value="0" /> 清楚影像(慢)</label>
|
<label><input type="radio" v-model="scanShowMode" value="1" /> 模糊影像(普通)</label>
|
<label><input type="radio" v-model="scanShowMode" value="2" /> 無影像(超快)</label>
|
</div>
|
</fieldset>
|
</div>
|
</fieldset>
|
|
<!-- Scan Rotate RadioGroup -->
|
<fieldset class="border border-gray-400 mx-2 mb-2 p-1 h-[56px] flex-none">
|
<legend class="text-black text-base px-1">掃描時旋轉</legend>
|
<div class="flex items-center justify-around h-full pt-1">
|
<label><input type="radio" v-model="scanRotate" value="0" /> 無</label>
|
<label><input type="radio" v-model="scanRotate" value="1" /> 左轉90度</label>
|
<label><input type="radio" v-model="scanRotate" value="2" /> 轉180度</label>
|
<label><input type="radio" v-model="scanRotate" value="3" /> 右轉90度</label>
|
</div>
|
</fieldset>
|
|
<!-- Blank Page Deletion GroupBox -->
|
<fieldset class="border border-gray-400 mx-2 mb-2 p-2 flex-1 relative">
|
<legend class="text-black text-base px-1">空白頁刪除</legend>
|
<div class="relative w-full h-full">
|
<label class="absolute left-[16px] top-[12px] flex items-center space-x-1">
|
<input type="checkbox" v-model="blankUse" @change="BlankuseCBClick" />
|
<span>啟用</span>
|
</label>
|
|
<input type="number" v-model.number="blankSize" :disabled="!blankUse" min="0"
|
class="absolute left-[95px] top-[11px] w-[78px] h-[26px] border border-gray-400 p-1 disabled:bg-gray-200" />
|
|
<label class="absolute left-[177px] top-[16px] text-base">Bytes</label>
|
|
<!-- Buttons -->
|
<div class="absolute bottom-2 left-0 w-full flex justify-between px-2">
|
<button class="w-[75px] h-[25px] border border-gray-400 bg-gray-200 hover:bg-gray-300" @click="DefaultBtClick">預設值</button>
|
<div class="space-x-2">
|
<button class="w-[61px] h-[25px] border border-gray-400 bg-gray-200 hover:bg-gray-300" @click="OkBtClick">確定</button>
|
<button class="w-[64px] h-[25px] border border-gray-400 bg-gray-200 hover:bg-gray-300" @click="CancelBtClick">取消</button>
|
</div>
|
</div>
|
</div>
|
</fieldset>
|
|
</div>
|
<div class="patch-dlg-layout flex flex-col bg-gray-100 font-sans w-[434px] h-[389px] border border-gray-400">
|
<img src="assets/CB_PatchFom.png"/>
|
</div>
|
</template>
|
|
<script lang="ts">
|
import { defineComponent } from 'vue';
|
import { usePatchFomLogic } from './PatchFom.ts';
|
|
export default defineComponent({
|
name: 'PatchDlg',
|
setup() {
|
const logic = usePatchFomLogic();
|
return { ...logic };
|
}
|
});
|
</script>
|
|
<style scoped>
|
/* Scoped styles if needed */
|
.patch-dlg-layout {
|
opacity: 0.2;
|
position: absolute;
|
left: auto;
|
right: auto;
|
top: 314px;
|
}
|
</style>
|
