优化客服话术和图片素材界面

This commit is contained in:
sonjinyon 2024-10-29 11:29:11 +08:00
parent c6c4dd7693
commit 1a0cfaac2b
2 changed files with 72 additions and 75 deletions

View File

@ -5,22 +5,23 @@
<!-- 菜单区域 -->
<div class="menu-area">
<el-button type="primary" plain @click="createType">
<el-button type="primary" plain @click="createType" style="width: 90;font-size: 12px;">
<Icon icon="ep:plus" class="mr-5px" /> 新增分类
</el-button>
<el-menu :default-active="targetMenuId">
<el-menu :default-active="targetMenuId" style="width:182px">
<el-menu-item :index="targetMenuId" :key="targetMenuId" @click="clickMenu(targetMenuId)">
全部类型
</el-menu-item>
<el-menu-item v-for="item in typeMenu" :index="item.value" :key="item.value"
@click="clickMenu(item.value)">
{{ item.label }}
<el-icon style="margin-left: 40px;" @mouseover="showActions = item.value"
<el-icon style="margin-left: 60px;width: 10px;" @mouseover="showActions = item.value"
@mouseleave="showActions = null">
<MoreFilled />
<div v-if="showActions === item.value" class="action-buttons">
<div v-if="showActions === item.value" class="action-buttons">
<el-button size="small" @click.stop="editItem(item.id,item.label)">编辑</el-button>
<br />
<el-button size="small" @click.stop="deleteItem(item.id)">删除</el-button>
</div>
</el-icon>
@ -355,9 +356,10 @@
}
.menu-area {
width: 200px;
height: 100vh;
padding: 25px;
background-color: white;
width: 180px;
height: 1000px;
/* 固定高度 */
overflow-y: hidden;
/* 禁止滚动 */

View File

@ -3,10 +3,10 @@
<div class="flex-container">
<!-- 菜单区域 -->
<div class="menu-area">
<el-button type="primary" plain @click="createType">
<el-button type="primary" plain @click="createType" style="width: 90;font-size: 12px;">
<Icon icon="ep:plus" class="mr-5px" /> 新增分类
</el-button>
<el-menu :default-active="targetMenuId">
<el-menu :default-active="targetMenuId" style="width:183px">
<el-menu-item v-for="item in huashuType" :index="item.value" :key="item.value"
@click="clickMenu(item.value)">{{item.label}}</el-menu-item>
</el-menu>
@ -79,11 +79,11 @@
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<Pagination :total="total" v-model:page="queryParams.pageNo" v-model:limit="queryParams.pageSize"
@pagination="getList" />
</ContentWrap>
</ContentWrap>
<!-- 分页 -->
<Pagination :total="total" v-model:page="queryParams.pageNo" v-model:limit="queryParams.pageSize"
@pagination="getList" />
</div>
</div>
@ -91,32 +91,26 @@
<!-- 表单弹窗添加/修改 -->
<VerbalTrickForm ref="formRef" @success="getList" />
<Dialog v-model="dialogVisible" :title="dialogTitle">
<el-form
ref="formRef"
v-loading="formLoading"
:model="formData"
:rules="formRules"
label-width="80px"
>
<el-form-item label="数据标签" prop="label">
<el-input v-model="formData.label" placeholder="请输入数据标签" />
</el-form-item>
<el-form-item label="显示排序" prop="sort">
<el-input-number v-model="formData.sort" :min="0" controls-position="right" />
</el-form-item>
</el-form>
<template #footer>
<el-button :disabled="formLoading" type="primary" @click="submitForm"> </el-button>
<el-button @click="dialogVisible = false"> </el-button>
</template>
<Dialog v-model="dialogVisible" :title="dialogTitle">
<el-form ref="formRef" v-loading="formLoading" :model="formData" :rules="formRules" label-width="80px">
<el-form-item label="数据标签" prop="label">
<el-input v-model="formData.label" placeholder="请输入数据标签" />
</el-form-item>
<el-form-item label="显示排序" prop="sort">
<el-input-number v-model="formData.sort" :min="0" controls-position="right" />
</el-form-item>
</el-form>
<template #footer>
<el-button :disabled="formLoading" type="primary" @click="submitForm"> </el-button>
<el-button @click="dialogVisible = false"> </el-button>
</template>
</Dialog>
</template>
<script setup lang="ts">
@ -128,24 +122,24 @@
import * as DictDataApi from '@/api/system/dict/dict.data'
const huashuType = ref<DictDataApi.DictDataVO[]>([]) //
const targetMenuId = ref('0')
const dialogVisible = ref(false) //
const dialogTitle = ref('新增分类') //
const formLoading = ref(false) // 12
const formData = ref({
id: undefined,
sort: undefined,
label: '',
value: '',
dictType: '',
// status: CommonStatusEnum.ENABLE,
colorType: '',
cssClass: '',
remark: ''
id: undefined,
sort: undefined,
label: '',
value: '',
dictType: '',
// status: CommonStatusEnum.ENABLE,
colorType: '',
cssClass: '',
remark: ''
})
const formRules = reactive({
label: [{ required: true, message: '数据标签不能为空', trigger: 'blur' }],
sort: [{ required: true, message: '数据顺序不能为空', trigger: 'blur' }],
label: [{ required: true, message: '数据标签不能为空', trigger: 'blur' }],
sort: [{ required: true, message: '数据顺序不能为空', trigger: 'blur' }],
})
/** 客服话术 列表 */
@ -179,36 +173,36 @@
loading.value = false
}
}
//
const createType = () =>{
const createType = () => {
dialogVisible.value = true
}
/** 提交表单 */
const emit = defineEmits(['success']) // success
const submitForm = async () => {
//
if (!formRef) return
const valid = await formRef.value.validate()
if (!valid) return
//
formLoading.value = true
try {
const data = formData.value as DictDataApi.DictDataVO
await DictDataApi.createType(data)
message.success(t('common.createSuccess'))
dialogVisible.value = false
//
emit('success')
queryParams.type = targetMenuId.value
getList()
getHuaShuTypeList()
} finally {
formLoading.value = false
}
//
if (!formRef) return
const valid = await formRef.value.validate()
if (!valid) return
//
formLoading.value = true
try {
const data = formData.value as DictDataApi.DictDataVO
await DictDataApi.createType(data)
message.success(t('common.createSuccess'))
dialogVisible.value = false
//
emit('success')
queryParams.type = targetMenuId.value
getList()
getHuaShuTypeList()
} finally {
formLoading.value = false
}
}
const clickMenu = (id : string) => {
console.log('1111111111', id)
@ -284,9 +278,10 @@
}
.menu-area {
width: 200px;
height: 100vh;
padding: 25px;
background-color: white;
width: 180px;
height: 1000px;
/* 固定高度 */
overflow-y: hidden;
/* 禁止滚动 */