update widgetTime

qianlishi 3 years ago
parent 6ec0faf3e9
commit c047c822cd

@ -578,6 +578,7 @@ const widgetTools = [
{code: 'MM-dd', name: '日期无年'},
{code: 'hh:mm', name: '时分'},
{code: 'hh:mm:ss', name: '时分秒'},
{code: 'week', name: '星期'}
],
value: 'yyyy-MM-dd hh:mm:ss'
},

@ -3,95 +3,127 @@
</template>
<script>
export default {
name: 'WidgetTime',
name: "WidgetTime",
components: {},
props: {
value: Object,
ispreview: Boolean,
ispreview: Boolean
},
data() {
return {
timestr: '',
options: {},
}
timestr: "",
options: {}
};
},
computed: {
transStyle() {
console.log(this.objToOne(this.options))
return this.objToOne(this.options)
console.log(this.objToOne(this.options));
return this.objToOne(this.options);
},
styleColor() {
return {
position: this.ispreview ? 'absolute' : 'static',
color: this.transStyle.color || '#fff',
text: this.transStyle.text || '文本框',
'font-size': this.transStyle.fontSize + 'px' || '30px',
'letter-spacing': this.transStyle.letterSpacing + 'em',
position: this.ispreview ? "absolute" : "static",
color: this.transStyle.color || "#fff",
text: this.transStyle.text || "文本框",
"font-size": this.transStyle.fontSize + "px" || "30px",
"letter-spacing": this.transStyle.letterSpacing + "em",
background: this.transStyle.background,
'font-weight': this.transStyle.fontWeight,
'text-align': this.transStyle.textAlign,
display: this.transStyle.hideLayer == undefined ? 'block' : this.transStyle.hideLayer ? 'none' : 'block',
width: this.transStyle.width + 'px',
height: this.transStyle.height + 'px',
left: this.transStyle.left + 'px',
top: this.transStyle.top + 'px',
right: this.transStyle.right + 'px',
}
},
"font-weight": this.transStyle.fontWeight,
"text-align": this.transStyle.textAlign,
display:
this.transStyle.hideLayer == undefined
? "block"
: this.transStyle.hideLayer
? "none"
: "block",
width: this.transStyle.width + "px",
height: this.transStyle.height + "px",
left: this.transStyle.left + "px",
top: this.transStyle.top + "px",
right: this.transStyle.right + "px"
};
}
},
watch: {
value: {
handler(val) {
this.options = val
this.options = val;
},
deep: true,
},
deep: true
}
},
mounted() {
this.options = this.value
this.getTime()
this.options = this.value;
this.getTime();
},
methods: {
formatFunction(date, fmt) {
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
fmt = fmt.replace(
RegExp.$1,
(date.getFullYear() + "").substr(4 - RegExp.$1.length)
);
}
const o = {
'M+': date.getMonth() + 1, //
'd+': date.getDate(), //
'h+': date.getHours(), //
'm+': date.getMinutes(), //
's+': date.getSeconds(), //
'q+': Math.floor((date.getMonth() + 3) / 3), //
'S': date.getMilliseconds() //
}
"M+": date.getMonth() + 1, //
"d+": date.getDate(), //
"h+": date.getHours(), //
"m+": date.getMinutes(), //
"s+": date.getSeconds(), //
"q+": Math.floor((date.getMonth() + 3) / 3), //
S: date.getMilliseconds() //
};
for (var k in o) {
if (new RegExp('(' + k + ')').test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
if (new RegExp("(" + k + ")").test(fmt)) {
fmt = fmt.replace(
RegExp.$1,
RegExp.$1.length == 1
? o[k]
: ("00" + o[k]).substr(("" + o[k]).length)
);
}
}
return fmt
return fmt;
},
check(val) {
if (val < 10) {
return '0' + val
return "0" + val;
} else {
return val
return val;
}
},
formatWeek(date, fmt) {
const year = date.getFullYear();
const month = date.getMonth();
const day = date.getDate();
const hours = date.getHours();
const minutes = date.getMinutes();
const seconds = date.getSeconds();
let dayCycle = date.getDay();
const dayCycleArray = ["日", "一", "二", "三", "四", "五", "六"];
for (let i = 0; i < 7; i++) {
if (dayCycle == i) {
dayCycle = "星期" + dayCycleArray[i];
}
}
return dayCycle;
},
displayTime() {
this.timestr = this.formatFunction(new Date(), this.transStyle.timeFormat)
this.timestr =
this.transStyle.timeFormat.indexOf("week") > -1
? this.formatWeek(new Date(), this.transStyle.timeFormat)
: this.formatFunction(new Date(), this.transStyle.timeFormat);
},
getTime() {
setInterval(() => {
this.displayTime()
}, 1000)
},
},
}
this.displayTime();
}, 1000);
}
}
};
</script>
<style lang="scss" scoped>
.text{
.text {
width: 100%;
height: 100%;
overflow: hidden;

Loading…
Cancel
Save