c5_labsci/fapp/ciyon_ap/components/ciy-dialog/ciy-dialog.vue
2026-01-27 00:52:00 +08:00

96 lines
3.3 KiB
Vue

<template>
<view class="_bg" v-if="bshow">
<view class="_dialog" :style="{top:top}">
<view class="_title">{{title}}</view>
<view class="_close" @tap="Close(true)"></view>
<view class="_content" :style="{maxHeight:maxheight,height:height}">
<slot></slot>
</view>
</view>
</view>
</template>
<style scoped>
._bg {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.2);
z-index: 100;
}
._dialog {
position: fixed;
border-radius: 0.5em;
left: 1em;
right: 1em;
background: #ffffff;
}
._dialog ._title {
line-height: 1.5em;
background: #fafafa;
padding: 0.5em 1em;
border-radius: 0.5em 0.5em 0 0;
}
._dialog ._content {
overflow: scroll;
margin-bottom: 0.5em;
}
._dialog ._close {
position: absolute;
right: 0.5em;
top: 0.5em;
width: 1.5em;
height: 1.5em;
background-image: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB2aWV3Qm94PScwIDAgMTAyNCAxMDI0JyB2ZXJzaW9uPScxLjEnIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Zyc+PHBhdGggZD0nTTUxLjI4NTk0ODA3IDUyMC4wMTYwMTM1NGMwIDI1Ni40ODg5MDI4MyAyMDcuNTg2OTEzMzUgNDY0LjA3NTgxNjIgNDY0LjA3NTgxNjE3IDQ2NC4wNzU4MTYxN3M0NjQuMDc1ODE2Mi0yMDcuNTg2OTEzMzUgNDY0LjA3NTgxNjItNDY0LjA3NTgxNjE3Uzc3MS44NTA2NjcwOCA1NS45NDAxOTczMyA1MTUuMzYxNzY0MjQgNTUuOTQwMTk3MzNzLTQ2NC4wNzU4MTYyIDIwNy41ODY5MTMzNS00NjQuMDc1ODE2MTcgNDY0LjA3NTgxNjIxeicgZmlsbD0nI2Q4MWUwNic+PC9wYXRoPjxwYXRoIGQ9J001NjAuMjYxMDk5MDIgNTE5LjU1MTkzNzU5bDE3OC4zNzkxNDI5MSAxNzguMzc5MTQxNDZjMTEuODkxOTQyNTcgMTEuODkxOTQyNTcgMTEuODkxOTQyNTcgMzIuODkxMzczNTkgMCA0NC44MTIzMjE5LTExLjg5MTk0MjU3IDExLjg5MTk0MjU3LTMyLjg5MTM3MzU5IDExLjg5MTk0MjU3LTQ0LjgxMjMyMTkxIDBsLTE3OC4zNzkxNDE0NS0xNzguMzc5MTQyOS0xNzguMzc5MTQxNDMgMTc4LjM3OTE0MjljLTExLjg5MTk0MjU3IDExLjg5MTk0MjU3LTMyLjg5MTM3MzU5IDExLjg5MTk0MjU3LTQ0LjgxMjMyMTkxIDAtMTEuODkxOTQyNTctMTEuOTIwOTQ2ODYtMTEuODkxOTQyNTctMzIuOTIwMzc3ODkgMC00NC44MTIzMjE5bDE3OC4zNzkxNDI5LTE3OC4zNzkxNDE0Ni0xNzcuNzk5MDQ2OS0xNzcuODI4MDUyNjRjLTExLjkyMDk0Njg2LTExLjg5MTk0MjU3LTExLjkyMDk0Njg2LTMyLjg5MTM3MzU5IDAtNDQuODEyMzIwNDUgMTEuODkxOTQyNTctMTEuODkxOTQyNTcgMzIuODkxMzczNTktMTEuODkxOTQyNTcgNDQuNzgzMzE2MTYgMGwxNzcuODI4MDUxMTggMTc3Ljc5OTA0Njg5IDE3Ny43OTkwNDY5MS0xNzcuNzk5MDQ2ODljMTIuNTAxMDQyODctMTEuODkxOTQyNTcgMzIuOTIwMzc3ODktMTEuODkxOTQyNTcgNDQuODQxMzI2MjEgMCAxMS44OTE5NDI1NyAxMS44OTE5NDI1NyAxMS44OTE5NDI1NyAzMi44OTEzNzM1OSAwIDQ0LjgxMjMyMDQ1bC0xNzcuODI4MDUyNjcgMTc3Ljc5OTA0ODM2eicgZmlsbD0nI2ZmZmZmZic+PC9wYXRoPjwvc3ZnPg==");
}
</style>
<script>
export default {
props: {},
data() {
return {
bshow: false,
maxheight: 'auto',
top: 0,
height: 'auto',
title: '',
};
},
methods: {
async Open(res) {
var app = getApp();
res = res || {};
if (typeof(res) == 'string')
res = {
title: res
};
this.title = res.title || '操作';
this.cb = res.cb;
const {
headerheight,
footerheight
} = await this.com_gethdft();
this.top = (headerheight + 60) + 'px';
if (res.height) {
this.height = res.height;
} else {
var height = app.globalData._sysinfo.windowHeight - 100 - this.header_statusbar_height - this.header_title_height;
this.maxheight = height + 'px';
}
this.bshow = true;
},
Close(mustcb) {
this.bshow = false;
if (mustcb && typeof(this.cb) == 'function')
this.cb('close');
}
}
}
</script>