Merge branch 'dev' of github.com:jetlinks/jetlinks-ui-vue into dev

This commit is contained in:
wangshuaiswim 2023-03-19 21:49:43 +08:00
commit 6fff6f737e
6 changed files with 208 additions and 53 deletions

View File

@ -59,7 +59,7 @@ import { detail as deviceDetail } from '@/api/device/instance'
import Product from './Product.vue' import Product from './Product.vue'
import DeviceSelect from './DeviceSelect.vue' import DeviceSelect from './DeviceSelect.vue'
import Type from './Type.vue' import Type from './Type.vue'
import { continuousValue, timeUnitEnum } from '@/views/rule-engine/Scene/Save/components/Timer/util' import {continuousValue, handleTimerOptions, timeUnitEnum} from '@/views/rule-engine/Scene/Save/components/Timer/util'
type Emit = { type Emit = {
(e: 'cancel'): void (e: 'cancel'): void
@ -161,25 +161,30 @@ const handleOptions = (data: TriggerDeviceOptions) => {
if (data.timer) { if (data.timer) {
const _timer = data.timer; const _timer = data.timer;
if (_timer.trigger === 'cron') { const { time, extraTime, when } = handleTimerOptions(_timer)
_options.time = _timer.cron; _options.when = when;
} else { _options.time = time;
// console.log('continuousValue', continuousValue(_timer.when! || [], _timer!.trigger)) _options.extraTime = extraTime;
let whenStr = '每天'; // if (_timer.trigger === 'cron') {
if (_timer.when!.length) { // _options.time = _timer.cron;
whenStr = _timer!.trigger === 'week' ? '每周' : '每月'; // } else {
const whenStrArr = continuousValue(_timer.when! || [], _timer!.trigger); // // console.log('continuousValue', continuousValue(_timer.when! || [], _timer!.trigger))
const whenStrArr3 = whenStrArr.splice(0, 3); // let whenStr = '';
whenStr += whenStrArr3.join('、'); // if (_timer.when!.length) {
whenStr += `${_timer.when!.length}`; // whenStr = _timer!.trigger === 'week' ? '' : '';
} // const whenStrArr = continuousValue(_timer.when! || [], _timer!.trigger);
_options.when = whenStr; // const whenStrArr3 = whenStrArr.splice(0, 3);
if (_timer.once) { // whenStr += whenStrArr3.join('');
_options.time = _timer.once.time + ' 执行1次'; // whenStr += `${_timer.when!.length}`;
} else if (_timer.period) { // }
_options.time = _timer.period.from + '-' + _timer.period.to; // _options.when = whenStr;
_options.extraTime = `${_timer.period.every}${timeUnitEnum[_timer.period.unit]}执行1次`; // if (_timer.once) {
} // _options.time = _timer.once.time + ' 1';
// } else if (_timer.period) {
// _options.time = _timer.period.from + '-' + _timer.period.to;
// _options.extraTime = `${_timer.period.every}${timeUnitEnum[_timer.period.unit]}1`;
// }
// }
} }
if (data.operator === 'online') { if (data.operator === 'online') {
@ -201,7 +206,6 @@ const handleOptions = (data: TriggerDeviceOptions) => {
} }
return _options; return _options;
} }
}
const prev = () => { const prev = () => {
addModel.stepNumber = addModel.stepNumber - 1 addModel.stepNumber = addModel.stepNumber - 1

View File

@ -0,0 +1,65 @@
<template>
<j-modal
title='触发规则'
visible
:width='820'
@click='save'
@cancel='cancel'
>
<Timer
ref='timerRef' v-model:value='addModel.timer'
/>
</j-modal>
</template>
<script setup lang="ts" name="timerAddModel">
import Timer from '../components/Timer'
import type { OperationTimer } from '@/views/rule-engine/Scene/typings'
import {nextTick, PropType} from "vue";
import {TriggerDevice} from "@/views/rule-engine/Scene/typings";
import {handleTimerOptions} from "@/views/rule-engine/Scene/Save/components/Timer/util";
type Emit = {
(e: 'cancel'): void
(e: 'save', data: TriggerDevice, options: Record<string, any>): void
}
const props = defineProps({
timer: {
type: Object as PropType<OperationTimer>,
default: () => ({})
}
})
const emit = defineEmits<Emit>()
const timerRef = ref()
interface AddModelType {
timer: OperationTimer
}
const addModel = reactive<AddModelType>({
timer: props.timer
})
const save = async () => {
const timerData = await timerRef.value?.validateFields()
if (timerData) {
const options = handleTimerOptions(timerData)
emit("save", timerData, options)
}
}
const cancel = () => {
emit("cancel")
}
nextTick(() => {
Object.assign(addModel, props.timer)
})
</script>
<style scoped>
</style>

View File

@ -1,30 +1,67 @@
<template> <template>
<div class='timer'> <div class='timer'>
<Timer ref='timerRef' v-model:value='data.trigger.timer' /> <j-form-item
:rules="rules"
name="timer"
>
<template #label>
<TitleComponent data='触发规则' style='font-size: 14px;' />
</template>
<AddButton
style='width: 100%'
@click='visible = true'
>
<Title :options='data.options.trigger' />
</AddButton>
</j-form-item>
<j-form-item
:rules="actionRules"
:name="['branches', 0, 'then']"
>
<Action <Action
:thenOptions="data.branches ? data?.branches[0].then : []" :thenOptions="data.branches ? data?.branches[0].then : []"
:name="0" :name="0"
@add="onActionAdd" />
@update="onActionUpdate" </j-form-item>
<AddModel
v-if="visible"
@cancel='visible = false'
@save="save"
:value="data.trigger.device"
:options="data.options.trigger"
/> />
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { useSceneStore } from '@/store/scene'; import { useSceneStore } from '@/store/scene';
import Action from '../action/index.vue';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import Timer from '../components/Timer' import Action from '../action/index.vue';
import AddModel from './AddModal.vue'
import AddButton from '../components/AddButton.vue'
import type { OperationTimer } from '@/views/rule-engine/Scene/typings'
const sceneStore = useSceneStore(); const sceneStore = useSceneStore();
const { data } = storeToRefs(sceneStore); const { data } = storeToRefs(sceneStore);
const visible = ref(false)
const onActionAdd = (_data: any) => { const rules = [{
if (data.value?.branches && _data) { validator(_: any, v: any) {
const newThen = [...data.value.branches[0].then, _data]; if (!v) {
data.value.branches![0].then = newThen return Promise.reject(new Error('请配置定时触发规则'));
} }
}; return Promise.resolve();
},
}]
const actionRules = [{
validator(_, v) {
if (!v || (v && !v.length)) {
return Promise.reject('至少配置一个执行动作');
}
return Promise.resolve();
},
}]
const onActionUpdate = (_data: any, type: boolean) => { const onActionUpdate = (_data: any, type: boolean) => {
const indexOf = data.value.branches![0].then.findIndex( const indexOf = data.value.branches![0].then.findIndex(
@ -38,6 +75,11 @@ const onActionUpdate = (_data: any, type: boolean) => {
} }
} }
}; };
const save = (data: OperationTimer, options: Record<string, any>) => {
data.value.trigger!.timer = data
data.value.options!.trigger = options
}
</script> </script>
<style scoped> <style scoped>

View File

@ -1,4 +1,5 @@
import { isArray } from 'lodash-es' import { isArray } from 'lodash-es'
import type { OperationTimer } from "@/views/rule-engine/Scene/typings";
export const numberToString = { export const numberToString = {
1: '星期一', 1: '星期一',
2: '星期二', 2: '星期二',
@ -50,3 +51,41 @@ export const continuousValue: continuousValueFn = (data, type) => {
} }
return newArray; return newArray;
}; };
type TimerOption = {
when?: string
time?: string
extraTime?: string
}
export const handleTimerOptions = (timer: OperationTimer):TimerOption => {
let when = '每天'
let time = undefined
let extraTime = undefined
if (timer.trigger === 'cron') {
time = timer.cron
return { time }
}
if (timer.when?.length) {
when = timer!.trigger === 'week' ? '每周' : '每月';
const whenStrArr = continuousValue(timer.when! || [], timer!.trigger);
const whenStrArr3 = whenStrArr.splice(0, 3);
when += whenStrArr3.join('、');
when += `${timer.when!.length}`;
}
if (timer.once) {
time = timer.once.time + ' 执行1次';
} else if (timer.period) {
time = timer.period.from + '-' + timer.period.to;
extraTime = `${timer.period.every}${timeUnitEnum[timer.period.unit]}执行1次`;
}
return {
when,
time,
extraTime
}
}

View File

@ -15,7 +15,12 @@
<Manual v-else-if='data.triggerType === "manual"' /> <Manual v-else-if='data.triggerType === "manual"' />
<Timer v-else-if='data.triggerType === "timer"' /> <Timer v-else-if='data.triggerType === "timer"' />
<j-form-item> <j-form-item>
<j-text-area <j-textarea
v-model:value="data.description"
placeholder=''
:rows="4"
show-count
:maxLength="200"
/> />
</j-form-item> </j-form-item>
</j-form> </j-form>