联调二级评估 参数字典维护页面

src/views/setting/translate/configuration/component/send.vue

@@ -0,0 +1,102 @@
+<template>
+    <div>
+        <el-card class="default-main mb10">
+            <template #header>
+                <div class="card-header">
+                    <span>模拟短信发送</span>
+                </div>
+            </template>
+            <div :style="height">
+                <div>
+                    <div class="title">接收手机号</div>
+                    <el-input
+                        class="mt10 mb20"
+                        v-model="phone"
+                        placeholder="请输入手机号"
+                        maxlength="11"
+                        style="width: 200px; margin-left: 30px"
+                    ></el-input>
+                </div>
+                <div>
+                    <div class="title">发送内容</div>
+                    <el-input
+                        class="mt10 mb10 ml30"
+                        style="width: 95%"
+                        v-model.trim="textarea"
+                        :rows="5"
+                        type="textarea"
+                        placeholder="请输入短信内容"
+                    />
+                </div>
+
+                <el-divider />
+                <div style="text-align: center" class="mt10">
+                    <el-button type="primary" icon="el-icon-Sort" @click="send">发送</el-button>
+                    <el-button icon="el-icon-Close" @click="clear">清空</el-button>
+                </div>
+            </div>
+        </el-card>
+    </div>
+</template>
+<script setup lang="ts">
+import { ref, reactive } from 'vue'
+import { mainHeight } from '@/utils/layout'
+import { ElMessage } from 'element-plus'
+defineOptions({
+    name: 'smsConfiguration'
+})
+const phone = ref('')
+const textarea = ref('')
+const send = () => {
+    const phoneRegex = /^1[3-9]\d{9}$/ // 简单的手机号正则，只验证格式
+    if (!phoneRegex.test(phone.value)) {
+        ElMessage({
+            message: '请输入正确的手机号',
+            type: 'warning'
+        })
+        return
+        // 显示错误信息m
+    }
+    if (textarea.value === '') {
+        ElMessage({
+            message: '短信内容不能为空',
+            type: 'warning'
+        })
+        return
+    }
+    ElMessage({
+        message: '模拟短信发送成功',
+        type: 'success'
+    })
+}
+const clear = () => {
+    phone.value = ''
+    textarea.value = ''
+    ElMessage({
+        message: '清空成功',
+        type: 'success'
+    })
+}
+const height = mainHeight(105)
+</script>
+<style lang="scss" scoped>
+.title {
+    background-color: #f2f2f2;
+    height: 30px;
+    line-height: 30px;
+    font-weight: 600;
+    padding-left: 10px;
+    margin-bottom: 10px;
+    border-left: 10px solid var(--el-color-primary);
+}
+:deep(.el-card__body) {
+    padding: 10px !important;
+}
+:deep(.el-select) {
+    min-width: 80px !important;
+}
+.checkbox {
+    display: flex;
+    justify-content: space-between;
+}
+</style>

src/views/setting/translate/configuration/component/setSms.vue

