Skip to content

C
CRM
Commit 14a40512 authored by lei's avatar lei
Browse files
Options

信息查看内容开发

parent 426dd9db
Hide whitespace changes
Inline Side-by-side
Showing with 786 additions and 20 deletions
src/api/classifyData.js 0 → 100644
View file @ 14a40512
// 信息分类接口
import request from '@/utils/request'
// 获取所有类别
export function getAllCategory(params) {
return request({
url: '/api/informationClass/findInformationClassByPidTree',
method: 'get',
params
})
}
// 2、根据名称获取信息分类
export function getNameCategory(param) {
return request({
url: '/api/informationClass/findInformationClassByName',
method: 'get',
params: param
})
}
// 3.新增信息分类
export function addClassification(data) {
return request({
url: '/api/informationClass/insertInformationClass',
method: 'post',
data
})
}
// 4、修改信息分类
export function editClassification(data) {
return request({
url: '/api/informationClass/updateInformationClass',
method: 'put',
data
})
}
// 5.删除
export function deleteTypeDict(params) {
return request({
url: '/api/informationClass/deleteInformationClassById',
method: 'delete',
params
})
}
// 6.根据信息分类获取人员信息
export function getClassifyUserMessage(param) {
return request({
url: '/api/informationClass/findInformationClassByUserId',
method: 'get',
params: param
})
}
// 7.新增信息分类
export function changeClassInput(data) {
return request({
url: '/api/tabAssignWeight/updateByIdWeight',
method: 'post',
data
})
}
src/api/treeMenus.js
View file @ 14a40512
import request from '@/utils/request'
// 信息类别 Tree 列表
export function reqInformationTreeList(params){
return request({
url: '/api/informationClass/findInformationClassByPid',
method: 'get',
params,
})
export function reqInformationTreeList(params) {
return request({
url: '/api/informationClass/findInformationClassByPid',
method: 'get',
params
})
}
// 信息类别 Tree 列表
export function reqAllInfoTreeList(params){
return request({
url: '/api/informationClass/findAllInformationClass',
method: 'get',
params,
})
export function reqAllInfoTreeList(params) {
return request({
url: '/api/informationClass/findAllInformationClass',
method: 'get',
params
})
}
// 构建好的 Tree 列表
export function reqAllInfoTreeBuild(params){
return request({
url: '/api/informationClass/findInformationClassByPidTree',
method: 'get',
params,
})
}
\ No newline at end of file
export function reqAllInfoTreeBuild(params) {
return request({
url: '/api/informationClass/findInformationClassByPidTree',
method: 'get',
params
})
}
src/api/treeMenus.js.bak 0 → 100644
View file @ 14a40512
import request from '@/utils/request'
// 信息类别 Tree 列表
export function reqInformationTreeList(params){
return request({
url: '/api/informationClass/findInformationClassByPid',
method: 'get',
params,
})
}
// 信息类别 Tree 列表
export function reqAllInfoTreeList(params){
return request({
url: '/api/informationClass/findAllInformationClass',
method: 'get',
params,
})
}
// 构建好的 Tree 列表
export function reqAllInfoTreeBuild(params){
return request({
url: '/api/informationClass/findInformationClassByPidTree',
method: 'get',
params,
})
}
\ No newline at end of file
src/views/lookupClass/classify.vue 0 → 100644
View file @ 14a40512
<!-- 信息分类 -->
<template>
<div class="datamanage-wrapper">
<div class="search-wrapper">
<el-button
size="mini"
type="primary"
icon="el-icon-circle-plus"
class="addbtn"
@click="addDialogData()"
>新增</el-button>
</div>
<div class="table-wrapper">
<div class="infoline">信息分类列表</div>
<el-table
ref="table"
lazy
:load="getDeptDatas"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
:data="typeManage.fromData"
row-key="id"
>
<!-- <el-table-column :selectable="checkboxT" type="selection" width="55" /> -->
<el-table-column label="名称" prop="label" style="width: 100px" />
<el-table-column type="index" label="序号" style="width: 100px" />
<el-table-column label="操作" fixed="right">
<template slot-scope="scope">
<el-button
size="mini"
type="primary"
icon="el-icon-edit"
@click="typeEdit($event, scope.$index, scope.row)"
>编辑</el-button>
<el-button
size="mini"
type="danger"
icon="el-icon-delete"
@click="typeDelete(scope.row)"
>删除</el-button>
<el-button
size="mini"
type="primary"
icon="el-icon-zoom-in"
@click="lookClassButton(scope.row)"
>查看</el-button>
</template>
</el-table-column>
</el-table>
</div>
<el-dialog title="新增分类名称" :visible.sync="typeManage.addDialog">
<el-form ref="addDataForm" :model="typeManage.from" :rules="formrules">
<el-form-item prop="addname" label="分类名称:" :label-width="'120px'">
<el-input
v-model="typeManage.from.addname"
clearable
style="width: 220px"
placeholder="请输入类别"
/>
</el-form-item>
<el-form-item prop="test" label="推送信息:" :label-width="'120px'">
<el-select
v-model="typeManage.from.test"
multiple
placeholder="请选择"
style="width: 220px"
>
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item prop="id" label="添加到:" :label-width="'120px'">
<treeselect
v-model="typeManage.from.id"
:options="infoTree.menus"
:load-options="loadInfoTreeMenus"
style="width: 180px"
placeholder="选择上级类目"
/>
</el-form-item>
</el-form>
<div slot="footer">
<el-button
type="primary"
:loading="typeManage.flag === 0"
@click="determine"
>确定</el-button>
</div>
</el-dialog>
<el-dialog title="编辑分类名称" :visible.sync="typeManage.editDialog">
<el-form ref="editDataForm" :model="editFormInfo" :rules="rules">
<el-form-item prop="type" label="分类名称:" :label-width="'120px'">
<el-input
v-model="editFormInfo.type"
clearable
style="width: 220px; margin-left: 20px"
placeholder="请输入类别"
/>
</el-form-item>
<el-form-item prop="choose" label="推送信息:" :label-width="'120px'">
<el-select
v-model="editFormInfo.choose"
multiple
placeholder="请选择"
style="width: 220px; margin-left: 20px"
@change="selectChange"
>
<el-option
v-for="item in newoptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item prop="pid" label="添加到:" :label-width="'120px'">
<treeselect
v-model="editFormInfo.pid"
:options="infoTree.menus"
:load-options="loadInfoTreeMenus"
style="width: 180px"
placeholder="选择上级类目"
/>
</el-form-item>
</el-form>
<div slot="footer">
<el-button
type="primary"
icon="el-icon-success"
:loading="editFormInfo.flag === 0"
@click="uploadAddForm"
>确定</el-button>
</div>
</el-dialog>
<el-dialog
title="查看信息分类人员信息"
:visible.sync="lookClassData.dialogOff"
>
<!--表格渲染-->
<el-table ref="table" :data="lookClassData.tableData" style="width: 100%">
<el-table-column
:show-overflow-tooltip="true"
prop="username"
label="用户名"
/>
<el-table-column
:show-overflow-tooltip="true"
prop="phone"
width="100"
label="电话"
/>
<el-table-column
:show-overflow-tooltip="true"
width="135"
prop="email"
label="邮箱"
/>
<el-table-column :show-overflow-tooltip="true" prop="name" label="部门">
<template slot-scope="scope">
<div>{{ scope.row.name }}</div>
</template>
</el-table-column>
<!-- <el-table-column label="状态" align="center" prop="enabled">
<template slot-scope="scope">
<el-switch
v-model="scope.row.enabled"
:disabled="user.id === scope.row.id"
active-color="#409EFF"
inactive-color="#F56C6C"
/>
</template>
</el-table-column> -->
<el-table-column
v-if="checkPer(['admin', 'user:edit', 'user:del'])"
label="操作"
width="300"
align="center"
fixed="right"
>
<template slot-scope="scope">
<!-- <el-button
@click="addDialogData('edit',scope.row.id,scope.row)"
:disabled="scope.row.name !='销售三中心'
&&scope.row.name !='销售五中心'&&scope.row.name !='销售一中心'
&&scope.row.name !='销售二中心'&&scope.row.name !='销售六中心'&&
scope.row.name !='销售一部'&&scope.row.name !='销售三部'&&
scope.row.name !='销售二部'&&scope.row.name !='外贸部'&&scope.row.name !='副总经理'"
size="mini"
type="primary"
>
信息权重
</el-button> -->
信息权重
<el-input-number
v-model="scope.row.value"
small
step-strictly
:disabled="
scope.row.name != '销售三中心' &&
scope.row.name != '销售五中心' &&
scope.row.name != '销售一中心' &&
scope.row.name != '销售二中心' &&
scope.row.name != '销售六中心' &&
scope.row.name != '销售一部' &&
scope.row.name != '销售三部' &&
scope.row.name != '销售二部' &&
scope.row.name != '外贸部' &&
scope.row.name != '副总经理'
"
controls-position="right"
:min="1"
:max="3"
@change="lookClassDataInputChange(scope.row)"
/>
</template>
</el-table-column>
</el-table>
<el-pagination
small
layout="prev, pager, next"
:total="lookClassData.tableTotal"
@current-change="lookClassPaginaChange"
/>
<div slot="footer">
<el-button
type="primary"
icon="el-icon-success"
:loading="editFormInfo.flag === 0"
@click="lookClassData.dialogOff = !lookClassData.dialogOff"
>确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
getAllCategory,
getNameCategory,
addClassification,
editClassification,
deleteTypeDict,
getClassifyUserMessage,
changeClassInput
} from '@/api/classifyData.js'
import { reqInformationTreeList, reqAllInfoTreeList } from '@/api/treeMenus.js'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
components: { Treeselect },
data() {
return {
// 1.获取全部信息分类
typeManage: {
page: 1,
size: 10,
total: 0,
selectdata: [],
dropData: [],
addDialog: false,
flag: 1,
pid: 0,
from: {
addname: '',
test: [] // 默认选项，要在el-checkbox-group里绑定一个空数组
},
editDialog: false,
fromData: []
},
// 2.根据名称获取信息分类
name: '',
// 3.新增信息分类
options: [
{
value: '姓名',
label: '姓名'
},
{
value: '电话',
label: '电话'
},
{
value: '公司名称',
label: '公司名称'
},
{
value: '需求描述',
label: '需求描述'
}
],
chooseString: '',
// 4.编辑信息分类
editFormInfo: {
flag: 1,
type: '',
send: '',
id: '',
choose: [],
pid: 0
},
editString: '',
checkList: [],
newoptions: [
{
value: '姓名',
label: '姓名'
},
{
value: '电话',
label: '电话'
},
{
value: '公司名称',
label: '公司名称'
},
{
value: '需求描述',
label: '需求描述'
}
],
newval: [],
// 验证
formrules: {
addname: [{ required: true, message: '请输入类别', trigger: 'blur' }],
test: [
{ required: true, message: '请选择推送信息', trigger: 'change' }
]
},
rules: {
type: [{ required: true, message: '请输入类别', trigger: 'blur' }],
choose: [
{ required: true, message: '请选择推送信息', trigger: 'change' }
]
},
infoTree: {
menus: [{ id: 0, label: '信息分类', children: null, pid: -1 }]
},
// 查看分类人员信息相关
lookClassData: {
dialogOff: false,
tableData: [],
lookClassDataId: '',
page: 1,
pageSize: 10,
tableTotal: 100
}
}
},
mounted() {
var that = this
// 信息分类字典
this.reqBuildTreeList()
this.classification()
this.getSelectInfo()
},
methods: {
// 构建 Tree列表
reqBuildTreeList: function() {
var that = this
reqAllInfoTreeList().then(function(res) {
if (res.code === 200) {
var list = res.object.records || []
that.infoTree.menus = [
{ id: 0, label: '信息分类', children: null, pid: -1 }
]
list.push(that.infoTree.menus[0])
qf.Utils.treeListBuild(list)
}
})
},
// 1.获取全部信息分类
classification(params) {
var typeM = this.typeManage
var params = {
page: typeM.page,
pageSize: typeM.size
}
reqInformationTreeList({ pid: 0 }).then((res) => {
var list = res.object.records || []
for (var item of list) {
item.hasChildren = !item.leaf
}
typeM.selectdata = list
typeM.fromData = list
typeM.total = res.object.total
})
},
// 获取分类下拉列表
getSelectInfo() {
var typeM = this.typeManage
var params = {
page: 1,
pageSize: 999
}
getAllCategory(params).then((res) => {
var dropDown = res.object.records || []
typeM.dropData = dropDown
})
},
// 获取全部信息分类分页
handleSizeChange(val) {
// 每页多少条
this.typeManage.size = val
this.classification()
},
handleCurrentChange(val) {
// 当前是多少页
this.typeManage.page = val
this.classification()
},
// 2.根据名称获取信息分类
toSearch() {
var typeM = this.typeManage
var param = {
page: this.typeManage.page,
pageSize: this.typeManage.size
}
this.name && (param.name = this.name)
var typeM = this.typeManage
getNameCategory(param).then((res) => {
var selectlist = res.object.records || []
typeM.fromData = selectlist
typeM.total = res.object.total
})
},
// 新增
addDialogData() {
this.typeManage.addDialog = true
this.typeManage.from.addname = ''
this.typeManage.from.id = 0
this.typeManage.from.test = ''
},
determine() {
if (this.typeManage.flag) {
this.typeManage.flag = 0
this.chooseString = this.typeManage.from.test.join()
this.$refs.addDataForm.validate((valid) => {
if (valid) {
var params = {
name: this.typeManage.from.addname,
pushNew: this.chooseString,
pid: this.typeManage.from.id
}
var self = this
addClassification(params).then(
(res) => {
this.typeManage.addDialog = false
this.classification()
setTimeout(function() {
self.typeManage.flag = 1
}, 300)
self.$message({
type: 'success',
message: '新增成功'
})
},
() => {
self.$message.error('新增失败')
}
)
}
})
}
},
// 4、修改信息分类
typeEdit(e, index, item) {
this.typeManage.editDialog = true
this.editFormInfo.send = item.pushnew
this.editFormInfo.id = item.id
this.editFormInfo.choose = this.editFormInfo.send.split(',')
this.editFormInfo.type = item.label
this.editFormInfo.pid = item.pid
this.CacheItem = item
},
selectChange(val) {
this.newval = val
this.editFormInfo.send = this.newval.join()
},
uploadAddForm() {
if (this.editFormInfo.flag) {
this.editFormInfo.flag = 0
this.$refs.editDataForm.validate((valid) => {
if (valid) {
var params = {
id: this.editFormInfo.id,
name: this.editFormInfo.type,
pushNew: this.editFormInfo.send,
pid: this.editFormInfo.pid
}
var self = this
editClassification(params).then((res) => {
if (res.code === 200) {
this.typeManage.editDialog = false
this.CacheItem.label = params.name
this.CacheItem.pushnew = params.pushNew
setTimeout(function() {
self.editFormInfo.flag = 1
}, 300)
// 重新构建列表
this.classification()
}
// message
self.$message(
{
type: 'success',
message: '编辑成功'
},
() => {
self.$message.error('编辑失败')
}
)
})
}
})
}
},
// 5.删除
typeDelete(item) {
var id = item.id
this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
deleteTypeDict({ id: id }).then(
(res) => {
this.$message({
message: '删除成功',
type: 'success'
})
this.classification()
},
() => {
this.$message.error('删除失败')
}
)
})
},
getDeptDatas(tree, treeNode, resolve) {
const params = { pid: tree.id }
reqInformationTreeList(params).then((res) => {
var list = res.object.records || []
for (var item of list) {
item.hasChildren = !item.leaf
}
resolve(list)
})
},
// 6.查看分类人员信息
lookClassButton(item) {
this.lookClassData.dialogOff = true
this.lookClassData.lookClassDataId = item.id
this.getClassifyUser({
page: this.lookClassData.page,
pageSize: this.lookClassData.pageSize,
classId: item.id
})
},
// 7.人员分类信息分页
lookClassPaginaChange(item) {
this.getClassifyUser({
page: item,
pageSize: this.lookClassData.pageSize,
classId: this.lookClassData.lookClassDataId
})
},
// 8.获取分类人员表格数据
getClassifyUser(param) {
getClassifyUserMessage(param).then((res) => {
this.lookClassData.tableData = res.object.data
this.lookClassData.tableTotal = res.object.total
})
},
// 9.修改人员权重
lookClassDataInputChange(item) {
item.infoClass = this.lookClassData.lookClassDataId
changeClassInput(item).then((res) => {})
},
// 加载信息分类列表
loadInfoTreeMenus({ action, parentNode, callback }) {
if (action === 'LOAD_CHILDREN_OPTIONS') {
setTimeout(() => {
callback()
}, 100)
}
}
}
}
</script>
<style lang="scss" scoped>
.datamanage-wrapper {
width: 100%;
height: 100%;
padding: 10px;
border-radius: 5px;
background-color: #f5f6fb;
}
.search-wrapper {
width: 100%;
display: flex;
padding: 10px;
border-radius: 5px;
margin: 10px 0px 10px 0px;
background: #fff;
}
.table-wrapper {
width: 100%;
padding: 10px;
border-radius: 5px;
margin: 10px 0px 10px 0px;
background: #fff;
}
.searchbtn {
margin-left: 30px;
padding: 6px 15px;
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
height: 30px;
background-color: #13ce66;
border-color: #13ce66;
}
.addbtn {
margin-left: 30px;
padding: 6px 15px;
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
height: 30px;
}
.infoline {
width: 100%;
height: 100px;
font-weight: bold;
font-size: 24px;
display: flex;
justify-content: flex-start;
align-items: center;
margin-left: 20px;
}
</style>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .vue-treeselect__control,
::v-deep .vue-treeselect__placeholder,
::v-deep .vue-treeselect__single-value {
height: 30px;
line-height: 30px;
}
</style>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
</style>
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