From 36490c47974115280dd50d2cb32219e429885684 Mon Sep 17 00:00:00 2001 From: wangzhongjie Date: Thu, 5 Jun 2025 14:59:10 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BC=98=E5=8C=96=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E7=BB=93=E6=9E=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../main/ets/pages/VideoConfig/CheckBox.ets | 17 ++ .../src/main/ets/pages/VideoConfig/Config.ets | 240 +++--------------- .../src/main/ets/pages/VideoConfig/Label.ets | 11 + .../ets/pages/VideoConfig/RouteSetting.ets | 129 ++++++++++ .../main/ets/pages/VideoConfig/TextInput.ets | 22 ++ 5 files changed, 214 insertions(+), 205 deletions(-) create mode 100644 entry/src/main/ets/pages/VideoConfig/CheckBox.ets create mode 100644 entry/src/main/ets/pages/VideoConfig/Label.ets create mode 100644 entry/src/main/ets/pages/VideoConfig/RouteSetting.ets create mode 100644 entry/src/main/ets/pages/VideoConfig/TextInput.ets diff --git a/entry/src/main/ets/pages/VideoConfig/CheckBox.ets b/entry/src/main/ets/pages/VideoConfig/CheckBox.ets new file mode 100644 index 0000000..3e5cb3e --- /dev/null +++ b/entry/src/main/ets/pages/VideoConfig/CheckBox.ets @@ -0,0 +1,17 @@ +@Component +export default struct CheckboxComponent { + @State value: boolean = false + change?: (value: boolean) => void + + build() { + Checkbox({ name: 'checkbox1', group: 'checkboxGroup' }) + .width(40) + .height(40) + .select(this.value) + .onChange((value: boolean) => { + console.info('Checkbox1 change is' + value) + this.value = value; + this.change?.(value); + }) + } +} \ No newline at end of file diff --git a/entry/src/main/ets/pages/VideoConfig/Config.ets b/entry/src/main/ets/pages/VideoConfig/Config.ets index 4ed5b64..6242c03 100644 --- a/entry/src/main/ets/pages/VideoConfig/Config.ets +++ b/entry/src/main/ets/pages/VideoConfig/Config.ets @@ -1,4 +1,9 @@ import { VideoConfig } from '../../model'; +import CheckboxComponent from './CheckBox'; +import LabelComponent from './Label'; +import routeSettingComponent from './RouteSetting'; +import TextInputComponent from './TextInput'; + @CustomDialog export default struct VideoConfigComponent { @@ -28,53 +33,53 @@ export default struct VideoConfigComponent { Column() { // 第一行 Row() { - labelComponent({ + LabelComponent({ text: "视频路数", }) - textInputComponent({ + TextInputComponent({ value: this.videoConfig?.videoNum, change: (value: string) => { this.videoConfig.videoNum = value; } }) partitionSpace() - checkboxComponent({ + CheckboxComponent({ value: this.videoConfig.faceFlag, change: (value: boolean) => { this.videoConfig.faceFlag = value; } }) - labelComponent({ + LabelComponent({ text: "启用人脸对比" }) - textInputComponent({ + TextInputComponent({ value: this.videoConfig.rlls, change: (value: string) => { this.videoConfig.rlls = value; } }) partitionSpace() - labelComponent({ + LabelComponent({ text: "拍照通道" }) - textInputComponent({ + TextInputComponent({ value: this.videoConfig.pztd, change: (value: string) => { this.videoConfig.pztd = value; } }) partitionSpace() - labelComponent({ + LabelComponent({ text: "设备类型" }) - textInputComponent({ + TextInputComponent({ value: "海康" }) partitionSpace() - labelComponent({ + LabelComponent({ text: "视频遮挡报警阈值" }) - textInputComponent({ + TextInputComponent({ value: this.videoConfig.zdyz, change: (value: string) => { this.videoConfig.zdyz = value; @@ -123,49 +128,49 @@ export default struct VideoConfigComponent { // 第三行 Row() { - checkboxComponent({ + CheckboxComponent({ value: this.videoConfig.shuiying, change: (value: boolean) => { this.videoConfig.shuiying = value; } }) - labelComponent({ + LabelComponent({ text: "照片叠加文字" }) partitionSpace() - labelComponent({ + LabelComponent({ text: "位置" }) - textInputComponent({ + TextInputComponent({ value: this.videoConfig.wz, change: (value: string) => { this.videoConfig.wz = value; } }) partitionSpace() - labelComponent({ + LabelComponent({ text: "叠加内容" }) - textInputComponent({ + TextInputComponent({ value: this.videoConfig.text1, change: (value: string) => { this.videoConfig.text1 = value; } }) - labelComponent({ + LabelComponent({ text: "+" }) - textInputComponent({ + TextInputComponent({ value: this.videoConfig.text2, change: (value: string) => { this.videoConfig.text2 = value; } }) - labelComponent({ + LabelComponent({ text: "+" }) - textInputComponent({ + TextInputComponent({ value: this.videoConfig.text3, change: (value: string) => { this.videoConfig.text3 = value; @@ -173,20 +178,20 @@ export default struct VideoConfigComponent { }) partitionSpace() partitionSpace() - labelComponent({ + LabelComponent({ text: "分隔符" }) - textInputComponent({ + TextInputComponent({ value: this.videoConfig.dolt, change: (value: string) => { this.videoConfig.dolt = value; } }) partitionSpace() - labelComponent({ + LabelComponent({ text: "文字大小" }) - textInputComponent({ + TextInputComponent({ value: this.videoConfig.fontSize, change: (value: string) => { this.videoConfig.fontSize = value; @@ -206,148 +211,6 @@ export default struct VideoConfigComponent { } } -@Component -struct routeSettingComponent { - @State title: string = "录像范围" - @Prop videoConfig: VideoConfig - change?: (value: VideoConfig) => void - - build() { - Row() { - Row() { - Text(this.title).fontSize(24) - }.width(150).justifyContent(FlexAlign.End) - - Flex({ - wrap: FlexWrap.Wrap - }) { - if (this.title === "录像范围") { - Row() { - labelComponent({ - text: "一路" - }) - checkboxComponent({ - value: this.videoConfig.videoRecord1, - change: (value: boolean) => { - this.videoConfig.videoRecord1 = value; - this.change?.(this.videoConfig); - } - }) - } - - Row() { - labelComponent({ - text: "二路" - }) - checkboxComponent({ - value: this.videoConfig.videoRecord2, - change: (value: boolean) => { - this.videoConfig.videoRecord2 = value; - this.change?.(this.videoConfig); - } - }) - } - - Row() { - labelComponent({ - text: "三路" - }) - checkboxComponent({ - value: this.videoConfig.videoRecord3, - change: (value: boolean) => { - this.videoConfig.videoRecord3 = value; - this.change?.(this.videoConfig); - } - }) - } - - Row() { - labelComponent({ - text: "四路" - }) - checkboxComponent({ - value: this.videoConfig.videoRecord4, - change: (value: boolean) => { - this.videoConfig.videoRecord4 = value; - this.change?.(this.videoConfig); - } - }) - } - } else { - Row() { - labelComponent({ - text: "一路" - }) - checkboxComponent({ - value: this.videoConfig.spzd1, - change: (value: boolean) => { - this.videoConfig.spzd1 = value; - this.change?.(this.videoConfig); - } - }) - } - - Row() { - labelComponent({ - text: "二路" - }) - checkboxComponent({ - value: this.videoConfig.spzd2, - change: (value: boolean) => { - this.videoConfig.spzd2 = value; - this.change?.(this.videoConfig); - } - }) - } - - Row() { - labelComponent({ - text: "三路" - }) - checkboxComponent({ - value: this.videoConfig.spzd3, - change: (value: boolean) => { - this.videoConfig.spzd3 = value; - this.change?.(this.videoConfig); - } - }) - } - - Row() { - labelComponent({ - text: "四路" - }) - checkboxComponent({ - value: this.videoConfig.spzd4, - change: (value: boolean) => { - this.videoConfig.spzd4 = value; - this.change?.(this.videoConfig); - } - }) - } - } - }.width(300) - }.justifyContent(FlexAlign.Start) - } -} - -@Component -struct checkboxComponent { - @State value: boolean = false - change?: (value: boolean) => void - - build() { - Checkbox({ name: 'checkbox1', group: 'checkboxGroup' }) - .width(40) - .height(40) - .select(this.value) - .onChange((value: boolean) => { - console.info('Checkbox1 change is' + value) - this.value = value; - this.change?.(value); - }) - } -} @Component struct blockComponent { @@ -360,27 +223,27 @@ struct blockComponent { }.width(100) // IP地址 - textInputComponent({ + TextInputComponent({ value: "", widthValue: 200 }) // 通道号 - textInputComponent({ + TextInputComponent({ value: "", widthValue: 100 }) // 用户名 - textInputComponent({ + TextInputComponent({ value: "", widthValue: 200 }) // 密码 - textInputComponent({ + TextInputComponent({ value: "", widthValue: 200 }) // 端口号 - textInputComponent({ + TextInputComponent({ value: "", widthValue: 100 }) @@ -390,39 +253,6 @@ struct blockComponent { } } -@Component -struct labelComponent { - @State text: string = "视频路数" - - build() { - Text(this.text) - .fontSize(24) - .fontWeight(FontWeight.Bold) - } -} - -@Component -struct textInputComponent { - @Prop value: string - @State widthValue: number = 120 - change?: (value: string) => void - - build() { - TextInput({ - text: this.value, - }) - .type(InputType.Normal) - .borderRadius(0) - .fontSize(20) - .width(this.widthValue) - .height(50) - .margin({ left: 15, right: 15 }) - .onChange((value) => { - this.value = value; - this.change?.(value); - }) - } -} @Component struct partitionSpace { diff --git a/entry/src/main/ets/pages/VideoConfig/Label.ets b/entry/src/main/ets/pages/VideoConfig/Label.ets new file mode 100644 index 0000000..4ef6b34 --- /dev/null +++ b/entry/src/main/ets/pages/VideoConfig/Label.ets @@ -0,0 +1,11 @@ +@Component +export default struct LabelComponent { + @State text: string = "视频路数" + + build() { + Text(this.text) + .fontSize(24) + .fontWeight(FontWeight.Bold) + } +} + diff --git a/entry/src/main/ets/pages/VideoConfig/RouteSetting.ets b/entry/src/main/ets/pages/VideoConfig/RouteSetting.ets new file mode 100644 index 0000000..4708961 --- /dev/null +++ b/entry/src/main/ets/pages/VideoConfig/RouteSetting.ets @@ -0,0 +1,129 @@ +import { VideoConfig } from '../../model' +import CheckboxComponent from './CheckBox' +import LabelComponent from './Label' + + +@Component +export default struct routeSettingComponent { + @State title: string = "录像范围" + @Prop videoConfig: VideoConfig + change?: (value: VideoConfig) => void + + build() { + Row() { + Row() { + Text(this.title).fontSize(24) + }.width(150).justifyContent(FlexAlign.End) + + Flex({ + wrap: FlexWrap.Wrap + }) { + if (this.title === "录像范围") { + Row() { + LabelComponent({ + text: "一路" + }) + CheckboxComponent({ + value: this.videoConfig.videoRecord1, + change: (value: boolean) => { + this.videoConfig.videoRecord1 = value; + this.change?.(this.videoConfig); + } + }) + } + + Row() { + LabelComponent({ + text: "二路" + }) + CheckboxComponent({ + value: this.videoConfig.videoRecord2, + change: (value: boolean) => { + this.videoConfig.videoRecord2 = value; + this.change?.(this.videoConfig); + } + }) + } + + Row() { + LabelComponent({ + text: "三路" + }) + CheckboxComponent({ + value: this.videoConfig.videoRecord3, + change: (value: boolean) => { + this.videoConfig.videoRecord3 = value; + this.change?.(this.videoConfig); + } + }) + } + + Row() { + LabelComponent({ + text: "四路" + }) + CheckboxComponent({ + value: this.videoConfig.videoRecord4, + change: (value: boolean) => { + this.videoConfig.videoRecord4 = value; + this.change?.(this.videoConfig); + } + }) + } + } else { + Row() { + LabelComponent({ + text: "一路" + }) + CheckboxComponent({ + value: this.videoConfig.spzd1, + change: (value: boolean) => { + this.videoConfig.spzd1 = value; + this.change?.(this.videoConfig); + } + }) + } + + Row() { + LabelComponent({ + text: "二路" + }) + CheckboxComponent({ + value: this.videoConfig.spzd2, + change: (value: boolean) => { + this.videoConfig.spzd2 = value; + this.change?.(this.videoConfig); + } + }) + } + + Row() { + LabelComponent({ + text: "三路" + }) + CheckboxComponent({ + value: this.videoConfig.spzd3, + change: (value: boolean) => { + this.videoConfig.spzd3 = value; + this.change?.(this.videoConfig); + } + }) + } + + Row() { + LabelComponent({ + text: "四路" + }) + CheckboxComponent({ + value: this.videoConfig.spzd4, + change: (value: boolean) => { + this.videoConfig.spzd4 = value; + this.change?.(this.videoConfig); + } + }) + } + } + }.width(300) + }.justifyContent(FlexAlign.Start) + } +} \ No newline at end of file diff --git a/entry/src/main/ets/pages/VideoConfig/TextInput.ets b/entry/src/main/ets/pages/VideoConfig/TextInput.ets new file mode 100644 index 0000000..8c85d8b --- /dev/null +++ b/entry/src/main/ets/pages/VideoConfig/TextInput.ets @@ -0,0 +1,22 @@ +@Component +export default struct TextInputComponent { + @Prop value: string + @State widthValue: number = 120 + change?: (value: string) => void + + build() { + TextInput({ + text: this.value, + }) + .type(InputType.Normal) + .borderRadius(0) + .fontSize(20) + .width(this.widthValue) + .height(50) + .margin({ left: 15, right: 15 }) + .onChange((value) => { + this.value = value; + this.change?.(value); + }) + } +} \ No newline at end of file