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.
564 lines
17 KiB
564 lines
17 KiB
<template>
|
|
<div class="app-container">
|
|
<!-- <changshang />-->
|
|
<div v-show="viewState == 1">
|
|
<button-bar view-title="厂商管理" ref="btnbar" :btndisabled="btndisabled" @btnhandle="btnHandle"/>
|
|
<div class="main-content">
|
|
<div class="searchcon">
|
|
<el-button size="small" class="searchbtn" @click="clicksearchShow">{{ searchxianshitit }}</el-button>
|
|
<div v-show="isSearchShow" class="search">
|
|
<el-form ref="listQueryform" :inline="true" :model="listQuery" label-width="100px" class="tab-header">
|
|
<el-form-item label="厂商名称">
|
|
<el-select v-model="listQuery.params.manufacturerName" filterable class="filter-item" clearable
|
|
placeholder="请选择厂商名称">
|
|
<el-option v-for="item in YongHu" :key="item.sid" :label="item.manufacturerName"
|
|
:value="item.manufacturerName"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="厂商分类">
|
|
<el-select v-model="listQuery.params.supplierType" class="addinputw" placeholder="请选择厂商分类">
|
|
<el-option v-for="(item, index) in supplierType_list" :key="index.dictKey" :label="item.dictValue"
|
|
:value="item.dictKey"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="所属分公司">
|
|
<el-select v-model="listQuery.params.useOrgSid" class="filter-item" clearable placeholder="请选择所属分公司"
|
|
style="width: 300px;">
|
|
<el-option v-for="item in useOrg_list" :key="item.sid" :label="item.name"
|
|
:value="item.sid"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="厂商办公电话">
|
|
<el-input v-model="listQuery.params.manufacturerTelePhone" maxlength="130" placeholder=""
|
|
class="addinputw" clearable/>
|
|
</el-form-item>
|
|
<el-form-item label="联系人">
|
|
<el-input v-model="listQuery.params.contactName" maxlength="125" placeholder="" class="addinputw"
|
|
clearable/>
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
<div class="btn" style="text-align: center;">
|
|
<el-button type="primary" @click="handleFilter">查询</el-button>
|
|
<el-button type="primary" @click="handleReset">重置</el-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="listtop">
|
|
<div class="tit">厂商信息列表</div>
|
|
<!-- 翻页分页 -->
|
|
<pageye v-show="total>0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size"
|
|
class="pagination" @pagination="getList"/>
|
|
</div>
|
|
<div>
|
|
<el-table :key="tableKey" v-loading="listLoading" :data="list" border fit highlight-current-row
|
|
style="width: 100%;" @selection-change="handleSelectionChange">
|
|
<el-table-column type="selection" align="center" width="50"/>
|
|
<el-table-column label="序号" fixed type="index" width="80" :index="indexMethod" align="center"/>
|
|
<el-table-column label="操作" fixed align="center" width="90px" class-name="small-padding fixed-width">
|
|
<template slot-scope="{row}">
|
|
<el-button size="mini" type="primary" @click="handleEdit(row)">编辑</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="jc" label="厂商名称" width="180" align="center">
|
|
<template slot-scope="scope">
|
|
<span class="bluezi" @click="handleCheck(scope.row)">{{ scope.row.manufacturerName }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="厂商分类" width="110" align="center"> <!-- ? -->
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.supplierTypeValue }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="厂商通讯地址" width="" align="left">
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.manufacturerAddress }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="厂商办公电话" width="180" align="center">
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.manufacturerTelePhone }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="联系人姓名" width="120" align="center">
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.contactName }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="联系人手机号码" width="140" align="center">
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.contactMobile }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="所属分公司" width="160" align="center"> <!-- ? -->
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.createOrgName }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
<div class="pages">
|
|
<!-- 翻页 -->
|
|
<pagination v-show="total>0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size"
|
|
class="pagination" @pagination="getList"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<changshangguanli-add v-show="viewState == 2 || viewState == 3" ref="divadd" @doback="resetState"
|
|
@reloadlist="handleFilter" />
|
|
<changshanglook v-show="viewState == 4" ref="divinfo" @doback="resetState" />
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {mapGetters} from 'vuex'
|
|
import {basefinbankExportExcel, deleteBySids, getNamesDownes, pagerList} from '@/api/jichuxinxi/basemanufacturer' //接口
|
|
import {setXiu} from '@/utils/baocun' //本地储存
|
|
import {typeValues} from '@/api/jichuxinxi/dictcommons' //数据字典的接口
|
|
// import { getFileType, parseDate, parseTime, ConvertMenuState } from "@/utils";
|
|
// import { findButtonByUserId } from '@/api/sys/permission'
|
|
import Pagination from '@/components/pagination'
|
|
import pageye from '@/components/pagination/pageye'
|
|
import ChangshangguanliAdd from "@/views/changshang/changshangguanli/changshangguanliAdd.vue";
|
|
import changshanglook from "@/views/changshang/changshangguanli/changshanglook";
|
|
import ButtonBar from "@/components/ButtonBar";
|
|
import {getListOrg} from "@/api/jichuxinxi/brandManagement";
|
|
|
|
export default {
|
|
name: 'changshangguanli',
|
|
components: {
|
|
ButtonBar,
|
|
ChangshangguanliAdd,
|
|
changshanglook,
|
|
Pagination,
|
|
pageye
|
|
},
|
|
directives: {
|
|
drag: {
|
|
// 指令的定义
|
|
bind: function (el) {
|
|
const odiv = el // 获取当前元素
|
|
el.onmousedown = (e) => {
|
|
// 算出鼠标相对元素的位置
|
|
const disX = e.clientX - odiv.offsetLeft
|
|
const disY = e.clientY - odiv.offsetTop
|
|
let left = ''
|
|
let top = ''
|
|
document.onmousemove = (e) => {
|
|
// 用鼠标的位置减去鼠标相对元素的位置，得到元素的位置
|
|
left = e.clientX - disX
|
|
top = e.clientY - disY
|
|
// 绑定元素位置到positionX和positionY上面
|
|
// 移动当前元素
|
|
odiv.style.left = left + 'px'
|
|
odiv.style.top = top + 'px'
|
|
}
|
|
document.onmouseup = (e) => {
|
|
document.onmousemove = null
|
|
document.onmouseup = null
|
|
}
|
|
}
|
|
}
|
|
},
|
|
// 注册一个局部的自定义指令 v-focus
|
|
focus: {
|
|
// 指令的定义
|
|
inserted: function (el) {
|
|
// 聚焦元素
|
|
el.querySelector('input').focus()
|
|
},
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
btndisabled: false,
|
|
btnList: [
|
|
{
|
|
type: 'primary',
|
|
size: 'small',
|
|
icon: 'plus',
|
|
btnKey: 'toAdd',
|
|
btnLabel: '新增'
|
|
},
|
|
{
|
|
type: 'danger',
|
|
size: 'small',
|
|
icon: 'del',
|
|
btnKey: 'doDel',
|
|
btnLabel: '删除'
|
|
},
|
|
{
|
|
type: 'success',
|
|
size: 'small',
|
|
icon: 'export',
|
|
btnKey: 'build',
|
|
btnLabel: '导出'
|
|
},
|
|
{
|
|
type: 'info',
|
|
size: 'small',
|
|
icon: 'cross',
|
|
btnKey: 'doClose',
|
|
btnLabel: '关闭'
|
|
}
|
|
],
|
|
YongHu: [],
|
|
viewState: 1,
|
|
isSearchShow: false,
|
|
searchxianshitit: '显示查询条件',
|
|
sids: [],
|
|
// 查询 -----------
|
|
tableKey: 0,
|
|
list: [],
|
|
total: 1,
|
|
// FormLoading: false,
|
|
listLoading: false,
|
|
listQuery: {
|
|
params: {
|
|
manufacturerName: '',
|
|
supplierType: '',
|
|
useOrgSid: '',
|
|
manufacturerTelePhone: '',
|
|
contactName: '',
|
|
},
|
|
current: 1,
|
|
size: 20
|
|
},
|
|
xuanzeshuju: {},
|
|
// selectDate: undefined,
|
|
temp: {}, // 添加和修改
|
|
templook: {}, // 查看实体
|
|
textMap: {
|
|
update: '修改',
|
|
create: '新增'
|
|
},
|
|
dialogFormVisible: false, // 添加修改对话框状态
|
|
dialogFormShowVisible: false, // 查看对话框默认关闭状态
|
|
dialogStatus: '', // 对话框状态
|
|
supplyType: 'supplyType',
|
|
supplierType_list: [],
|
|
useOrg_list: [],
|
|
typeOptions: [],
|
|
tureArrys: [{
|
|
value: 1,
|
|
label: '是'
|
|
},
|
|
{
|
|
value: 0,
|
|
label: '否'
|
|
}
|
|
],
|
|
fenzuOptions: [{
|
|
value: '1',
|
|
label: '单位'
|
|
},
|
|
{
|
|
value: '2',
|
|
label: '个人'
|
|
}
|
|
],
|
|
tiaojian: '',
|
|
rules: {}
|
|
// ------------------------------------
|
|
}
|
|
},
|
|
// computed: {
|
|
// ...mapGetters([
|
|
// 'id',
|
|
// 'roles',
|
|
// 'rolesIds',
|
|
// 'departmentId',
|
|
// 'departmentCode'
|
|
// ])
|
|
// },
|
|
mounted() {
|
|
this.$refs["btnbar"].setButtonList(this.btnList)
|
|
},
|
|
created() {
|
|
// 初始化变量
|
|
this.init()
|
|
// 加载列表
|
|
this.getList()
|
|
this.factoryMill()
|
|
this.getType()
|
|
},
|
|
watch: {
|
|
listQuery: function (n, o) {
|
|
}
|
|
},
|
|
methods: {
|
|
resetState() {
|
|
this.viewState = 1
|
|
},
|
|
btnHandle(btnKey) {
|
|
console.log('XXXXXXXXXXXXXXX ' + btnKey)
|
|
switch (btnKey) {
|
|
case 'toAdd':
|
|
this.toAdd()
|
|
break
|
|
case 'doDel':
|
|
this.doDel()
|
|
break
|
|
case 'doExport':
|
|
this.doExport()
|
|
break
|
|
case 'doClose':
|
|
this.doClose()
|
|
break
|
|
default:
|
|
break
|
|
}
|
|
},
|
|
// 搜索条件效果
|
|
clicksearchShow() {
|
|
this.isSearchShow = !this.isSearchShow
|
|
if (this.isSearchShow) {
|
|
this.searchxianshitit = '隐藏查询条件'
|
|
} else {
|
|
this.searchxianshitit = '显示查询条件'
|
|
}
|
|
},
|
|
init() {
|
|
this.searchData()
|
|
},
|
|
searchData() {
|
|
getNamesDownes({
|
|
name: this.listQuery.manufacturerName
|
|
}).then((res) => {
|
|
// console.log('88888888888', res)
|
|
if (res.code === '200') {
|
|
this.YongHu = res.data
|
|
console.log('厂商名称列表', this.YongHu)
|
|
}
|
|
})
|
|
},
|
|
|
|
getType() {
|
|
typeValues({
|
|
type: 'supplierType'
|
|
}).then((res) => {
|
|
if (res.code === '200') {
|
|
this.supplierType_list = res.data
|
|
console.log('厂商分类', this.supplierType_list)
|
|
}
|
|
})
|
|
// 查询所有分公司
|
|
getListOrg().then((res) => {
|
|
if (res.success) {
|
|
this.useOrg_list = res.data
|
|
}
|
|
})
|
|
|
|
},
|
|
// 序号
|
|
indexMethod(index) {
|
|
var pagestart = (this.listQuery.current - 1) * this.listQuery.size
|
|
var pageindex = index + 1 + pagestart
|
|
return pageindex
|
|
},
|
|
// 查询列表信息
|
|
getList() {
|
|
this.listLoading = true
|
|
pagerList(this.listQuery).then((response) => {
|
|
// console.log('列表查询结果：', response)
|
|
this.listLoading = false
|
|
if (
|
|
response.code === '200' &&
|
|
response.data &&
|
|
response.data.total > 0
|
|
) {
|
|
this.list = response.data.records
|
|
this.total = response.data.total
|
|
} else {
|
|
this.list = []
|
|
this.total = 0
|
|
}
|
|
})
|
|
},
|
|
// 查询按钮
|
|
handleFilter() {
|
|
this.listQuery.current = 1
|
|
this.getList()
|
|
this.searchData()
|
|
},
|
|
handleReset() {
|
|
this.listQuery = {
|
|
params: {
|
|
manufacturerName: '',
|
|
supplierType: '',
|
|
useOrgSid: '',
|
|
manufacturerTelePhone: '',
|
|
contactName: '',
|
|
},
|
|
current: 1,
|
|
size: 20
|
|
},
|
|
// this.listQuery = {
|
|
// supplierType:'',
|
|
// useOrgSid:'',
|
|
// supplyType: '',
|
|
// manufacturerName: '',
|
|
// current: 1,
|
|
// size: 20
|
|
// }
|
|
this.getList()
|
|
},
|
|
// ----------------------------------方法--------------------
|
|
// 添加前数据初始化
|
|
resetTemp() {
|
|
this.temp = {
|
|
manufacturerName: '', // false string
|
|
manufacturerAddress: '', // false string
|
|
manufacturerTelePhone: '', // false string
|
|
contactName: '', //
|
|
contactMobile: '', //
|
|
}
|
|
},
|
|
// 打开添加对话框
|
|
toAdd() {
|
|
this.viewState = 2
|
|
this.$refs['divadd'].showAdd()
|
|
/* if (this.$store.state.counter === 0) {
|
|
this.$store.state.counter
|
|
// console.log('打开添加对话框', this.$store.state.counter)
|
|
this.$router.push({
|
|
path: '/changshang/changshangguanliAdd/0',
|
|
})
|
|
} else {
|
|
this.$store.state.counter = 0
|
|
this.$router.push({
|
|
path: '/changshang/changshangguanliAdd/0',
|
|
})
|
|
}*/
|
|
},
|
|
// 提交添加数据
|
|
factoryMill() {
|
|
typeValues({
|
|
type: this.supplyType
|
|
}).then((response) => {
|
|
if (response.code === '200') {
|
|
this.typeOptions = response.data
|
|
}
|
|
})
|
|
},
|
|
//勾选/
|
|
handleSelectionChange(row) {
|
|
const aa = []
|
|
const cc = []
|
|
row.forEach((element) => {
|
|
aa.push(element.sid)
|
|
cc.push(element.manufacturerName, element.sid, element.supplyType)
|
|
})
|
|
this.sids = aa
|
|
this.tiaojian = this.sids.toString()
|
|
this.xuanzeshuju = cc
|
|
setXiu(this.sids)
|
|
},
|
|
// 根据本行ID删除数据
|
|
doDel() {
|
|
if (this.sids.length > 0) {
|
|
const _this = this
|
|
const tip = '请确认是否删除所选 ' + this.sids.length + ' 条记录?'
|
|
this.$confirm(tip, '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
})
|
|
.then(() => {
|
|
const loading = this.$loading({
|
|
lock: true,
|
|
text: 'Loading',
|
|
spinner: 'el-icon-loading',
|
|
background: 'rgba(0, 0, 0, 0.7)'
|
|
})
|
|
deleteBySids(this.sids)
|
|
.then(resp => {
|
|
if (resp.success && resp.code == '200') {
|
|
loading.close()
|
|
_this.$message({type: 'success', message: resp.msg, showClose: true})
|
|
_this.getList()
|
|
} else {
|
|
loading.close()
|
|
// _this.$message({ type: 'error', message: resp.msg, showClose: true })
|
|
}
|
|
})
|
|
.catch(e => {
|
|
loading.close()
|
|
})
|
|
})
|
|
.catch(() => {
|
|
})
|
|
} else {
|
|
this.$message({type: 'error', message: '没有选择厂商!!', showClose: true})
|
|
return
|
|
}
|
|
|
|
},
|
|
handleEdit(row) {
|
|
this.viewState = 3
|
|
this.$refs['divadd'].showEdit(row.sid)
|
|
},
|
|
// 打开查看
|
|
handleCheck(row) {
|
|
this.viewState = 4
|
|
this.$refs['divinfo'].showInfo(row.sid)
|
|
},
|
|
// 导出
|
|
doExport() {
|
|
basefinbankExportExcel(this.sids).then((res) => {
|
|
const blob = new Blob([res], {
|
|
type: 'application/vnd.ms-excel'
|
|
})
|
|
const objectUrl = URL.createObjectURL(blob)
|
|
window.location.href = objectUrl
|
|
this.$notify({
|
|
title: '提示',
|
|
message: '导出成功',
|
|
type: 'success',
|
|
duration: 2000,
|
|
})
|
|
})
|
|
},
|
|
doClose() {
|
|
this.$store.dispatch('tagsView/delView', this.$route);
|
|
this.$router.go(-1)
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
<style scoped>
|
|
/deep/ .el-collapse {
|
|
border-top: 0px solid #e6ebf5;
|
|
border-bottom: 0px solid #e6ebf5;
|
|
}
|
|
|
|
/deep/ .el-collapse-item__content {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
/deep/ .el-collapse-item__wrap {
|
|
border-bottom: 0px solid #ebeef5;
|
|
}
|
|
|
|
/deep/ .el-collapse-item__header {
|
|
border-bottom: 0px solid #e6ebf5;
|
|
}
|
|
|
|
.btn {
|
|
padding: 15px 0 15px 0;
|
|
border: 1px solid #e0e3eb;
|
|
}
|
|
|
|
.tab-header {
|
|
background-color: #edf1f7;
|
|
padding: 8px 20px;
|
|
margin-bottom: 0 !important;
|
|
}
|
|
|
|
.tab-header /deep/ .el-form-item {
|
|
margin-bottom: 10px;
|
|
}
|
|
</style>
|
|
|