@@ -0,0 +1,272 @@
+<template>
+    <div>
+        <el-card class="default-main mb10 mr0">
+            <template #header>
+                <div class="card-header">
+                    <span>短信配置</span>
+                </div>
+            </template>
+            <div :style="height">
+                <div>
+                    <div class="title">短信发送设置</div>
+                    <el-form :model="form" inline label-width="100px" class="mb10 ml30 mt20">
+                        <el-form-item label="短信发送功能">
+                            <el-select v-model="form.sms" style="width: 100px">
+                                <el-option
+                                    v-for="item in list[0]"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                />
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="事件扫描间隔">
+                            <el-select v-model="form.interval" style="width: 100px">
+                                <el-option
+                                    v-for="item in list[1]"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                />
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="离线数据时间">
+                            <el-select v-model="form.time" style="width: 100px">
+                                <el-option
+                                    v-for="item in list[2]"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                />
+                            </el-select>
+                        </el-form-item>
+                    </el-form>
+                </div>
+                <div>
+                    <div class="title">短信发送时间段设置</div>
+                    <div class="mb20 ml30 checkbox">
+                        <el-checkbox-group v-model="form.sendTime">
+                            <el-checkbox
+                                v-for="item in timePeriod"
+                                class="mt10"
+                                :key="item.start + item.end"
+                                :label="`${item.start} - ${item.end}`"
+                                border
+                            />
+                        </el-checkbox-group>
+                        <el-button type="primary" icon="el-icon-Plus" @click="addTime" class="mt10"></el-button>
+                    </div>
+                </div>
+                <div>
+                    <div class="title">类型设置</div>
+                    <div class="mb20 ml30 checkbox">
+                        <el-checkbox-group v-model="form.type">
+                            <el-checkbox
+                                v-for="item in typeList"
+                                class="mt10"
+                                :key="item.label"
+                                :label="item.label"
+                                border
+                            />
+                        </el-checkbox-group>
+                        <el-button type="primary" icon="el-icon-Plus" @click="addType" class="mt10"></el-button>
+                    </div>
+                </div>
+                <el-divider />
+                <div style="text-align: center">
+                    <el-button type="primary" icon="el-icon-Tools" @click="addTime" class="mt10">设置</el-button>
+                </div>
+            </div>
+        </el-card>
+        <!-- 时间范围 -->
+        <el-dialog draggable v-model="timeFlag" title="添加时间范围模版" width="300">
+            <div>
+                <span class="mr10">起始时间</span>
+                <el-time-select
+                    v-model="startTime"
+                    style="width: 200px"
+                    :max-time="endTime"
+                    placeholder="起始时间"
+                    start="00:00"
+                    step="1:00"
+                    end="23:00"
+                />
+            </div>
+            <div class="mt10">
+                <span class="mr10">结束时间</span>
+                <el-time-select
+                    v-model="endTime"
+                    style="width: 200px"
+                    :min-time="startTime"
+                    placeholder="结束时间"
+                    start="00:00"
+                    step="1:00"
+                    end="23:00"
+                />
+            </div>
+
+            <template #footer>
+                <div class="dialog-footer">
+                    <el-button @click="timeFlag = false">取消</el-button>
+                    <el-button type="primary" @click="determineTheTime">确定</el-button>
+                </div>
+            </template>
+        </el-dialog>
+        <!-- 添加类型模版 -->
+        <el-dialog draggable v-model="typeFlag" title="添加类型模版" width="300">
+            <div>
+                <span class="mr10">　类型名称</span>
+                <el-input v-model="typeName" style="width: 200px" placeholder="请输入类型名称"></el-input>
+            </div>
+            <div class="mt10">
+                <span class="mr10">临界最小值</span>
+                <el-input-number
+                    v-model="minType"
+                    :min="0"
+                    @change="minChange"
+                    style="width: 200px"
+                    placeholder="请输入临界最小值"
+                ></el-input-number>
+            </div>
+            <div class="mt10">
+                <span class="mr10">临界最大值</span>
+                <el-input-number
+                    v-model="maxType"
+                    :min="minType + 1"
+                    style="width: 200px"
+                    placeholder="请输入临界最大值"
+                ></el-input-number>
+            </div>
+
+            <template #footer>
+                <div class="dialog-footer">
+                    <el-button @click="timeFlag = false">取消</el-button>
+                    <el-button type="primary" @click="addAType">确定</el-button>
+                </div>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+<script setup lang="ts">
+import { ref, reactive } from 'vue'
+import { mainHeight } from '@/utils/layout'
+import { ElMessage } from 'element-plus'
+defineOptions({
+    name: 'smsConfiguration'
+})
+const list = [
+    [
+        { label: '关闭', value: 0 },
+        { label: '启动', value: 1 }
+    ],
+    [
+        { label: '2分钟', value: 2 },
+        { label: '3分钟', value: 3 },
+        { label: '5分钟', value: 5 },
+        { label: '10分钟', value: 10 },
+        { label: '30分钟', value: 30 }
+    ],
+    [
+        { label: '1天', value: 1 },
+        { label: '2天', value: 2 },
+        { label: '3天', value: 3 },
+        { label: '4天', value: 4 },
+        { label: '5天', value: 5 },
+        { label: '6天', value: 6 },
+        { label: '7天', value: 7 }
+    ]
+]
+const typeList = ref([{ label: '暂降', min: 0, max: 0 }])
+const timeFlag = ref(false)
+const typeFlag = ref(false)
+const startTime = ref('')
+const endTime = ref('')
+const timePeriod = ref([
+    { start: '08:00', end: '12:00' },
+    { start: '13:00', end: '18:00' }
+])
+const typeName = ref('')
+const minType = ref(0)
+const maxType = ref(0)
+
+const height = mainHeight(105)
+const form = reactive({
+    sms: 0,
+    interval: 3,
+    time: 1,
+    sendTime: [],
+    type: []
+})
+
+const addTime = () => {
+    startTime.value = ''
+    endTime.value = ''
+    timeFlag.value = true
+    // 这里可以添加逻辑来处理时间范围的添加
+}
+const addType = () => {
+    typeName.value = ''
+    minType.value = 0
+    maxType.value = 0
+    typeFlag.value = true
+    // 这里可以添加逻辑来处理时间范围的添加
+
+}
+// 确定时间
+const determineTheTime = () => {
+    if (!startTime.value || !endTime.value) {
+        ElMessage({
+            message: '请选择时间',
+            type: 'warning'
+        })
+        return
+    }
+    timePeriod.value.push({
+        start: startTime.value,
+        end: endTime.value
+    })
+    timeFlag.value = false
+}
+// 确定设置类型
+const addAType = () => {
+    if (!typeName.value) {
+        ElMessage({
+            message: '请输入类型名称',
+            type: 'warning'
+        })
+        return
+    }
+    typeList.value.push({
+        label: typeName.value,
+        min: minType.value,
+        max: maxType.value
+    })
+    typeFlag.value = false
+}
+const minChange = (val: number) => {
+    if (val >= maxType.value) {
+        maxType.value = val + 1
+    }
+}
+</script>
+<style lang="scss" scoped>
+.title {
+    background-color: #f2f2f2;
+    height: 30px;
+    line-height: 30px;
+    font-weight: 600;
+    padding-left: 10px;
+    margin-bottom: 10px;
+    border-left: 10px solid var(--el-color-primary);
+}
+:deep(.el-card__body) {
+    padding: 10px !important;
+}
+:deep(.el-select) {
+    min-width: 80px !important;
+}
+.checkbox {
+    display: flex;
+    justify-content: space-between;
+}
+</style>

src/views/setting/translate/configuration/index.vue

@@ -1,12 +1,17 @@
 <template>
-
-    <div class="default-main">123 </div>
-
+    <div class="default-main">
+        <el-row >
+            <el-col :span="12"><setSms /></el-col>
+            <el-col :span="12"><send /></el-col>
+        </el-row>
+    </div>
 </template>
-<script setup lang='ts'>
-// src/views/setting/translate/configuration/index.vue
+<script setup lang="ts">
 import { ref, reactive } from 'vue'
+import setSms from '@/views/setting/translate/configuration/component/setSms.vue'
+import send from '@/views/setting/translate/configuration/component/send.vue'
+defineOptions({
+    name: 'smsQueries'
+})
 </script>
-<style lang="scss" scoped>
-
-</style>
+<style lang="scss" scoped></style>

src/views/setting/translate/smsQueries/index.vue

@@ -28,7 +28,7 @@ import { ElMessage } from 'element-plus'
 import { dictTypeDelete } from '@/api/system-boot/dictType'
 
 defineOptions({
-    name: 'system-boot/dictType/list'
+    name: 'smsQueries'
 })
 const tableStore = new TableStore({
     url: '/system-boot/dictType/list',