fix(手机端): 弹窗宽度70%

This commit is contained in:
zyn
2023-12-21 13:59:38 +08:00
parent b2861d491a
commit 84ab889b9a
2 changed files with 56 additions and 36 deletions
@@ -1,10 +1,12 @@
<template> <template>
<van-popup v-model="popupShow" <van-popup
v-model="popupShow"
position="right" position="right"
:style="{ height: '100%', width: '90%' }" :style="{ height: '100%', width: '70%' }"
round round
:close-on-click-overlay="false" :close-on-click-overlay="false"
@click-overlay="handleCancel"> @click-overlay="handleCancel"
>
<h3 class="popup-title"> <h3 class="popup-title">
<span>体系结构</span> <span>体系结构</span>
<van-icon name="cross" size="22px" @click="handleCancel" /> <van-icon name="cross" size="22px" @click="handleCancel" />
@@ -13,28 +15,43 @@
<van-field name="radio" label="标准状态"> <van-field name="radio" label="标准状态">
<template #input> <template #input>
<van-radio-group v-model="textStatusName" direction="horizontal"> <van-radio-group v-model="textStatusName" direction="horizontal">
<van-radio name="全部">全部</van-radio> <van-radio name="全部" style="margin-bottom: 5px;">全部</van-radio>
<van-radio name="现行有效">现行有效</van-radio> <van-radio name="现行有效">现行有效</van-radio>
</van-radio-group> </van-radio-group>
</template> </template>
</van-field> </van-field>
<standardSystemTree ref="standardSystemTreeRef" :data="standardSystemTreeData" :loading="loading" @checkedKey="getCheckedKey"></standardSystemTree> <standardSystemTree ref="standardSystemTreeRef" :data="standardSystemTreeData" :loading="loading" @checkedKey="getCheckedKey" />
</div> </div>
<div class="popup-footer"> <div class="popup-footer">
<el-button class="common-button-default" size="mini" icon="el-icon-close" @click="handleReset">重置</el-button> <el-button class="common-button-default" size="mini" icon="el-icon-close" @click="handleReset">重置</el-button>
<!--<el-button class="common-button-default" size="mini" icon="el-icon-close" @click="handleCancel">取消</el-button>--> <!--<el-button class="common-button-default" size="mini" icon="el-icon-close" @click="handleCancel">取消</el-button>-->
<el-button class="common-button-primary" size="mini" icon="el-icon-check" type="primary" @click="handleOk">确定</el-button> <el-button
class="common-button-primary"
size="mini"
icon="el-icon-check"
type="primary"
@click="handleOk"
>
确定
</el-button>
</div> </div>
</van-popup> </van-popup>
</template> </template>
<script> <script>
import standardSystemTree from "./standardSystemTree"; import standardSystemTree from './standardSystemTree';
export default { export default {
name: "standardSystemPopup", name: 'StandardSystemPopup',
components: { components: {
standardSystemTree, standardSystemTree,
}, },
props: {
// 以前的选中项
initKeys: {
type: Array,
required: true
}
},
data () { data () {
return { return {
popupShow: true, popupShow: true,
@@ -48,13 +65,6 @@ export default {
} }
} }
}, },
props: {
// 以前的选中项
initKeys: {
type: Array,
required: true
}
},
methods: { methods: {
initOpen () { initOpen () {
this.checkedKeys = [] this.checkedKeys = []
@@ -100,7 +110,7 @@ export default {
}, },
async getData () { async getData () {
let url = this.api.getListStand let url = this.api.getListStand
let query = { sorDivide: 'INLAND_STAND' } const query = { sorDivide: 'INLAND_STAND' }
switch (this.$route.query.standType) { switch (this.$route.query.standType) {
case 'INLAND': case 'INLAND':
break break
@@ -1,30 +1,40 @@
<template> <template>
<van-popup v-model="popupShow" <van-popup
v-model="popupShow"
position="right" position="right"
:style="{ height: '100%', width: '90%' }" :style="{ height: '100%', width: '70%' }"
round round
:close-on-click-overlay="false" :close-on-click-overlay="false"
get-container="body"
@click-overlay="handleCancel" @click-overlay="handleCancel"
get-container="body"> >
<h3 class="popup-title"> <h3 class="popup-title">
<span>体系结构</span> <span>体系结构</span>
<van-icon name="cross" size="22px" @click="handleCancel" /> <van-icon name="cross" size="22px" @click="handleCancel" />
</h3> </h3>
<div class="popup-main"> <div class="popup-main">
<folderTree ref="folderTreeRef" @checked="getChecked"></folderTree> <folderTree ref="folderTreeRef" @checked="getChecked" />
</div> </div>
<div class="popup-footer"> <div class="popup-footer">
<el-button class="common-button-default" size="mini" icon="el-icon-close" @click="handleReset">重置</el-button> <el-button class="common-button-default" size="mini" icon="el-icon-close" @click="handleReset">重置</el-button>
<el-button class="common-button-default" size="mini" icon="el-icon-close" @click="handleCancel">取消</el-button> <el-button class="common-button-default" size="mini" icon="el-icon-close" @click="handleCancel">取消</el-button>
<el-button class="common-button-primary" size="mini" icon="el-icon-check" type="primary" @click="handleOk">确定</el-button> <el-button
class="common-button-primary"
size="mini"
icon="el-icon-check"
type="primary"
@click="handleOk"
>
确定
</el-button>
</div> </div>
</van-popup> </van-popup>
</template> </template>
<script> <script>
import folderTree from "./folderTree"; import folderTree from './folderTree';
export default { export default {
name: "folderPopup", name: 'FolderPopup',
components: { components: {
folderTree, folderTree,
}, },