47 lines
1.1 KiB
Vue
47 lines
1.1 KiB
Vue
import { defineComponent, inject } from 'vue';
|
|
import { GLOBAL_CONFIG } from '../SymbolKey';
|
|
|
|
export default defineComponent({
|
|
props: {
|
|
cols: {
|
|
type: [Number, String],
|
|
default: 2,
|
|
},
|
|
},
|
|
setup() {
|
|
return {
|
|
globalConfig: inject(GLOBAL_CONFIG),
|
|
};
|
|
},
|
|
render() {
|
|
const { cols, globalConfig, $slots } = this;
|
|
// 手机访问强制开启单行 demo 模式
|
|
const isSingleCol = cols === 1 || globalConfig.isMobile.value;
|
|
const leftChildren = [];
|
|
const rightChildren = [];
|
|
const children = $slots.default?.() || [];
|
|
children.forEach((demo, index) => {
|
|
if (index % 2 === 0 || isSingleCol) {
|
|
leftChildren.push(demo);
|
|
} else {
|
|
rightChildren.push(demo);
|
|
}
|
|
});
|
|
return (
|
|
<a-row gutter={16}>
|
|
<a-col
|
|
span={isSingleCol ? 24 : 12}
|
|
class={isSingleCol ? 'code-boxes-col-1-1' : 'code-boxes-col-2-1'}
|
|
>
|
|
{leftChildren}
|
|
</a-col>
|
|
{isSingleCol ? null : (
|
|
<a-col class="code-boxes-col-2-1" span={12}>
|
|
{rightChildren}
|
|
</a-col>
|
|
)}
|
|
</a-row>
|
|
);
|
|
},
|
|
});
|