style: 代码统一风格格式化

Former-commit-id: 5d0a75e41127c57c663eb2617b1ce66d039f4c29
This commit is contained in:
郝先瑞
2022-05-08 13:06:12 +08:00
parent 77a71db326
commit eab11687aa
137 changed files with 10635 additions and 10635 deletions

View File

@@ -1,38 +1,38 @@
<template>
<div class="component-container">
<div class="component-container__main">
<el-cascader-panel
ref="categoryRef"
:options="categoryOptions"
v-model="goodsInfo.categoryId"
:props="{ emitPath: false }"
@change="handleCategoryChange"
/>
<div style="margin-top: 20px">
<el-link type="info" :underline="false" v-show="pathLabels.length > 0"
>您选择的商品分类:</el-link
>
<el-link
type="danger"
:underline="false"
v-for="(item, index) in pathLabels"
:key="index"
style="margin-left: 5px"
>
{{ item }}
<CaretRight
v-show="index < pathLabels.length - 1"
style="width: 1em; height: 1em; margin-left: 5px"
/>
</el-link>
</div>
</div>
<div class="component-container__footer">
<el-button type="primary" @click="handleNext"
>下一步填写商品信息</el-button
>
</div>
</div>
<div class="component-container">
<div class="component-container__main">
<el-cascader-panel
ref="categoryRef"
:options="categoryOptions"
v-model="goodsInfo.categoryId"
:props="{ emitPath: false }"
@change="handleCategoryChange"
/>
<div style="margin-top: 20px">
<el-link type="info" :underline="false" v-show="pathLabels.length > 0"
>您选择的商品分类:</el-link
>
<el-link
type="danger"
:underline="false"
v-for="(item, index) in pathLabels"
:key="index"
style="margin-left: 5px"
>
{{ item }}
<CaretRight
v-show="index < pathLabels.length - 1"
style="width: 1em; height: 1em; margin-left: 5px"
/>
</el-link>
</div>
</div>
<div class="component-container__footer">
<el-button type="primary" @click="handleNext"
>下一步填写商品信息</el-button
>
</div>
</div>
</template>
<script setup lang="ts">
@@ -46,67 +46,67 @@ import { computed } from '@vue/reactivity';
const emit = defineEmits(['next', 'update:modelValue']);
const props = defineProps({
modelValue: {
type: Object,
default: () => {}
}
modelValue: {
type: Object,
default: () => {}
}
});
const goodsInfo: any = computed({
get: () => props.modelValue,
set: value => {
emit('update:modelValue', value);
}
get: () => props.modelValue,
set: value => {
emit('update:modelValue', value);
}
});
const state = reactive({
categoryOptions: [],
pathLabels: []
categoryOptions: [],
pathLabels: []
});
const { categoryOptions, pathLabels } = toRefs(state);
function loadData() {
listCascadeCategories().then(response => {
state.categoryOptions = response.data;
if (goodsInfo.value.id) {
nextTick(() => {
handleCategoryChange();
});
}
});
listCascadeCategories().then(response => {
state.categoryOptions = response.data;
if (goodsInfo.value.id) {
nextTick(() => {
handleCategoryChange();
});
}
});
}
const categoryRef = ref(ElCascaderPanel);
function handleCategoryChange() {
const checkNode = categoryRef.value.getCheckedNodes()[0];
state.pathLabels = checkNode.pathLabels; // 商品分类选择层级提示
goodsInfo.value.categoryId = checkNode.value;
const checkNode = categoryRef.value.getCheckedNodes()[0];
state.pathLabels = checkNode.pathLabels; // 商品分类选择层级提示
goodsInfo.value.categoryId = checkNode.value;
}
function handleNext() {
if (!goodsInfo.value.categoryId) {
ElMessage.warning('请选择商品分类');
return false;
}
emit('next');
if (!goodsInfo.value.categoryId) {
ElMessage.warning('请选择商品分类');
return false;
}
emit('next');
}
onMounted(() => {
loadData();
loadData();
});
</script>
<style lang="scss" scoped>
.component-container {
&__main {
margin: 20px auto;
}
&__main {
margin: 20px auto;
}
&__footer {
position: fixed;
bottom: 20px;
right: 20px;
}
&__footer {
position: fixed;
bottom: 20px;
right: 20px;
}
}
</style>