|
@@ -0,0 +1,223 @@
|
|
|
|
+<template>
|
|
|
|
+ <a-card :bordered="false">
|
|
|
|
+ <!-- 搜索框 -->
|
|
|
|
+ <div class="table-page-search-wrapper" style="margin-bottom: 15px;">
|
|
|
|
+ <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
|
|
|
|
+ <a-row :gutter="48">
|
|
|
|
+ <a-col :md="6" :sm="24">
|
|
|
|
+ <a-form-item label="供应商名称"><a-input allowClear v-model.trim="searchData.name" :maxLength="30" placeholder="请输入" id="OperateJournal-name"/></a-form-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ <a-col :md="6" :sm="24">
|
|
|
|
+ <a-button style="margin-right: 10px;" type="primary" @click="$refs.table.refresh(true)" id="OperateJournal-refreshTable">查询</a-button>
|
|
|
|
+ <a-button type="" @click="resetForm" id="OperateJournal-resetForm">重置</a-button>
|
|
|
|
+ </a-col>
|
|
|
|
+ </a-row>
|
|
|
|
+ </a-form>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="add"><a-button type="primary" icon="plus" class="addBtn" @click="showModal" id="bannerSetting-showModal">新增</a-button></div>
|
|
|
|
+ <!-- table列表 -->
|
|
|
|
+ <s-table
|
|
|
|
+ ref="table"
|
|
|
|
+ size="default"
|
|
|
|
+ :rowKey="(record) => record.id"
|
|
|
|
+ :columns="columns"
|
|
|
|
+ :data="loadData"
|
|
|
|
+ bordered>
|
|
|
|
+ <span slot="action" slot-scope="text, record">
|
|
|
|
+ <a-icon
|
|
|
|
+ v-if="record.state==0"
|
|
|
|
+ type="edit"
|
|
|
|
+ id="bannerSetting-handleEdit"
|
|
|
|
+ title="编辑"
|
|
|
|
+ class="actionBtn icon-blues"
|
|
|
|
+ @click="handleEdit(record)" />
|
|
|
|
+ <span v-if="record.state==1">--</span>
|
|
|
|
+ </span>
|
|
|
|
+ <span slot="state" slot-scope="text, record">
|
|
|
|
+ <a-switch
|
|
|
|
+ checkedChildren="启用"
|
|
|
|
+ unCheckedChildren="禁用"
|
|
|
|
+ id="bannerSetting-changeFlagHandle"
|
|
|
|
+ :checked="record.state == 1 ? true : false"
|
|
|
|
+ @change="changeFlagHandle(text, record)"
|
|
|
|
+ />
|
|
|
|
+ </span>
|
|
|
|
+ </s-table>
|
|
|
|
+ <!-- 新增编辑弹窗 -->
|
|
|
|
+ <add-partner-modal :itemId="itemId" :itemData="itemData" :openSupplierModal="openSupplierModal" @refresh="$refs.table.refresh(true)" @close="cancel"></add-partner-modal>
|
|
|
|
+ </a-card>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+import { Upload, STable, VSelect } from '@/components'
|
|
|
|
+import { getSupplierList, changeSupplierStatus } from '@/api/shopSetting.js'
|
|
|
|
+import addPartnerModal from './addPartnerModal.vue'
|
|
|
|
+export default {
|
|
|
|
+ components: {
|
|
|
|
+ STable,
|
|
|
|
+ Upload,
|
|
|
|
+ VSelect,
|
|
|
|
+ addPartnerModal
|
|
|
|
+ },
|
|
|
|
+ data () {
|
|
|
|
+ return {
|
|
|
|
+ searchData: { name: '' },
|
|
|
|
+ openSupplierModal: false, // 默认关闭弹窗
|
|
|
|
+ itemId: null, // 编辑行id
|
|
|
|
+ itemData: {}, // 编辑行数据
|
|
|
|
+ // 表头
|
|
|
|
+ columns: [
|
|
|
|
+ {
|
|
|
|
+ title: '序号',
|
|
|
|
+ dataIndex: 'no',
|
|
|
|
+ width: 60,
|
|
|
|
+ align: 'center'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '供应商名称',
|
|
|
|
+ width: 200,
|
|
|
|
+ dataIndex: 'name',
|
|
|
|
+ align: 'center'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '供应商简称',
|
|
|
|
+ width: 100,
|
|
|
|
+ dataIndex: 'simpleName',
|
|
|
|
+ align: 'center'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '联系人',
|
|
|
|
+ width: 100,
|
|
|
|
+ dataIndex: 'contactName',
|
|
|
|
+ align: 'center'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '手机号码',
|
|
|
|
+ width: 100,
|
|
|
|
+ dataIndex: 'contactPhone',
|
|
|
|
+ align: 'center',
|
|
|
|
+ scopedSlots: {
|
|
|
|
+ customRender: 'position'
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '状态',
|
|
|
|
+ width: 100,
|
|
|
|
+ dataIndex: 'state',
|
|
|
|
+ align: 'center',
|
|
|
|
+ scopedSlots: {
|
|
|
|
+ customRender: 'state'
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '备注',
|
|
|
|
+ width: 200,
|
|
|
|
+ dataIndex: 'remarks',
|
|
|
|
+ align: 'center',
|
|
|
|
+ customRender: (text) => {
|
|
|
|
+ return text || '--'
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '操作',
|
|
|
|
+ align: 'center',
|
|
|
|
+ width: 100,
|
|
|
|
+ scopedSlots: {
|
|
|
|
+ customRender: 'action'
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ ],
|
|
|
|
+ // 加载数据方法 必须为 Promise 对象
|
|
|
|
+ loadData: parameter => {
|
|
|
|
+ return getSupplierList(
|
|
|
|
+ Object.assign(parameter, this.searchData)
|
|
|
|
+ ).then(res => {
|
|
|
|
+ const no = (res.data.pageNo - 1) * res.data.pageSize
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ for (let i = 0; i < res.data.list.length; i++) {
|
|
|
|
+ const _item = res.data.list[i]
|
|
|
|
+ _item.no = no + i + 1
|
|
|
|
+ }
|
|
|
|
+ return res.data
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ formLayout: 'horizontal',
|
|
|
|
+ hideRequiredMark: false, // 是否显示必填的* 默认显示
|
|
|
|
+ form: this.$form.createForm(this),
|
|
|
|
+ formItemLayout: {
|
|
|
|
+ labelCol: {
|
|
|
|
+ span: 6
|
|
|
|
+ },
|
|
|
|
+ wrapperCol: {
|
|
|
|
+ span: 14
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ showModal () {
|
|
|
|
+ this.itemId = null
|
|
|
|
+ this.itemData = {}
|
|
|
|
+ this.openSupplierModal = true
|
|
|
|
+ },
|
|
|
|
+ // 编辑
|
|
|
|
+ handleEdit (record) {
|
|
|
|
+ this.itemId = record.id
|
|
|
|
+ this.itemData = record
|
|
|
|
+ console.log(this.itemId, '-------编辑')
|
|
|
|
+ this.openSupplierModal = true
|
|
|
|
+ },
|
|
|
|
+ cancel () {
|
|
|
|
+ this.itemId = null
|
|
|
|
+ this.openSupplierModal = false
|
|
|
|
+ },
|
|
|
|
+ // 重置
|
|
|
|
+ resetForm () {
|
|
|
|
+ this.searchData.name = ''
|
|
|
|
+ this.$refs.table.refresh(true)
|
|
|
|
+ },
|
|
|
|
+ // 更改启用禁用状态
|
|
|
|
+ changeFlagHandle (text, record) {
|
|
|
|
+ console.log(text)
|
|
|
|
+ const _this = this
|
|
|
|
+ const _data = {
|
|
|
|
+ id: record.id,
|
|
|
|
+ flag: record.state == 1 ? '0' : '1'
|
|
|
|
+ }
|
|
|
|
+ if (record.state == 1) {
|
|
|
|
+ this.$confirm({
|
|
|
|
+ title: '提示',
|
|
|
|
+ centered: true,
|
|
|
|
+ content: '确定禁用该供货商吗?',
|
|
|
|
+ okText: '确定',
|
|
|
|
+ cancelText: '取消',
|
|
|
|
+ onOk () {
|
|
|
|
+ changeSupplierStatus(_data).then(res => {
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ _this.$message.success(res.message)
|
|
|
|
+ _this.$refs.table.refresh()
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ changeSupplierStatus(_data).then(res => {
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ _this.$message.success(res.message)
|
|
|
|
+ _this.$refs.table.refresh()
|
|
|
|
+ } else {
|
|
|
|
+ record.state = !record.state
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style scoped>
|
|
|
|
+.addBtn {
|
|
|
|
+ margin-bottom: 20px;
|
|
|
|
+}
|
|
|
|
+</style>
|