You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1591 lines
48 KiB
1591 lines
48 KiB
<template> |
|
<div class="content_max" v-loading="pageLoading"> |
|
<el-form> |
|
<!-- 配送服务类型 --> |
|
<div class="el_row_f1"> |
|
<div class="el_Storage"> |
|
<span class="el_table_span">配送服务类型</span> |
|
<el-select |
|
class="el_Cselect" |
|
style="width: 100%" |
|
v-model="form.dispatchServiceType" |
|
filterable |
|
placeholder="选择计费类型" |
|
@change="chargetype" |
|
> |
|
<el-option |
|
v-for="item in Warehousebillingmode" |
|
:key="item.value" |
|
:label="item.label" |
|
:value="item.value" |
|
/> |
|
</el-select> |
|
</div> |
|
<!-- 配送计费模式 --> |
|
<div class="el_select_check el_Storage"> |
|
<span class="el_table_span name">配送计费模式</span> |
|
<el-select |
|
v-model="form.dispatchPricingType" |
|
filterable |
|
placeholder="请选择配送计费模式" |
|
:popper-append-to-body="false" |
|
style="width: 100%" |
|
multiple |
|
@remove-tag="removeTag" |
|
> |
|
<el-option |
|
style="padding: 0" |
|
v-for="item in ServiceList" |
|
:key="item.value" |
|
:label="item.label" |
|
:value="item.value" |
|
> |
|
<el-checkbox v-model="item.check" @change="isChecked(item)"> |
|
{{ item.label }} |
|
</el-checkbox> |
|
</el-option> |
|
</el-select> |
|
</div> |
|
<!-- 是否区分品类 --> |
|
<div class="el_Storage"> |
|
<span class="el_table_span">是否区分品类</span> |
|
<el-radio-group |
|
@change="categoryChange" |
|
v-model="form.dispatchIsByCategory" |
|
class="el_Cselect el_fx" |
|
style="width: 100%" |
|
> |
|
<el-radio v-for="item in Distinguishcategories" :key="item.label" :label="item.value">{{ |
|
item.label |
|
}}</el-radio> |
|
</el-radio-group> |
|
</div> |
|
|
|
<!-- 是否有遗留件 --> |
|
<div class="el_Storage"> |
|
<span class="el_table_span">是否有遗留件</span> |
|
<el-radio-group |
|
v-model="form.dispatchIsLeaveBehind" |
|
class="el_Cselect el_fx" |
|
style="width: 100%" |
|
> |
|
<el-radio v-for="item in Leftoverparts" :key="item.label" :label="item.value">{{ |
|
item.label |
|
}}</el-radio> |
|
</el-radio-group> |
|
</div> |
|
</div> |
|
<!-- 商配/市配 --> |
|
<div class="el_Storage" v-if="form.dispatchServiceType && form.dispatchIsByCategory"> |
|
<el-tabs class="demo-tabs"> |
|
<el-tab-pane |
|
:label="form.WarehousebillingmodeTitle" |
|
v-loading="Deliveryloading" |
|
element-loading-text="Loading..." |
|
> |
|
<!-- 商配/市配内容 --> |
|
<div class="el_Commercial_ercial"> |
|
<!-- 按件 --> |
|
<el-form-item label="按件计费" v-if="form.dispatchPieceCategoryState"> |
|
<SurchargeTable |
|
:SurchargeData="form.dispatchPieceCategoryData" |
|
:Surcharge="dispatchPieceCategory" |
|
@focus="handleRowFocus" |
|
@search="search" |
|
@change="selectChange" |
|
> |
|
<template #default="slotProps"> |
|
<template v-if="slotProps.scope.column.label === '操作'"> |
|
<div class="eml_btn"> |
|
<span |
|
@click="storageplus" |
|
class="el_btn_a" |
|
v-if="slotProps.scope.row.index == 1" |
|
> |
|
<el-icon style="color: #409eff; margin-right: 3px"><CirclePlus /></el-icon |
|
>新增 |
|
</span> |
|
<span |
|
@click="storagereduce(slotProps.scope.row.index)" |
|
class="el_btn_b" |
|
v-if="slotProps.scope.row.index != 1" |
|
> |
|
<el-icon style="color: #f00; margin-right: 3px"><Delete /></el-icon>删除 |
|
</span> |
|
</div> |
|
</template> |
|
</template> |
|
</SurchargeTable> |
|
</el-form-item> |
|
|
|
<el-form-item label="按重量计费" v-if="form.dispatchWeightCategoryState"> |
|
<SurchargeTable |
|
:SurchargeData="form.dispatchWeightCategoryData" |
|
:Surcharge="dispatchWeightCategory" |
|
@focus="handleRowFocus" |
|
@search="search" |
|
@change="selectChange" |
|
> |
|
<template #default="slotProps"> |
|
<template v-if="slotProps.scope.column.label === '操作'"> |
|
<div class="eml_btn"> |
|
<span |
|
@click="categoriesplusweight" |
|
class="el_btn_a" |
|
v-if="slotProps.scope.row.index == 1" |
|
> |
|
<el-icon style="color: #409eff; margin-right: 3px"><CirclePlus /></el-icon |
|
>新增 |
|
</span> |
|
<span |
|
@click="categoriesduceweight(slotProps.scope.row.index)" |
|
class="el_btn_b" |
|
v-if="slotProps.scope.row.index != 1" |
|
> |
|
<el-icon style="color: #f00; margin-right: 3px"><Delete /></el-icon>删除 |
|
</span> |
|
</div> |
|
</template> |
|
</template> |
|
</SurchargeTable> |
|
</el-form-item> |
|
<el-form-item label="按方计费" v-if="form.dispatchCubeCategoryState"> |
|
<SurchargeTable |
|
:SurchargeData="form.dispatchCubeCategoryData" |
|
:Surcharge="dispatchCubeCategory" |
|
@focus="handleRowFocus" |
|
@search="search" |
|
@change="selectChange" |
|
> |
|
<template #default="slotProps"> |
|
<template v-if="slotProps.scope.column.label === '操作'"> |
|
<div class="eml_btn"> |
|
<span |
|
@click="categoriesplussquare" |
|
class="el_btn_a" |
|
v-if="slotProps.scope.row.index == 1" |
|
> |
|
<el-icon style="color: #409eff; margin-right: 3px"><CirclePlus /></el-icon |
|
>新增 |
|
</span> |
|
<span |
|
@click="categoriesducesquare(slotProps.scope.row.index)" |
|
class="el_btn_b" |
|
v-if="slotProps.scope.row.index != 1" |
|
> |
|
<el-icon style="color: #f00; margin-right: 3px"><Delete /></el-icon>删除 |
|
</span> |
|
</div> |
|
</template> |
|
</template> |
|
</SurchargeTable> |
|
</el-form-item> |
|
</div> |
|
</el-tab-pane> |
|
</el-tabs> |
|
</div> |
|
<!-- 附加费计费 --> |
|
<div class="el_Commercial_ercial"> |
|
<span class="el_title_span">附加费计费</span> |
|
<div class="el_fj"> |
|
<!-- 是否有分货费 --> |
|
<div class="el_Storage"> |
|
<span class="el_table_span">是否有分货费</span> |
|
<el-radio-group v-model="form.dispatchIsSortFee" class="el_Cselect"> |
|
<el-radio v-for="item in Distributionfee" :key="item.label" :label="item.value">{{ |
|
item.label |
|
}}</el-radio> |
|
</el-radio-group> |
|
</div> |
|
<!-- 是否有操作/装卸费 --> |
|
<div class="el_Storage"> |
|
<span class="el_table_span">是否有操作/装卸费</span> |
|
<el-radio-group v-model="form.dispatchIsOperateFee" class="el_Cselect"> |
|
<el-radio v-for="item in Operatingfee" :key="item.label" :label="item.value">{{ |
|
item.label |
|
}}</el-radio> |
|
</el-radio-group> |
|
</div> |
|
|
|
<!-- 是否有上楼费 --> |
|
<div class="el_Storage"> |
|
<div class="el_upstairs_a"> |
|
<span class="el_table_span">是否有上楼费</span> |
|
<el-radio-group |
|
@change="UpstairsChange" |
|
v-model="form.dispatchIsStairsCarryingCharge" |
|
class="el_Cselect" |
|
> |
|
<el-radio v-for="item in upstairs" :key="item.label" :label="item.value">{{ |
|
item.label |
|
}}</el-radio> |
|
</el-radio-group> |
|
</div> |
|
</div> |
|
<div class="el_Storage"> |
|
<div class="el_upstairs_b" v-if="form.dispatchIsStairsCarryingCharge"> |
|
<span class="el_table_span">是否配置免费层数</span> |
|
<el-radio-group v-model="form.dispatchIsFeeFloor" class="el_Cselect"> |
|
<el-radio v-for="item in Numberlayers" :key="item.label" :label="item.value">{{ |
|
item.label |
|
}}</el-radio> |
|
</el-radio-group> |
|
</div> |
|
</div> |
|
</div> |
|
<div class="el_translation"> |
|
<!-- 是否有平移费 --> |
|
<div class="el_Storage"> |
|
<span class="el_table_span">是否有平移费</span> |
|
<el-radio-group v-model="form.dispatchIsShiftingCharge" class="el_Cselect el_fx"> |
|
<el-radio v-for="item in Translationfee" :key="item.label" :label="item.value">{{ |
|
item.label |
|
}}</el-radio> |
|
</el-radio-group> |
|
</div> |
|
|
|
<!-- 附加费是否统一计费 --> |
|
<div class="el_Storage"> |
|
<span class="el_table_span">附加费是否按品类计费</span> |
|
<el-radio-group v-model="form.dispatchIsCategorySubjoin" class="el_Cselect el_fx"> |
|
<el-radio |
|
@change="SurchargeChange" |
|
v-for="item in Surchargefee" |
|
:key="item.label" |
|
:label="item.value" |
|
>{{ item.label }}</el-radio |
|
> |
|
</el-radio-group> |
|
</div> |
|
</div> |
|
|
|
<!-- 附加费品类 --> |
|
<div class="el_Storage" v-if="form.dispatchIsCategorySubjoin"> |
|
<div class="Storage-cont"> |
|
<el-form-item label="附加费品类"> |
|
<SurchargeTable |
|
:SurchargeData="form.dispatchSubjoinCategoryData" |
|
:Surcharge="dispatchSubjoinCategory" |
|
@focus="handleRowFocus" |
|
@search="search" |
|
> |
|
<template #default="slotProps"> |
|
<template v-if="slotProps.scope.column.label === '操作'"> |
|
<div class="eml_btn"> |
|
<span |
|
@click="categoriesplusSurcharge" |
|
class="el_btn_a" |
|
v-if="slotProps.scope.row.index == 1" |
|
> |
|
<el-icon style="color: #409eff; margin-right: 3px"><CirclePlus /></el-icon |
|
>新增 |
|
</span> |
|
<span |
|
@click="categoriesduceSurcharge(slotProps.scope.row.index)" |
|
class="el_btn_b" |
|
v-if="slotProps.scope.row.index != 1" |
|
> |
|
<el-icon style="color: #f00; margin-right: 3px"><Delete /></el-icon>删除 |
|
</span> |
|
</div> |
|
</template> |
|
</template> |
|
</SurchargeTable> |
|
</el-form-item> |
|
</div> |
|
</div> |
|
|
|
<!-- 最低计费 --> |
|
<div class="el_Storage el_Minimumbilling"> |
|
<span>最低计费</span> |
|
<div class="el_Storage"> |
|
<div class="el_Minimumbillingbox"> |
|
<!-- 是否最低计费 --> |
|
<div class="el_flex_row"> |
|
<span class="el_table_span">是否最低计费</span> |
|
<el-radio-group v-model="form.dispatchIsMinCost" class="el_Cselect el_fx"> |
|
<el-radio |
|
@change="MinimumChange" |
|
v-for="item in Minimumbilling" |
|
:key="item.label" |
|
:label="item.value" |
|
>{{ item.label }}</el-radio |
|
> |
|
</el-radio-group> |
|
</div> |
|
<!-- 最低计费方式 --> |
|
<!-- v-if="form.dispatchIsMinCost" --> |
|
<div v-if="form.dispatchIsMinCost" class="el_flex_row"> |
|
<span class="el_table_span">最低计费方式</span> |
|
<el-radio-group v-model="form.dispatchMinCostMode" class="el_Cselect el_fx"> |
|
<el-radio v-for="item in Billingmethod" :key="item.label" :label="item.value">{{ |
|
item.label |
|
}}</el-radio> |
|
</el-radio-group> |
|
</div> |
|
<!-- 最低计费类型 --> |
|
|
|
<div class="el_flex_row" v-if="form.dispatchIsMinCost"> |
|
<span class="el_table_span">最低计费类型</span> |
|
<el-radio-group v-model="form.dispatchMinCostType" class="el_Cselect el_fx"> |
|
<el-radio |
|
v-for="item in chargetypeSelect" |
|
:key="item.label" |
|
:label="item.value" |
|
>{{ item.label }}</el-radio |
|
> |
|
</el-radio-group> |
|
</div> |
|
|
|
<!-- 是否向上判断 --> |
|
|
|
<div v-if="!form.dispatchIsMinCost" class="el_flex_row"> |
|
<span class="el_table_span">是否向上判断</span> |
|
<el-radio-group v-model="form.dispatchIsUpwardJudgment" class="el_Cselect el_fx"> |
|
<el-radio v-for="item in Upwardjudgment" :key="item.label" :label="item.value">{{ |
|
item.label |
|
}}</el-radio> |
|
</el-radio-group> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
<!-- 操作按钮 --> |
|
<div class="flex-c-c"> |
|
<el-button type="primary" icon="Refresh" @click="resetFormData">重置</el-button> |
|
<el-button type="primary" icon="Position" @click="handleSubmit">保存</el-button> |
|
</div> |
|
</el-form> |
|
</div> |
|
</template> |
|
|
|
<script setup> |
|
import { ref, defineEmits, defineComponent, reactive } from 'vue'; |
|
import { ElMessage, ElMessageBox } from 'element-plus'; |
|
import { getDictionaryBiz } from '@/api/system/dict'; //字典 |
|
import { deepClone, fullscreenEnable } from '@/utils/util'; |
|
import { postFindCategoryInfo } from '@/api/distribution/CreateOrder.js'; |
|
import { $_priceTemplate, $_putpriceTemplate } from '@/api/financialsector/index'; //价格模板 |
|
import SurchargeTable from '@/components/pric/tablePric.vue'; |
|
import { submit } from '@/api/base/region'; |
|
const $route = useRoute(); //获取地址栏参数 |
|
const emit = defineEmits(['request-data']); |
|
defineComponent({ |
|
emits: ['request-data'], |
|
}); |
|
// 接收参数 |
|
const props = defineProps({ |
|
templateData: Object, |
|
}); |
|
console.log(props, '来自父页面参数'); |
|
const request = ref({}); //接收参数 |
|
//表单 |
|
const pageLoading = ref(true); |
|
const SelectData = ref({}); |
|
const formedit = ref({}); //编辑重置 |
|
const formCopy = ref(null); //拷贝的数据 |
|
const form = ref({ |
|
dispatchPieceCategoryState: true, //按件是否显示 |
|
dispatchWeightCategoryState: true, //按重量是否显示 |
|
dispatchCubeCategoryState: true, //按方是否显示 |
|
dispatchServiceType: '', //仓储计费类型 |
|
dispatchIsByCategory: 0, //是否区分品类 |
|
dispatchIsLeaveBehind: 0, //是否有遗留件 |
|
dispatchIsSortFee: 0, //是否有分货费 |
|
dispatchIsOperateFee: 0, //是否有操作装卸费 |
|
dispatchIsStairsCarryingCharge: 0, //是否有上楼费 |
|
dispatchIsFeeFloor: null, //是否配置免费层数 |
|
dispatchIsShiftingCharge: 0, //是否有平移费 |
|
dispatchIsCategorySubjoin: 0, //附加费 |
|
dispatchIsMinCost: 0, //是否最低计费 |
|
dispatchMinCostMode: null, //最低计费方式 |
|
dispatchMinCostType: 1, //最低计费类型 |
|
dispatchIsUpwardJudgment: 0, //是否向上判断 |
|
WarehousebillingmodeTitle: '', //标题 |
|
dispatchPieceCategoryData: [], //按件品类 |
|
dispatchWeightCategoryData: [], //按重量 |
|
dispatchCubeCategoryData: [], //按方品类 |
|
dispatchSubjoinCategoryData: [], //附加费品类 |
|
}); |
|
// 按件品类 |
|
const dispatchPieceCategory = ref([ |
|
//按件品类 |
|
{ label: '序号', prop: 'index', type: 'string', width: '50', disabled: true }, |
|
{ |
|
label: '产品品类', |
|
prop: 'Warehousecategory', |
|
type: 'select', |
|
width: 'auto', |
|
disabled: true, |
|
}, |
|
{ label: '操作', prop: '', type: '', width: '80', disabled: true }, |
|
]); |
|
// 按重量 |
|
const dispatchWeightCategory = ref([ |
|
{ label: '序号', prop: 'index', type: 'string', width: '50', disabled: true }, |
|
{ |
|
label: '产品品类', |
|
prop: 'Warehousecategory', |
|
type: 'select', |
|
width: 'auto', |
|
disabled: true, |
|
}, |
|
{ label: '操作', prop: '', type: '', width: '80', disabled: true }, |
|
]); |
|
// 按方品类 |
|
const dispatchCubeCategory = ref([ |
|
{ label: '序号', prop: 'index', type: 'string', width: '50', disabled: true }, |
|
{ |
|
label: '产品品类', |
|
prop: 'Warehousecategory', |
|
type: 'select', |
|
width: 'auto', |
|
disabled: true, |
|
}, |
|
{ label: '操作', prop: '', type: '', width: '80', disabled: true }, |
|
]); |
|
// 附加费品类 |
|
const dispatchSubjoinCategory = ref([ |
|
{ label: '序号', prop: 'index', type: 'string', width: '50', disabled: true }, |
|
{ |
|
label: '产品品类', |
|
prop: 'Warehousecategory', |
|
type: 'select', |
|
width: 'auto', |
|
disabled: true, |
|
}, |
|
{ label: '操作', prop: '', type: '', width: '80', disabled: true }, |
|
]); |
|
const SelectOpin = ref(null); //当前点击的品类搜索框 |
|
// 是否向上判断 |
|
const Upwardjudgment = ref([]); |
|
const CommercialcialCopy = ref([]); //服务类型拷贝 |
|
// 最低计费类型 |
|
const chargetypeSelect = ref([]); |
|
// 最低计费方式 |
|
const Billingmethod = ref([]); |
|
// 是否显示服务类型选择的列表 |
|
const StateDelivery = ref(false); |
|
// 是否最低计费 |
|
const Minimumbilling = ref([]); |
|
// 附加品类loading |
|
const goriesloading = ref(false); |
|
// 附加费加载 |
|
const SurchargeState = ref(false); |
|
// 上楼费是否展示配置 |
|
const UpstairsState = ref(false); |
|
// 是否品类填写 |
|
const categoriesState = ref(false); |
|
// 附加费品类配置 |
|
const AdditionalcategoriesList = ref([ |
|
{ |
|
id: 1, |
|
plus: true, |
|
reduce: false, |
|
StateName: 'Commercialcial', //附加费标识 |
|
Warehousecategory: '', //选择框值 |
|
Additionalcategories: [], |
|
}, |
|
]); |
|
// 附加费是否统一计费 |
|
const Surchargefee = ref([]); |
|
//是否有平移费 |
|
const Translationfee = ref([]); |
|
//是否配置免费层数 |
|
const Numberlayers = ref([]); |
|
// 是否有上楼费 |
|
const upstairs = ref([]); |
|
// 是否最低计费展示 |
|
const MinimumState = ref(false); |
|
//是否有分货费 |
|
const Distributionfee = ref([]); |
|
//是否有操作装卸费 |
|
const Operatingfee = ref([]); |
|
const Deliveryloading = ref(false); |
|
// 配送服务类型 |
|
const Warehousebillingmode = ref([]); |
|
const WarehousebillingmodeTitle = ref(''); //配送服务类型标题 |
|
// 配送计费模式 |
|
const ServiceList = ref([]); |
|
const Commercialcial = ref([]); |
|
// 是否区分品类 |
|
const Distinguishcategories = ref([]); |
|
// 是否有遗留件 |
|
const Leftoverparts = ref([]); |
|
// 计费类型选择 |
|
const chargetype = val => { |
|
console.log(val); |
|
if (val) { |
|
form.value.WarehousebillingmodeTitle = Warehousebillingmode.value.find( |
|
res => res.value == val |
|
).label; |
|
} |
|
}; |
|
//案件计费 |
|
const Storageloading = ref(false); |
|
// 附加费品类 |
|
const Additionalcategories = ref([]); |
|
|
|
const Timedelive = () => { |
|
Deliveryloading.value = true; |
|
let timerId = setTimeout(() => { |
|
Deliveryloading.value = false; |
|
clearTimeout(timerId); // 在回调函数内部清除定时器 |
|
}, 200); |
|
}; |
|
|
|
// 是否面配置楼层 |
|
const UpstairsChange = val => { |
|
if (val == 1) { |
|
form.value.dispatchIsFeeFloor = 0; //初始化参数 |
|
} else { |
|
form.value.dispatchIsFeeFloor = null; //初始化参数 |
|
} |
|
}; |
|
// 是否区分品类 |
|
const categoryChange = val => {}; |
|
// 是否最低计费展示 |
|
const MinimumChange = val => { |
|
console.log(val); |
|
if (val) { |
|
form.value.dispatchMinCostMode = 1; |
|
form.value.dispatchMinCostType=1 |
|
form.value.dispatchIsUpwardJudgment = 0; |
|
} else { |
|
form.value.dispatchMinCostMode = 0; |
|
form.value.dispatchIsUpwardJudgment = 0; //向上判断 |
|
form.value.dispatchMinCostType=null |
|
} |
|
}; |
|
|
|
// 根据当前选择的服务类型来选择是否显示框框 |
|
|
|
const CommercialcialDisplay = id => { |
|
let data = ServiceList.value.find(res => res.value == id); |
|
console.log(ServiceList.value, 'ServiceList.value'); |
|
if (data.value == 1) { |
|
form.value.dispatchPieceCategoryState = true; //按件是否显示 |
|
form.value.dispatchPieceCategoryData = [ |
|
{ |
|
index: 1, |
|
Warehousecategory: '', |
|
options: [], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'storage', //仓储标识 |
|
loading: false, |
|
}, |
|
]; |
|
|
|
if (data.check) { |
|
form.value.dispatchPieceCategoryState = true; //按件是否显示 |
|
} else { |
|
form.value.dispatchPieceCategoryState = false; //按件是否显示 |
|
} |
|
} else if (data.value == 2) { |
|
form.value.dispatchWeightCategoryData = [ |
|
{ |
|
index: 1, |
|
Warehousecategory: '', |
|
options: [], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'storage', //仓储标识 |
|
loading: false, |
|
}, |
|
]; |
|
if (data.check) { |
|
form.value.dispatchWeightCategoryState = true; //按件是否显示 |
|
} else { |
|
form.value.dispatchWeightCategoryState = false; //按件是否显示 |
|
} |
|
} else if (data.value == 3) { |
|
form.value.dispatchCubeCategoryData = [ |
|
{ |
|
index: 1, |
|
Warehousecategory: '', |
|
options: [], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'storage', //仓储标识 |
|
loading: false, |
|
}, |
|
]; |
|
|
|
if (data.check) { |
|
form.value.dispatchCubeCategoryState = true; //按件是否显示 |
|
} else { |
|
form.value.dispatchCubeCategoryState = false; //按件是否显示 |
|
} |
|
} |
|
}; |
|
|
|
// 点击菜单 |
|
const isChecked = item => { |
|
console.log(item.value, '点击菜单value'); |
|
if (!form.value.WarehousebillingmodeTitle) { |
|
ElMessage({ |
|
message: '请先选择仓储计费类型', |
|
type: 'warning', |
|
}); |
|
form.value.dispatchPricingType = []; //清空选择 |
|
|
|
item.check = false; //取消当前勾选 |
|
return; |
|
} |
|
CommercialcialDisplay(item.value); // 根据当前选择的服务类型来选择是否显示框框 |
|
Timedelive(); //加载效果 |
|
}; |
|
// 点击移除 |
|
const removeTag = value => { |
|
console.log(value, '点击移除value'); |
|
Deliveryloading.value = true; |
|
// 根据当前选择的服务类型来选择是否显示框框 |
|
|
|
let data = ServiceList.value.find(res => res.value == value); |
|
data.check = false; |
|
data.state = false; |
|
CommercialcialDisplay(value); // 根据当前选择的服务类型来选择是否显示框框 |
|
Timedelive(); //加载效果 |
|
}; |
|
|
|
// 移除对象 |
|
function removeItemById(array, id) { |
|
const index = array.findIndex(item => item.index === id); |
|
if (index !== -1) { |
|
array.splice(index, 1); |
|
if(array.length){ |
|
array.forEach((item, index) => { |
|
item.index = index + 1; |
|
}); |
|
} |
|
|
|
} |
|
} |
|
// 添加对象 |
|
function addItemAfterId(array, StateName) { |
|
console.log(array); |
|
const newItem = { |
|
index: array.length + 1, // 新对象的 ID 为当前数组长度加 1 |
|
plus: false, // 是否显示加号 |
|
reduce: true, // 是否显示减号 |
|
StateName, // 标识 |
|
Warehousecategory: '', // 选择框值 |
|
options: [], // 选择框列表，防止后期需要改动列表值 |
|
loading: false, |
|
}; |
|
array.push(newItem); |
|
} |
|
// 仓储减 |
|
const storagereduce = id => { |
|
removeItemById(form.value.dispatchPieceCategoryData, id); |
|
}; |
|
// 仓储加 |
|
const storageplus = () => { |
|
addItemAfterId(form.value.dispatchPieceCategoryData, 'storage'); |
|
}; |
|
|
|
// 按重量减 |
|
const categoriesduceweight = id => { |
|
removeItemById(form.value.dispatchWeightCategoryData, id); |
|
}; |
|
// 按重量加 |
|
const categoriesplusweight = () => { |
|
addItemAfterId(form.value.dispatchWeightCategoryData, 'storage'); |
|
}; |
|
|
|
// 按方计费减 |
|
const categoriesducesquare = id => { |
|
removeItemById(form.value.dispatchCubeCategoryData, id); |
|
}; |
|
// 按方计费加 |
|
const categoriesplussquare = () => { |
|
addItemAfterId(form.value.dispatchCubeCategoryData, 'storage'); |
|
}; |
|
// 附加费减 |
|
const categoriesduceSurcharge = id => { |
|
removeItemById(form.value.dispatchSubjoinCategoryData, id); |
|
}; |
|
// 附加费加 |
|
|
|
const categoriesplusSurcharge = () => { |
|
addItemAfterId(form.value.dispatchSubjoinCategoryData, 'Commercialcial'); |
|
}; |
|
// 附加品类加移除对象 |
|
function FmremoveItemById(array, id) { |
|
const index = array.findIndex(item => item.id === id); |
|
if (index !== -1) { |
|
array.splice(index, 1); |
|
if(array.length){ |
|
array.forEach((item, index) => { |
|
item.id = index + 1; |
|
}); |
|
} |
|
|
|
} |
|
let timerId = setTimeout(() => { |
|
goriesloading.value = false; |
|
clearTimeout(timerId); // 在回调函数内部清除定时器 |
|
}, 300); |
|
} |
|
|
|
// 附加品类加 |
|
const categoriesplus = id => { |
|
goriesloading.value = true; |
|
FmaddItemAfterId(AdditionalcategoriesList.value, id); |
|
}; |
|
// 附加品类减 |
|
const categoriesduce = id => { |
|
goriesloading.value = true; |
|
FmremoveItemById(AdditionalcategoriesList.value, id); |
|
}; |
|
|
|
async function updateDictionary(targetArray, dictionaryType) { |
|
await getDictionaryBiz(dictionaryType) |
|
.then(async res => { |
|
console.log(res, '字典'); |
|
if (res.data.code == 200) { |
|
if (res.data.data.length) { |
|
res.data.data.forEach(item => { |
|
targetArray.push({ |
|
value: Number(item.dictKey), |
|
label: item.dictValue, |
|
id: item.id, |
|
}); |
|
}); |
|
} |
|
} |
|
|
|
//服务类型 |
|
if (dictionaryType === 'dispatch_pricing_type') { |
|
Commercialcial.value = []; //清空服务类型 |
|
if(res.data.data && res.data.data.length){ |
|
res.data.data.forEach(res => { |
|
let data = { |
|
title: res.dictValue, // 标题 |
|
id: Number(res.dictKey), //码表ID |
|
state: false, //是否显示 |
|
Storageloading: false, //加载效果 |
|
sequence: [ |
|
//表格 |
|
{ |
|
id: 1, //序号 |
|
plus: true, //加号显示 |
|
reduce: false, //减号显示 |
|
Additionalcategories: [], //品类 |
|
Warehousecategory: '', //选择的值 |
|
StateName: 'storage', //附加费标识 |
|
}, |
|
], |
|
}; |
|
Commercialcial.value.push({ |
|
...data, |
|
}); |
|
}); |
|
} |
|
|
|
|
|
CommercialcialCopy.value = deepClone(Commercialcial.value); |
|
// 配送服务类型标题 |
|
|
|
console.log(form.value.dispatchServiceType,'服务类型aa'); |
|
|
|
|
|
|
|
} |
|
|
|
// 是否类型 |
|
if (dictionaryType == 'price_yes_no') { |
|
Leftoverparts.value = { ...Distinguishcategories.value }; //是否有遗留件 |
|
Distributionfee.value = { ...Distinguishcategories.value }; //是否有分货费 |
|
Operatingfee.value = { ...Distinguishcategories.value }; //是否有操作/装卸费 |
|
upstairs.value = { ...Distinguishcategories.value }; //是否有上楼费 |
|
Numberlayers.value = { ...Distinguishcategories.value }; //是否配置免费层数 |
|
Translationfee.value = { ...Distinguishcategories.value }; //是否有平移费 |
|
Surchargefee.value = { ...Distinguishcategories.value }; //附加费是否统一计费 |
|
Minimumbilling.value = { ...Distinguishcategories.value }; //是否最低计费 |
|
Upwardjudgment.value = { ...Distinguishcategories.value }; //是否向上判断 |
|
} |
|
}) |
|
.catch(() => {}) |
|
.finally(() => {}); |
|
} |
|
|
|
const handleRowFocus = data => { |
|
SelectData.value = data.row; |
|
console.log(SelectData.value, ' SelectData.value'); |
|
console.log('row:', data.row); |
|
console.log('column:', data.column); |
|
}; |
|
// 品类搜索 |
|
const search = val => { |
|
if (val) { |
|
let data = { |
|
goodsName: val, |
|
}; |
|
SelectData.value.loading = true; |
|
postFindCategoryInfo(data) |
|
.then(res => { |
|
console.log(res, '附加费品类计费'); |
|
if (res.data.code == 200) { |
|
if (res.data.data.length) { |
|
let concatdata = null; |
|
let data = null; |
|
SelectData.value.options = []; //如果有新的参数就清空之前的 |
|
console.log(SelectData.value.StateName, 'SelectData.value.StateName'); |
|
if(res.data.data && res.data.data.length){ |
|
res.data.data.forEach(item => { |
|
if (SelectData.value.StateName == 'storage') { |
|
//仓储 |
|
concatdata = form.value.dispatchCubeCategoryData.concat( |
|
form.value.dispatchWeightCategoryData, |
|
form.value.dispatchPieceCategoryData |
|
); |
|
data = concatdata.find(res => res.Warehousecategory == item.goodsId); |
|
} else if (SelectData.value.StateName == 'Commercialcial') { |
|
//附加费 |
|
data = form.value.dispatchSubjoinCategoryData.find( |
|
res => res.Warehousecategory == item.goodsId |
|
); |
|
} |
|
SelectData.value.options.push({ |
|
label: item.goodsName, |
|
value: item.goodsId, |
|
disabled: data ? true : false, |
|
}); |
|
}); |
|
} |
|
|
|
} |
|
} |
|
}) |
|
.catch(res => {}) |
|
.finally(() => { |
|
SelectData.value.loading = false; |
|
}); |
|
} |
|
}; |
|
|
|
function updateOptions(allDropdowns) { |
|
// 拉平所有的下拉框组到一个单一数组中 |
|
let dropdowns = [].concat(...allDropdowns); |
|
|
|
// 遍历每个下拉框 |
|
dropdowns.forEach((dropdown, index, self) => { |
|
// 取出当前下拉框选中的值 |
|
let selectedValue = dropdown.Warehousecategory; |
|
|
|
// 更新其他下拉框的options状态 |
|
self.forEach(otherDropdown => { |
|
if (dropdown !== otherDropdown) { // 确保不是自身 |
|
otherDropdown.options.forEach(option => { |
|
// 如果选项值和当前下拉框选中值相同，则禁用该选项 |
|
if (option.value === selectedValue) { |
|
option.disabled = true; |
|
} else { |
|
// 如果其他逻辑导致应保持禁用，可以在这里加上，下面的语句是检查是否已在别处被选中 |
|
let isSelectedSomewhereElse = self.some(d => d !== otherDropdown && d.Warehousecategory === option.value); |
|
option.disabled = isSelectedSomewhereElse; |
|
} |
|
}); |
|
} |
|
}); |
|
}); |
|
} |
|
|
|
|
|
|
|
// 构造一个包括所有下拉列表的数组 |
|
|
|
// 选择框值发生改变 |
|
const selectChange = data => { |
|
// console.log(data, 'data'); |
|
// console.log(form.value.dispatchCubeCategoryData,'dispatchCubeCategoryData111'); |
|
// console.log(form.value.dispatchWeightCategoryData,'dispatchWeightCategoryData222'); |
|
// console.log(form.value.dispatchPieceCategoryData,'dispatchPieceCategoryData333'); |
|
|
|
let allDropdowns = [form.value.dispatchCubeCategoryData, form.value.dispatchWeightCategoryData, form.value.dispatchPieceCategoryData]; |
|
// 更新选项 |
|
updateOptions(allDropdowns); |
|
|
|
}; |
|
const categoriesSearchfocus = item => { |
|
console.log(item, 'item'); |
|
SelectOpin.value = item; //获取当前点击的是那个品类输入框 |
|
}; |
|
// 附加费是否按品类计费 |
|
const SurchargeChange = val => { |
|
if (val) { |
|
form.value.dispatchSubjoinCategoryData = [ |
|
{ |
|
index: 1, |
|
Warehousecategory: '', |
|
options: [], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'Commercialcial', |
|
loading: false, |
|
}, |
|
]; |
|
} |
|
}; |
|
|
|
const clink = () => { |
|
if (ServiceList.value.length) { |
|
ServiceList.value.forEach(res => (res.check = false)); |
|
} |
|
}; |
|
/** 重置数据 */ |
|
const resetFormData = () => { |
|
console.log(CommercialcialCopy.value); |
|
ElMessageBox.confirm('是否重置数据?', '提示', { |
|
confirmButtonText: '确定', |
|
cancelButtonText: '取消', |
|
type: 'warning', |
|
}).then(async () => { |
|
pageLoading.value = true; |
|
if ($route.query.id) { |
|
console.log(form.value.dispatchPricingType, 'form.value.dispatchPricingType'); |
|
form.value = await deepClone(formedit.value); |
|
if(ServiceList.value.length){ |
|
ServiceList.value.forEach((res, index) => { |
|
console.log(res); |
|
|
|
if (form.value.dispatchPricingType.includes(res.value)) { |
|
console.log(res, '选中的'); |
|
res.check = true; |
|
} else { |
|
console.log(res, '未选中的'); |
|
res.check = false; |
|
} |
|
}); |
|
} |
|
|
|
} else { |
|
clink(); |
|
Commercialcial.value = deepClone(CommercialcialCopy.value); |
|
form.value = deepClone(formCopy.value); |
|
} |
|
|
|
setTimeout(() => { |
|
pageLoading.value = false; |
|
ElMessage({ |
|
message: '重置成功', |
|
type: 'success', |
|
}); |
|
}, 300); |
|
}); |
|
}; |
|
|
|
// 页面初始化必要请求 |
|
const onLoad = async () => { |
|
await updateDictionary(ServiceList.value, 'dispatch_pricing_type'); //仓储计费类型 |
|
await updateDictionary(Warehousebillingmode.value, 'dispatch_type'); //仓储计费类型 |
|
await updateDictionary(Distinguishcategories.value, 'price_yes_no'); //是否区分品类 |
|
await updateDictionary(Billingmethod.value, 'min_cost_way'); //是否区分品类 |
|
await updateDictionary(chargetypeSelect.value, 'min_cost_type'); //最低计费类型 |
|
formCopy.value = await deepClone(form.value); |
|
// 编辑回显 |
|
if (props.templateData.request) { |
|
console.log('执行回显'); |
|
request.value = await deepClone(props.templateData.request); |
|
form.value = await deepClone(request.value); |
|
|
|
form.value.dispatchPricingType = request.value.dispatchPricingType |
|
? request.value.dispatchPricingType.split(',').map(Number) |
|
: []; //服务类型 |
|
if(ServiceList.value.length){ |
|
ServiceList.value.forEach(dataItem => { |
|
if (form.value.dispatchPricingType.includes(dataItem.value)) { |
|
dataItem.check = true; |
|
if (dataItem.value == 1) { |
|
form.value.dispatchPieceCategoryState = true; //按件是否显示 |
|
} else if (dataItem.value == 2) { |
|
form.value.dispatchWeightCategoryState = true; //按重量是否显示 |
|
} else if (dataItem.value == 3) { |
|
form.value.dispatchCubeCategoryState = true; //按方是否显示 |
|
} |
|
} |
|
}); |
|
} |
|
|
|
|
|
StateDelivery.value = true; //显示表格 |
|
form.value.dispatchPieceCategoryData = []; |
|
if (request.value.dispatchPieceCategory) { |
|
if (request.value.dispatchPieceCategorys.length) { |
|
request.value.dispatchPieceCategorys.forEach((res, index) => { |
|
form.value.dispatchPieceCategoryData.push({ |
|
index: index + 1, |
|
Warehousecategory: res.id, |
|
options: [ |
|
{ |
|
label: res.name, |
|
value: res.id, |
|
}, |
|
], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'storage', //仓储标识 |
|
loading: false, |
|
}); |
|
}); |
|
} |
|
} else { |
|
form.value.dispatchPieceCategoryData.push({ |
|
index: 1, |
|
Warehousecategory: '', |
|
options: [], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'storage', //仓储标识 |
|
loading: false, |
|
}); |
|
} |
|
// 按重量 |
|
form.value.dispatchWeightCategoryData = []; |
|
if (request.value.dispatchWeightCategory) { |
|
if (request.value.dispatchWeightCategorys.length) { |
|
request.value.dispatchWeightCategorys.forEach((res, index) => { |
|
form.value.dispatchWeightCategoryData.push({ |
|
index: index + 1, |
|
Warehousecategory: res.id, |
|
options: [ |
|
{ |
|
label: res.name, |
|
value: res.id, |
|
}, |
|
], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'storage', //仓储标识 |
|
loading: false, |
|
}); |
|
}); |
|
} |
|
} else { |
|
form.value.dispatchWeightCategoryData.push({ |
|
index: 1, |
|
Warehousecategory: '', |
|
options: [], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'storage', //仓储标识 |
|
loading: false, |
|
}); |
|
} |
|
// 按方 |
|
form.value.dispatchCubeCategoryData = []; |
|
if (request.value.dispatchCubeCategory) { |
|
if (request.value.dispatchCubeCategorys.length) { |
|
request.value.dispatchCubeCategorys.forEach((res, index) => { |
|
form.value.dispatchCubeCategoryData.push({ |
|
index: index + 1, |
|
Warehousecategory: res.id, |
|
options: [ |
|
{ |
|
label: res.name, |
|
value: res.id, |
|
}, |
|
], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'storage', //仓储标识 |
|
loading: false, |
|
}); |
|
}); |
|
} |
|
} else { |
|
form.value.dispatchCubeCategoryData.push({ |
|
index: 1, |
|
Warehousecategory: '', |
|
options: [], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'storage', //仓储标识 |
|
loading: false, |
|
}); |
|
} |
|
|
|
// 附加品类回显 |
|
form.value.dispatchSubjoinCategoryData = []; |
|
if (request.value.dispatchSubjoinCategory) { |
|
if (request.value.dispatchSubjoinCategorys.length) { |
|
request.value.dispatchSubjoinCategorys.forEach((res, index) => { |
|
form.value.dispatchSubjoinCategoryData.push({ |
|
index: index + 1, |
|
Warehousecategory: res.id, |
|
options: [ |
|
{ |
|
label: res.name, |
|
value: res.id, |
|
}, |
|
], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'Commercialcial', |
|
loading: false, |
|
}); |
|
}); |
|
} else { |
|
form.value.dispatchSubjoinCategoryData = [ |
|
{ |
|
index: 1, |
|
Warehousecategory: '', |
|
options: [], |
|
plus: true, |
|
reduce: false, |
|
StateName: 'Commercialcial', |
|
loading: false, |
|
}, |
|
]; |
|
|
|
} |
|
} |
|
if (form.value.dispatchServiceType) { |
|
form.value.WarehousebillingmodeTitle = Warehousebillingmode.value.find( |
|
res => res.value == form.value.dispatchServiceType |
|
).label; |
|
} |
|
} |
|
formedit.value = await deepClone(form.value); |
|
pageLoading.value = false; |
|
}; |
|
onLoad(); |
|
// 保存事件 |
|
const handleSubmit = async () => { |
|
console.log(form.value.dispatchPieceCategoryData, 'form.value.dispatchPieceCategoryData'); |
|
|
|
await emit('request-data'); //通知父页面传递数据 |
|
console.log(props, 'props'); |
|
|
|
if (!props.templateData.TemplateName) { |
|
ElMessage({ |
|
message: '请输入模板名称', |
|
type: 'warning', |
|
}); |
|
return; |
|
} else { |
|
form.value.name = props.templateData.TemplateName; //模板名称 |
|
} |
|
if (!props.templateData.brand) { |
|
ElMessage({ |
|
message: '请选择品牌', |
|
type: 'warning', |
|
}); |
|
return; |
|
} else { |
|
form.value.brandId = props.templateData.brand; //品牌ID |
|
} |
|
|
|
if (!form.value.dispatchServiceType) { |
|
ElMessage({ |
|
message: '请选择配送服务类型', |
|
type: 'warning', |
|
}); |
|
return; |
|
} |
|
if (!form.value.dispatchPricingType.length) { |
|
ElMessage({ |
|
message: '请选择配送计费模式', |
|
type: 'warning', |
|
}); |
|
return; |
|
} |
|
|
|
|
|
form.value.serviceType = props.templateData.ServiceType.join(','); //顶部选择的服务类型 |
|
// 初始化数据 |
|
const Submit = deepClone(form.value); //拷贝一份要提交的数据 |
|
|
|
Submit.dispatchPricingType = Submit.dispatchPricingType.join(','); //服务类型处理 |
|
|
|
// 选择了是否区分品类才进行处理数据 |
|
if (form.value.dispatchIsByCategory) { |
|
console.log('区分品类了'); |
|
if (!form.value.dispatchPricingType.includes(1)) { |
|
Submit.dispatchPieceCategory = ''; |
|
} else { |
|
if (form.value.dispatchPieceCategoryData.find(res => !res.Warehousecategory)) { |
|
ElMessage({ |
|
message: '请填写完整按件计费品类', |
|
type: 'warning', |
|
}); |
|
return; |
|
} |
|
Submit.dispatchPieceCategory = form.value.dispatchPieceCategoryData |
|
.map(res => res.Warehousecategory) |
|
.join(','); |
|
// dispatchPieceCategoryData 件 |
|
// dispatchWeightCategoryData 重量 |
|
// dispatchCubeCategoryData 方 |
|
} |
|
if (!form.value.dispatchPricingType.includes(2)) { |
|
Submit.dispatchWeightCategory = ''; |
|
} else { |
|
if (form.value.dispatchWeightCategoryData.find(res => !res.Warehousecategory)) { |
|
ElMessage({ |
|
message: '请填写完整按重量计费品类', |
|
type: 'warning', |
|
}); |
|
console.log(form.value.dispatchWeightCategoryData, 'cascasdasd=>>'); |
|
return; |
|
} |
|
Submit.dispatchWeightCategory = form.value.dispatchWeightCategoryData |
|
.map(res => res.Warehousecategory) |
|
.join(','); |
|
} |
|
if (!form.value.dispatchPricingType.includes(3)) { |
|
Submit.dispatchCubeCategory = ''; |
|
} else { |
|
if (form.value.dispatchCubeCategoryData.find(res => !res.Warehousecategory)) { |
|
ElMessage({ |
|
message: '请填写完整按方计费品类', |
|
type: 'warning', |
|
}); |
|
return; |
|
} |
|
|
|
Submit.dispatchCubeCategory = form.value.dispatchCubeCategoryData |
|
.map(res => res.Warehousecategory) |
|
.join(','); |
|
} |
|
} else { |
|
Submit.dispatchPieceCategory = ''; |
|
Submit.dispatchWeightCategory = ''; |
|
Submit.dispatchCubeCategory = ''; |
|
} |
|
|
|
// 附加费是否按品类计费选择了是才进行处理 |
|
if (form.value.dispatchIsCategorySubjoin) { |
|
Submit.dispatchSubjoinCategory = form.value.dispatchSubjoinCategoryData |
|
.map(res => res.Warehousecategory) |
|
.join(','); //附加费品类 |
|
} else { |
|
if (Submit.dispatchSubjoinCategory) { |
|
Submit.dispatchSubjoinCategory = ''; |
|
} |
|
} |
|
|
|
console.log(Submit, '要提交的数据'); |
|
ElMessageBox.confirm('是否保存?', '提示', { |
|
confirmButtonText: '确定', |
|
cancelButtonText: '取消', |
|
type: 'warning', |
|
}).then(async () => { |
|
pageLoading.value=true |
|
if (props.templateData.code || $route.query.id) { |
|
console.log('走编辑接口'); |
|
// 编辑接口 |
|
let data = { |
|
id: props.templateData.code, //模板ID |
|
...Submit, |
|
checkType: 4, //服务类型 |
|
}; |
|
$_putpriceTemplate(data).then(res => { |
|
console.log(res, '提交成功后返回值'); |
|
if (res.data.code == 200) { |
|
ElMessage({ |
|
message: res.data.msg, |
|
type: 'success', |
|
}); |
|
} |
|
}).catch(res=>{ |
|
console.log(res,'错误信息'); |
|
}).finally(()=>{ |
|
pageLoading.value=false |
|
}); |
|
} else { |
|
// 新增接口 |
|
let data = { |
|
...Submit, |
|
}; |
|
console.log('走新增接口'); |
|
$_priceTemplate(data).then(res => { |
|
console.log(res, '提交成功后返回值'); |
|
if (res.data.code == 200) { |
|
ElMessage({ |
|
message: res.data.msg, |
|
type: 'success', |
|
}); |
|
emit('request-data', res.data.data); //把获取到的数据传递给父页面 |
|
} |
|
}).catch(res=>{ |
|
console.log(res,'错误信息'); |
|
}).finally(()=>{ |
|
pageLoading.value=false |
|
});; |
|
} |
|
}); |
|
}; |
|
</script> |
|
|
|
<style scoped lang="scss"> |
|
.content_max { |
|
padding: 10px; |
|
} |
|
|
|
.el_Service { |
|
display: flex; |
|
align-items: center; |
|
.name { |
|
margin-right: 10px; |
|
} |
|
.el-checkbox { |
|
width: 100% !important; |
|
padding: 0 30px; |
|
.el-checkbox__label { |
|
width: 100%; |
|
margin-left: 20px; |
|
} |
|
} |
|
|
|
.name { |
|
font-size: 16px; |
|
} |
|
} |
|
|
|
.el-checkbox { |
|
width: 100% !important; |
|
padding-left: 10px; |
|
box-sizing: border-box; |
|
.el-checkbox__label { |
|
margin-left: 20px; |
|
} |
|
} |
|
|
|
.el-select-dropdown__item::after { |
|
content: ''; |
|
display: none; |
|
} |
|
.el_Storage { |
|
margin-bottom: 30px; |
|
.el_Cselect { |
|
} |
|
.el_table_span { |
|
font-size: 16px; |
|
font-weight: 500; |
|
display: inline-block; |
|
width: 160px; |
|
margin-bottom: 10px; |
|
height: 16px; |
|
} |
|
.Storage-cont { |
|
/* 禁止双击选中文本 */ |
|
-webkit-user-select: none; /* Safari */ |
|
-moz-user-select: none; /* Firefox */ |
|
-ms-user-select: none; /* IE 10+/Edge */ |
|
user-select: none; /* Standard syntax */ |
|
display: flex; |
|
flex-direction: column; |
|
width: 24%; |
|
.el-form-item { |
|
flex-direction: column; |
|
width: 100%; |
|
margin-right: 0; |
|
.el-form-item__content { |
|
align-items: flex-start !important; |
|
} |
|
} |
|
} |
|
} |
|
|
|
:deep(.demo-tabs) { |
|
.el-tabs__item { |
|
font-size: 26px; |
|
font-weight: bold; |
|
} |
|
|
|
.el_Commercial_ercial { |
|
width: 100%; |
|
max-height: 500px; |
|
box-sizing: border-box; |
|
border-radius: 4px; |
|
display: flex; |
|
overflow-y: scroll; |
|
.el_margin { |
|
margin-left: 20px; |
|
} |
|
.el_margin:first-child { |
|
margin-left: 0; |
|
} |
|
.el-form-item { |
|
width: 24%; |
|
flex-direction: column; |
|
.el-form-item__content { |
|
align-items: flex-start !important; |
|
} |
|
} |
|
} |
|
} |
|
.el_Surchargebilling { |
|
.el_title_span { |
|
font-weight: bold; |
|
} |
|
} |
|
|
|
.el_upstairs { |
|
display: flex; |
|
.el_upstairs_b { |
|
margin-left: 70px; |
|
} |
|
} |
|
.el_Minimumbilling { |
|
.el_Minimumbillingbox { |
|
display: flex; |
|
.el_flex_row { |
|
display: flex; |
|
flex-direction: column; |
|
width: 24%; |
|
margin-right: 30px; |
|
.el-radio-group { |
|
width: 100%; |
|
} |
|
} |
|
} |
|
} |
|
.el_flex { |
|
display: flex; |
|
flex-direction: column; |
|
align-items: flex-start; |
|
.el_Cselect { |
|
margin-left: 0; |
|
} |
|
} |
|
:deep(.el_row_f1) { |
|
display: flex; |
|
align-items: flex-start; |
|
justify-content: space-between; |
|
.el-select { |
|
} |
|
.el_Storage { |
|
width: 24%; |
|
} |
|
.el-select__tags { |
|
width: 100%; |
|
} |
|
} |
|
.el_fx { |
|
background-color: #f6f6f6; |
|
padding: 0 6px; |
|
border-radius: 4px; |
|
} |
|
.el_fj { |
|
display: flex; |
|
align-items: center; |
|
width: 100%; |
|
justify-content: space-between; |
|
.el_Storage { |
|
display: flex; |
|
flex-direction: column; |
|
width: 24%; |
|
.el_Cselect { |
|
background-color: #f6f6f6; |
|
width: 100%; |
|
padding: 0 4px; |
|
} |
|
} |
|
} |
|
.el_table_select { |
|
width: 55%; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
} |
|
// 表格 |
|
.el_Commercial_ercial { |
|
.styled-table { |
|
width: 100%; |
|
border-collapse: collapse; |
|
} |
|
.tabBox { |
|
width: 24%; |
|
margin-right: 20px; |
|
} |
|
.styled-table thead tr { |
|
text-align: left; |
|
color: #000; |
|
background-color: #f5f8fa; |
|
} |
|
|
|
.styled-table th, |
|
.styled-table td { |
|
padding: 3px 10px; |
|
border: 1px solid #ddd; |
|
font-size: 16px; |
|
font-weight: 400; |
|
} |
|
|
|
.styled-table tbody tr { |
|
border-bottom: 1px solid #dddddd; |
|
} |
|
|
|
.styled-table tbody tr:nth-of-type(even) { |
|
background-color: #f3f3f3; |
|
} |
|
|
|
.styled-table tbody tr:last-of-type { |
|
} |
|
|
|
.el_btn_a { |
|
color: #409eff; |
|
} |
|
.el_btn_b { |
|
color: #ff0000; |
|
} |
|
} |
|
.el_translation { |
|
display: flex; |
|
width: 100%; |
|
.el_Storage { |
|
width: 24%; |
|
display: flex; |
|
flex-direction: column; |
|
margin-right: 24px; |
|
.el-radio-group { |
|
width: 100%; |
|
} |
|
} |
|
} |
|
:deep(.el_row_table) { |
|
thead { |
|
th { |
|
background-color: #f5f8fa; |
|
color: #172e60; |
|
} |
|
.cell { |
|
padding: 0 10px; |
|
} |
|
} |
|
tbody { |
|
.el-table tr:hover { |
|
background-color: transparent; |
|
} |
|
|
|
.cell { |
|
text-align: center; |
|
padding: 0 10px; |
|
.el-input-number { |
|
width: 100%; |
|
.el-input__wrapper { |
|
box-shadow: none; |
|
} |
|
|
|
.el-input__inner:hover { |
|
box-shadow: 0px 1px 0vw 0px #172e60; |
|
} |
|
} |
|
} |
|
} |
|
} |
|
.eml_btn { |
|
.el_btn_a, |
|
.el_btn_b { |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
cursor: pointer; |
|
} |
|
} |
|
</style>
|
|
|