|
|
@@ -9,8 +9,11 @@
|
|
|
:closable="false"
|
|
|
:hide-cancel="is_init_model"
|
|
|
:hide-ok="is_init_model"
|
|
|
+ :mask="false"
|
|
|
+ ref="modelVal"
|
|
|
modal-class="dynamicform-config-container-modal"
|
|
|
body-class="dynamicform-config-container-body"
|
|
|
+ :body-style="bodyStyle"
|
|
|
>
|
|
|
<template #title> <img class="chujuan-logo-img" :src="logo" /> {{ $t('wendangchujuan.dynamic_title') }} </template>
|
|
|
|
|
|
@@ -38,42 +41,40 @@ const props = defineProps({
|
|
|
user_input_form: Array
|
|
|
});
|
|
|
|
|
|
-const emits = defineEmits(['confirm']);
|
|
|
+const emits = defineEmits(['confirm', 'init_model']);
|
|
|
|
|
|
const confForm = ref(null);
|
|
|
const visible = ref(false);
|
|
|
-// const ok_text = computed(() => {
|
|
|
-// return is_init_model.value ? '开始对话' : '确认';
|
|
|
-// });
|
|
|
+const modelVal = ref(null);
|
|
|
const is_init_model = ref(false); //是否是初始的配置
|
|
|
+
|
|
|
+const bodyStyle = ref({});
|
|
|
const handleClick = () => {
|
|
|
visible.value = true;
|
|
|
- is_init_model.value = false;
|
|
|
+ is_init_model.vale = false;
|
|
|
+ emits('init_model', is_init_model.value);
|
|
|
+ if (modelVal.value) {
|
|
|
+ bodyStyle.value = {
|
|
|
+ 'max-height': '40vh'
|
|
|
+ };
|
|
|
+ }
|
|
|
};
|
|
|
-// const handleOk = () => {
|
|
|
-// const target = confForm.value;
|
|
|
-// if (target && typeof target.getValues === 'function') {
|
|
|
-// const data = target.getValues();
|
|
|
-// console.log('data', data);
|
|
|
-// emits('confirm', data);
|
|
|
-// }
|
|
|
|
|
|
-// visible.value = false;
|
|
|
-// };
|
|
|
const toCancel = () => {
|
|
|
visible.value = false;
|
|
|
};
|
|
|
const submitForm = (data) => {
|
|
|
- console.log(data, 111);
|
|
|
emits('confirm', data);
|
|
|
visible.value = false;
|
|
|
is_init_model.value = false;
|
|
|
+ emits('init_model', is_init_model.value);
|
|
|
};
|
|
|
|
|
|
onMounted(() => {
|
|
|
if (props.user_input_form.length) {
|
|
|
visible.value = true;
|
|
|
is_init_model.value = true;
|
|
|
+ emits('init_model', is_init_model.value);
|
|
|
}
|
|
|
});
|
|
|
</script>
|
|
|
@@ -81,7 +82,8 @@ onMounted(() => {
|
|
|
<style scoped>
|
|
|
.chujuan-btn {
|
|
|
border-radius: 30px;
|
|
|
- color: #353535;
|
|
|
+ color: var(--color-text-2);
|
|
|
+ background-color: var(--color-bg-1);
|
|
|
}
|
|
|
.chujuan-logo-img {
|
|
|
width: 22px;
|
|
|
@@ -92,11 +94,12 @@ onMounted(() => {
|
|
|
|
|
|
<style>
|
|
|
.dynamicform-config-container-modal.arco-modal {
|
|
|
- width: 40%;
|
|
|
+ width: 100%;
|
|
|
+ box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.3);
|
|
|
}
|
|
|
.dynamicform-config-container-body.arco-modal-body {
|
|
|
padding: 30px;
|
|
|
- max-height: 70vh;
|
|
|
+ max-height: 60vh;
|
|
|
overflow-y: auto;
|
|
|
}
|
|
|
.dynamicform-config-container-body.arco-modal-body .chujuan-iframe {
|
|
|
@@ -104,7 +107,7 @@ onMounted(() => {
|
|
|
height: 80vh;
|
|
|
}
|
|
|
.dynamicform-config-container-modal.arco-modal .arco-modal-header {
|
|
|
- background-color: #f3f3f3;
|
|
|
+ background-color: var(--color-fill-2);
|
|
|
}
|
|
|
.dynamicform-config-container-modal.arco-modal .arco-modal-header .arco-modal-title {
|
|
|
justify-content: flex-start;
|
|
|
@@ -112,4 +115,12 @@ onMounted(() => {
|
|
|
.dynamicform-config-container-modal.arco-modal .arco-modal-footer .arco-btn {
|
|
|
display: none;
|
|
|
}
|
|
|
+.arco-modal-container {
|
|
|
+ width: 40%;
|
|
|
+ margin: auto;
|
|
|
+}
|
|
|
+.arco-modal-wrapper.arco-modal-wrapper-align-center .arco-modal {
|
|
|
+ top: -5vh;
|
|
|
+}
|
|
|
+/* .arco-modal-wrapper; */
|
|
|
</style>
|