90 lines
1.9 KiB
Vue
90 lines
1.9 KiB
Vue
<template>
|
|
<div class="custom-back-warp">
|
|
<subTop
|
|
:title="topTitle"
|
|
:postion="topPostion"
|
|
:is-down="isDown"
|
|
:down-title="downTitle"
|
|
:label-field="labelField"
|
|
:value-field="valueField"
|
|
:down-width="downWidth"
|
|
:options="options"
|
|
@command="handeleCommand"
|
|
></subTop>
|
|
<div class="custom-back-content">
|
|
<slot name="back"></slot>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script setup>
|
|
import subTop from '../components/subTop.vue';
|
|
import { isEmpty, getAssetsFile } from '@/utils';
|
|
import { ref, reactive, onMounted, watch } from 'vue';
|
|
import { useRouter } from 'vue-router';
|
|
import { useApp } from '@/hooks';
|
|
|
|
const router = useRouter();
|
|
const props = defineProps({
|
|
topTitle: {
|
|
type: String,
|
|
default: '统计',
|
|
},
|
|
topPostion: {
|
|
type: String,
|
|
default: 'left',
|
|
},
|
|
options: {
|
|
type: Array,
|
|
default: () => {
|
|
return [
|
|
{ label: '耿马镇', value: '42611' },
|
|
{ label: '勐撒镇', value: '9259' },
|
|
{ label: '勐永镇', value: '17787' },
|
|
{ label: '孟定镇', value: '42610' },
|
|
{ label: '勐简乡', value: '17788' },
|
|
{ label: '贺派乡', value: '40161' },
|
|
{ label: '四排山乡', value: '40163' },
|
|
{ label: '大兴乡', value: '40159' },
|
|
];
|
|
},
|
|
},
|
|
isDown: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
downTitle: {
|
|
type: String,
|
|
default: '全县',
|
|
},
|
|
labelField: {
|
|
type: String,
|
|
default: 'label',
|
|
},
|
|
valueField: {
|
|
type: String,
|
|
default: 'value',
|
|
},
|
|
downWidth: {
|
|
type: String,
|
|
default: '100px',
|
|
},
|
|
});
|
|
|
|
const emit = defineEmits(['command']);
|
|
const handeleCommand = (data) => {
|
|
emit('command', data);
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.custom-back-warp {
|
|
height: 100%;
|
|
width: 100%;
|
|
.custom-back-content {
|
|
height: calc(100% - 38px);
|
|
width: 100%;
|
|
padding: 10px 0;
|
|
box-sizing: border-box;
|
|
}
|
|
}
|
|
</style>
|