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>
<van-popup v-model="popupShow"
position="right"
:style="{ height: '100%', width: '90%' }"
round
:close-on-click-overlay="false"
@click-overlay="handleCancel">
<van-popup
v-model="popupShow"
position="right"
:style="{ height: '100%', width: '70%' }"
round
:close-on-click-overlay="false"
@click-overlay="handleCancel"
>
<h3 class="popup-title">
<span>体系结构</span>
<van-icon name="cross" size="22px" @click="handleCancel" />
@@ -13,28 +15,43 @@
<van-field name="radio" label="标准状态">
<template #input>
<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-group>
</template>
</van-field>
<standardSystemTree ref="standardSystemTreeRef" :data="standardSystemTreeData" :loading="loading" @checkedKey="getCheckedKey"></standardSystemTree>
<standardSystemTree ref="standardSystemTreeRef" :data="standardSystemTreeData" :loading="loading" @checkedKey="getCheckedKey" />
</div>
<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="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>
</van-popup>
</template>
<script>
import standardSystemTree from "./standardSystemTree";
import standardSystemTree from './standardSystemTree';
export default {
name: "standardSystemPopup",
name: 'StandardSystemPopup',
components: {
standardSystemTree,
},
props: {
// 以前的选中项
initKeys: {
type: Array,
required: true
}
},
data () {
return {
popupShow: true,
@@ -48,13 +65,6 @@ export default {
}
}
},
props: {
// 以前的选中项
initKeys: {
type: Array,
required: true
}
},
methods: {
initOpen () {
this.checkedKeys = []
@@ -76,8 +86,8 @@ export default {
},
handleOk () {
// if (this.checkedKeys.length > 0) {
this.popupShow = false
// this.$emit('standSystemKeys', this.checkedKeys)
this.popupShow = false
// this.$emit('standSystemKeys', this.checkedKeys)
this.$emit('searchQuery', { checkedKeys: this.checkedKeys, textStatusName: this.textStatusName })
// } else {
// // this.$toast('请至少选择一项');
@@ -87,7 +97,7 @@ export default {
},
handleCancel () {
// if (this.initKeys.length > 0) {
this.hide()
this.hide()
// } else {
// this.$message.error('请至少选择一项')
// this.open()
@@ -100,7 +110,7 @@ export default {
},
async getData () {
let url = this.api.getListStand
let query = { sorDivide: 'INLAND_STAND' }
const query = { sorDivide: 'INLAND_STAND' }
switch (this.$route.query.standType) {
case 'INLAND':
break
@@ -112,9 +122,9 @@ export default {
query.sorDivide = 'BUSINESS_STAND'
break
}
//INLAND 国内 FOREIGN 海外 bussstand 企标
const res = await this.$http._getData(url,query,{
_this:this,
// INLAND 国内 FOREIGN 海外 bussstand 企标
const res = await this.$http._getData(url, query, {
_this: this,
loading: 'loading'
})
if (res.ok && res.data) {
@@ -1,30 +1,40 @@
<template>
<van-popup v-model="popupShow"
position="right"
:style="{ height: '100%', width: '90%' }"
round
:close-on-click-overlay="false"
@click-overlay="handleCancel"
get-container="body">
<van-popup
v-model="popupShow"
position="right"
:style="{ height: '100%', width: '70%' }"
round
:close-on-click-overlay="false"
get-container="body"
@click-overlay="handleCancel"
>
<h3 class="popup-title">
<span>体系结构</span>
<van-icon name="cross" size="22px" @click="handleCancel" />
</h3>
<div class="popup-main">
<folderTree ref="folderTreeRef" @checked="getChecked"></folderTree>
<folderTree ref="folderTreeRef" @checked="getChecked" />
</div>
<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="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>
</van-popup>
</template>
<script>
import folderTree from "./folderTree";
import folderTree from './folderTree';
export default {
name: "folderPopup",
name: 'FolderPopup',
components: {
folderTree,
},