Skip to content

P
pptist
Commit 6012cb31 authored by zhengke's avatar zhengke
Browse files
Options

颜色 优化

parent 2d0dcce5
Hide whitespace changes
Inline Side-by-side
Showing with 77 additions and 65 deletions
src/services/ConfigService.ts
View file @ 6012cb31
......@@ -149,8 +149,8 @@ class ConfigService{
*
* @returns 获取模板查询条件 配置项数据(颜色、国家、季节)
*/
static async GetTemplateQueryAsync():Promise<HttpResponse>{
return Api.Post("triptemplate_GetTemplateConfigData",{})
static async GetTemplateQueryAsync(params:any):Promise<HttpResponse>{
return Api.Post("triptemplate_GetTemplateConfigData",params)
}
/**
......
src/views/TemplateCenter/colour.vue
View file @ 6012cb31
<template>
<div class="row items-center flex-between q-mb-lg">
<div class="row items-center shrink q-pr-md marketTagDown marketTagDown">
<div class="MarketButton cursor-pointer"
<!-- <div class="MarketButton cursor-pointer"
:class="[datas.type == x.Id?'active':'']" v-for="(x,index) in datas.colorType" :key="index"
@click="datas.type=x.Id,search()">
{{x.Name}}
</div>
</div> -->
<!-- <span class="fz14 q-pr-sm shrink">&nbsp;&nbsp;列表类型:</span>
<el-select v-model="datas.type"
class="ml-1 shrink TemSel"
......@@ -29,21 +29,27 @@
</template>
</el-input>
<div class="row">
<el-button type="primary" size="default" style="color: #ffff;" @click="addColour">
新增颜色{{datas.type==2?'分类':''}}
<el-button type="primary" size="default" style="color: #ffff;" @click="addColour(1)">
新增颜色
</el-button>
<el-button type="primary" size="default" style="color: #ffff;" @click="addColour(2)">
新增分类
</el-button>
<el-button v-if="datas.type==1" class="q-pl-md" type="primary" size="default" style="color: #ffff;" @click="BatchSetting">
批量设置
<el-button class="q-pl-md" type="primary" size="default" style="color: #ffff;" @click="BatchSetting">
设置分类
</el-button>
</div>
</div>
<el-table v-loading="loading" ref="dataTableRef" highlight-current-row
v-load-more="tableScrollHandler" :data="dataList" class="tableHBEbeef5 col" height="82vh"
@selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" v-if="datas.type==1"/>
<el-table-column v-if="datas.type==1" label="颜色分类">
@selection-change="handleSelectionChange"
row-key="ID"
:tree-props="{ children: 'ChildList', hasChildren: 'hasChildren' }">
<el-table-column type="selection" width="55"
:selectable="selectable" :reserve-selection="true"/>
<el-table-column label="颜色分类">
<template #default="scope">
{{scope.row.ColorName?scope.row.ColorName:'不限'}}
{{scope.row.ColorName?scope.row.ColorName:''}}
</template>
</el-table-column>
<el-table-column :label="datas.type==1?'颜色名称':'名称'">
......@@ -54,11 +60,11 @@
<el-table-column label="色值">
<template #default="scope">
<el-tag
:color="scope.row.Content"
:color="scope.row.ColorValue"
effect="dark" class="q-mr-md">
&nbsp;
</el-tag>
{{scope.row.Content}}
{{scope.row.ColorValue}}
</template>
</el-table-column>
<el-table-column label="操作" width="130">
......@@ -74,7 +80,7 @@
:close-on-click-modal="false" style="width: 373px;"
class="small-padding" @close="close">
<template #header>
<div class="text-title text-center fz16 PingFangSC">{{datas.params.ID?'编辑':'新增'}}颜色{{datas.type==2?'分类':''}}</div>
<div class="text-title text-center fz16 PingFangSC">{{datas.params.ID?'编辑':'新增'}}{{datas.type==2?'分类':'颜色'}}</div>
</template>
<div class="addTemplateBox q-mb-lg fz14">
<div v-if="datas.type==1" class="addTemplateInput q-mt-xs q-mb-lg row items-center">
......@@ -83,19 +89,20 @@
style="width: 260px;"
class="ml-1"
placeholder="请选择颜色分类" clearable>
<el-option :key="Number(0)" label="不限" :value="Number(0)"/>
<el-option key="" label="不限" value=""/>
<el-option
v-for="item in ColorList"
:key="item.ID"
:label="`${item.Name}`"
:value="item.ID"
:disabled="setColorDisabled(item.ID)"
/>
</el-select>
</div>
<div class="addTemplateInput q-mt-xs q-mb-lg row items-center">
<span class="q-pr-md shrink">{{datas.type==1?'':'分类'}}名称：</span>
<el-input min="750" v-model="datas.params.Name"
:placeholder="datas.type==1?'请输入颜色名称':'请输入颜色分类名称'" class=""></el-input>
:placeholder="datas.type==1?'请输入颜色名称':'请输入分类名称'" class=""></el-input>
</div>
<div class="addTemplateInput q-mt-xs q-mb-lg row items-center">
<span class="q-pr-md shrink">色值：</span>
......@@ -136,7 +143,7 @@
<div class="addTemplateInput q-mt-xs q-mb-lg">
<template v-for="(x,index) in multipleSelection">
<el-tag
:color="x.Content"
:color="x.ColorValue"
effect="dark" class="q-mr-xs w10">
&nbsp;
</el-tag>
......@@ -154,22 +161,10 @@
:key="item.ID"
:label="`${item.Name}`"
:value="item.ID"
:disabled="setColorDisabled(item.ID)"
/>
</el-select>
</div>
<!-- <div class="addTemplateInput q-mt-xs q-mb-lg row items-center">
<span class="q-pr-md shrink">名称：</span>
<el-input min="750" v-model="datas.params.Name"
placeholder="请输入颜色名称" class=""></el-input>
</div>
<div class="addTemplateInput q-mt-xs q-mb-lg row items-center">
<span class="q-pr-md shrink">色值：</span>
<el-input min="750" v-model="datas.params.Content"
placeholder="例子:#e5e3da" class=""></el-input>
<div class="q-pl-sm">
<el-color-picker v-model="datas.params.Content" />
</div>
</div> -->
</div>
<div class="text-center">
<el-button class="MarketIndexButtom MarketRec" type="primary" @click="ConfirmCreation(1)"
......@@ -207,11 +202,11 @@
const enTheme = ENT_USER_THEME
const dataList = ref([] as Array < any > );
const RawDataList = ref([] as Array < any > );
const DataListAll = ref([] as Array < any > );
const loading = ref(false as any)
const deleteLoading = ref<any>(null)
const queryObj = reactive({
DictKey: 'Trip_Template_Color',
// DictKey: 'Trip_Template_Color',
Name: ''
})
const dataTableRef = ref()
......@@ -248,6 +243,25 @@
const ColorList = ref([])
const multipleSelection = ref([])
const setColorDisabled = (ID:number) => {
if(datas.addEditVisible) {
if(datas.params.Code==ID) return true
else false
}
if(datas.DominantColour) {
for(let i=0;i<multipleSelection.value.length;i++){
if(multipleSelection.value[i].ID==ID) return true
else false
}
}
}
const selectable = (row:Object, index:Number)=> {
if (row.ChildList&&row.ChildList.length>0) {
return false;
} else {
return true;
}
}
const handleSelectionChange = (val: any) =>{
multipleSelection.value = val
datas.paramsParent.ColorList = val.length>0? val.map(x=> {return x.ID}) : 0
......@@ -282,12 +296,23 @@
await addEditColor()
}
}
const toggleSelection = (rows:any) => {
if (rows) {
rows.forEach(row => {
dataTableRef.value.toggleRowSelection(row);
});
} else {
dataTableRef.value.clearSelection();
}
getColor()
}
const setColour = async () => {
datas.requestLoading = true
const result = await LineService.BatchSetColor(datas.paramsParent)
if(result.data.resultCode==1){
datas.DominantColour = false
datas.requestLoading = false
toggleSelection()
querySearchHandler()
}else{
ElMessage({
......@@ -326,6 +351,7 @@
if(result.data.resultCode==1){
datas.addEditVisible = false
datas.requestLoading = false
toggleSelection()
querySearchHandler()
}else{
ElMessage({
......@@ -335,7 +361,8 @@
datas.requestLoading = false
}
}
const addColour = () => {
const addColour = (Id:number) => {
datas.type = Id
datas.addEditVisible = true
}
const editDelete = (item: Object,index: Number) => {
......@@ -344,6 +371,9 @@
}else{
datas.params = JSON.parse(JSON.stringify(item))
datas.params.Code = item.Code?Number(item.Code):''
datas.params.Content = item.ColorValue
datas.type = item.ChildList&&item.ChildList.length>0?2:1
if(datas.type==2||(datas.type==1&&!datas.params.Name))datas.params.Name = item.ColorName
datas.addEditVisible = true
}
}
......@@ -366,7 +396,7 @@
})
let dataRes = await LineService.RemoveTemplateConfigData(item.ID)
if (dataRes.data.resultCode == 1) {
queryObj.pageIndex = 1
// queryObj.pageIndex = 1
ElMessage({
showClose: true,
message: `删除${item.Content}成功`,
......@@ -391,48 +421,30 @@
}
const tableScrollHandler = ()=>{
if(queryObj.pageCount>queryObj.pageIndex){
queryObj.value.pageIndex++
refreshHandler()
}
// if(queryObj.pageCount>queryObj.pageIndex){
// queryObj.value.pageIndex++
// refreshHandler()
// }
}
const search = () => {
queryObj.pageIndex = 1
// queryObj.pageIndex = 1
querySearchHandler()
}
const querySearchHandler = async () => {
loading.value = true
try {
let pageRes = await LineService.GetTemplateConfigDataList(queryObj);
// if(datas.type==1) pageRes = await LineService.GetTemplateConfigDataList(queryObj);
// else pageRes = await LineService.GetParentColor(queryColor.value);
if (pageRes.data.resultCode == 1) {
let response = await ConfigService.GetTemplateQueryAsync(queryObj)
if (response.data.resultCode == 1) {
let arrList = function(list){
list.forEach(x=>{
x.ColorName = ''
x.Content = ''
})
}
arrList(pageRes.data.data)
if(datas.type==1) {
dataList.value = pageRes.data.data.filter(x=>{
return x.Code
})
}
else {
dataList.value = pageRes.data.data.filter(x=>{
return !x.Code
})
}
for(let i=0;i<dataList.value.length;i++){
let Color = ColorList.value.filter(x=>{
if(datas.type==1) return x.ID==Number(dataList.value[i].Code)
else return x.ID==Number(dataList.value[i].ID)
})
if(Color.length>0) {
dataList.value[i].ColorName = Color[0].Name
}
}
arrList(response.data.data.ColorList)
DataListAll.value = response.data.data.ColorList
dataList.value = response.data.data.ColorList
// ColorList.value = response.data.data.ColorList
}
loading.value = false
} catch (error) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment