|
@@ -1,242 +1,225 @@
|
|
|
<template>
|
|
|
- <a-card :bordered="false" class="network-table-page-search-wrapper">
|
|
|
- <div class="network-searchForm">
|
|
|
- <a-form layout="inline" :form="form" ref="form" v-bind="formItemLayout" @keyup.enter.native="$refs.table.refresh(true)">
|
|
|
- <a-row :gutter="48">
|
|
|
- <a-col :span="6">
|
|
|
- <a-form-item label="箱体类型名称" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
|
|
|
- <a-input id="boxSetting-name" allowClear :maxLength="30" v-model="queryParam.name" placeholder="请输入箱体类型名称" />
|
|
|
- </a-form-item>
|
|
|
- </a-col>
|
|
|
- <a-col :span="6">
|
|
|
- <a-button class="handle-btn serach-btn" id="boxSetting-btn-serach" type="primary" @click="$refs.table.refresh(true)">查询</a-button>
|
|
|
- <a-button class="handle-btn" type="" id="boxSetting-btn-reset" @click="handleReset">重置</a-button>
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- </a-form>
|
|
|
- </div>
|
|
|
- <div class="table-operator">
|
|
|
- <a-button type="primary" icon="plus" @click="openModal" id="boxSetting-add" v-hasPermission="'B_boxSetting_add'">新增</a-button>
|
|
|
- </div>
|
|
|
- <s-table
|
|
|
- ref="table"
|
|
|
- size="default"
|
|
|
- :rowKey="(record) => record.id"
|
|
|
- :columns="columns"
|
|
|
- :data="loadData"
|
|
|
- bordered>
|
|
|
- <!-- 操作 -->
|
|
|
- <template slot="action" slot-scope="text, record">
|
|
|
- <a-icon
|
|
|
- type="edit"
|
|
|
- id="boxSetting-edit"
|
|
|
- title="编辑"
|
|
|
- class="actionBtn icon-blues"
|
|
|
- @click="handleEdit(record)"
|
|
|
- v-hasPermission="'B_boxSetting_edit'" />
|
|
|
- <a-icon
|
|
|
- type="delete"
|
|
|
- id="boxSetting-del"
|
|
|
- title="删除"
|
|
|
- class="actionBtn icon-red"
|
|
|
- @click="delect(record)"
|
|
|
- v-if="$hasPermissions('B_boxSetting_del') && !record.isEnable"/>
|
|
|
- <span v-if="!$hasPermissions('B_boxSetting_edit') && (!$hasPermissions('B_boxSetting_del') && !record.isEnable)">--</span>
|
|
|
- </template>
|
|
|
- </s-table>
|
|
|
- <!-- 新增/编辑 弹窗 -->
|
|
|
- <add-box-modal :visible="openBoxModal" :id="itemId" @refresh="refreshTable" @close="openBoxModal = false"></add-box-modal>
|
|
|
- </a-card>
|
|
|
+ <a-card :bordered="false" class="network-table-page-search-wrapper">
|
|
|
+ <div class="network-searchForm">
|
|
|
+ <a-form layout="inline" :form="form" ref="form" v-bind="formItemLayout" @keyup.enter.native="$refs.table.refresh(true)">
|
|
|
+ <a-row :gutter="48">
|
|
|
+ <a-col :span="6">
|
|
|
+ <a-form-item label="箱体类型名称" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
|
|
|
+ <a-input id="boxSetting-name" allowClear :maxLength="30" v-model="queryParam.name" placeholder="请输入箱体类型名称" />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="6">
|
|
|
+ <a-button class="handle-btn serach-btn" id="boxSetting-btn-serach" type="primary" @click="$refs.table.refresh(true)">查询</a-button>
|
|
|
+ <a-button class="handle-btn" type="" id="boxSetting-btn-reset" @click="handleReset">重置</a-button>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-form>
|
|
|
+ </div>
|
|
|
+ <div class="table-operator">
|
|
|
+ <a-button type="primary" icon="plus" @click="openModal" id="boxSetting-add" v-hasPermission="'B_boxSetting_add'">新增</a-button>
|
|
|
+ </div>
|
|
|
+ <s-table ref="table" size="default" :rowKey="(record) => record.id" :columns="columns" :data="loadData" bordered>
|
|
|
+ <!-- 操作 -->
|
|
|
+ <template slot="action" slot-scope="text, record">
|
|
|
+ <a-icon type="edit" id="boxSetting-edit" title="编辑" class="actionBtn icon-blues" @click="handleEdit(record)"
|
|
|
+ v-hasPermission="'B_boxSetting_edit'" />
|
|
|
+ <a-icon type="delete" id="boxSetting-del" title="删除" class="actionBtn icon-red" @click="delect(record)" v-if="$hasPermissions('B_boxSetting_del') && !record.isEnable" />
|
|
|
+ <span v-if="!$hasPermissions('B_boxSetting_edit') && (!$hasPermissions('B_boxSetting_del') && !record.isEnable)">--</span>
|
|
|
+ </template>
|
|
|
+ </s-table>
|
|
|
+ <!-- 新增/编辑 弹窗 -->
|
|
|
+ <add-box-modal :visible="openBoxModal" :id="itemId" @refresh="refreshTable" @close="openBoxModal = false"></add-box-modal>
|
|
|
+ </a-card>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import {
|
|
|
- STable,
|
|
|
- VSelect
|
|
|
-} from '@/components'
|
|
|
-import AddBoxModal from './AddBoxModal.vue'
|
|
|
-import {
|
|
|
- getBoxList,
|
|
|
- deleteBoxSetting
|
|
|
-} from '@/api/boxSetting.js'
|
|
|
-export default {
|
|
|
- name: 'Equipment',
|
|
|
- components: {
|
|
|
- STable,
|
|
|
- VSelect,
|
|
|
- AddBoxModal
|
|
|
- },
|
|
|
- data () {
|
|
|
- return {
|
|
|
- form: this.$form.createForm(this),
|
|
|
- formItemLayout: {
|
|
|
- labelCol: {
|
|
|
- span: 7
|
|
|
- },
|
|
|
- wrapperCol: {
|
|
|
- span: 17
|
|
|
- }
|
|
|
- },
|
|
|
- // 查询参数
|
|
|
- queryParam: {
|
|
|
- name: '' // 箱体类型
|
|
|
- },
|
|
|
- openBoxModal: false, // 新增/编辑弹窗
|
|
|
- itemId: '', // 箱体id
|
|
|
- // 表头
|
|
|
- columns: [{
|
|
|
- title: '序号',
|
|
|
- dataIndex: 'no',
|
|
|
- width: 70,
|
|
|
- align: 'center'
|
|
|
- },
|
|
|
- {
|
|
|
- title: '创建时间',
|
|
|
- dataIndex: 'createDate',
|
|
|
- width: 180,
|
|
|
- align: 'center'
|
|
|
- },
|
|
|
- {
|
|
|
- title: '箱体类型名称',
|
|
|
- dataIndex: 'name',
|
|
|
- width: 200,
|
|
|
- align: 'center'
|
|
|
- },
|
|
|
- {
|
|
|
- title: '内置箱体数量(个)',
|
|
|
- dataIndex: 'boxNum',
|
|
|
- width: 80,
|
|
|
- align: 'center'
|
|
|
- },
|
|
|
- {
|
|
|
- title: '内置箱体投放限重(g)/ 对应资源分类',
|
|
|
- children: [{
|
|
|
- title: '1号箱',
|
|
|
- dataIndex: 'one',
|
|
|
- width: 120,
|
|
|
- align: 'center',
|
|
|
- customRender: (record, text) => {
|
|
|
- return record ? (record.maxWeight ? (record.maxWeight + '/' + record.rubbishTypeDictValue) : '--') : '--'
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '2号箱',
|
|
|
- dataIndex: 'two',
|
|
|
- width: 120,
|
|
|
- align: 'center',
|
|
|
- customRender: (record, text) => {
|
|
|
- return record ? (record.maxWeight ? (record.maxWeight + '/' + record.rubbishTypeDictValue) : '--') : '--'
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '3号箱',
|
|
|
- dataIndex: 'three',
|
|
|
- width: 120,
|
|
|
- align: 'center',
|
|
|
- customRender: (record, text) => {
|
|
|
- return record ? (record.maxWeight ? (record.maxWeight + '/' + record.rubbishTypeDictValue) : '--') : '--'
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '4号箱',
|
|
|
- dataIndex: 'four',
|
|
|
- width: 120,
|
|
|
- align: 'center',
|
|
|
- customRender: (record, text) => {
|
|
|
- return record ? (record.maxWeight ? (record.maxWeight + '/' + record.rubbishTypeDictValue) : '--') : '--'
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- title: '5号箱',
|
|
|
- dataIndex: 'five',
|
|
|
- width: 120,
|
|
|
- align: 'center',
|
|
|
- customRender: (record, text) => {
|
|
|
- return record ? (record.maxWeight ? (record.maxWeight + '/' + record.rubbishTypeDictValue) : '--') : '--'
|
|
|
- }
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- title: '操作',
|
|
|
- scopedSlots: {
|
|
|
- customRender: 'action'
|
|
|
- },
|
|
|
- width: 120,
|
|
|
- align: 'center'
|
|
|
- }
|
|
|
- ],
|
|
|
- // 加载数据方法 必须为 Promise 对象
|
|
|
- loadData: parameter => {
|
|
|
- return getBoxList(Object.assign(parameter, this.queryParam)).then(res => {
|
|
|
- if (res.status == 200) {
|
|
|
- const no = (res.data.pageNo - 1) * res.data.pageSize
|
|
|
- for (let i = 0; i < res.data.list.length; i++) {
|
|
|
- const _item = res.data.list[i]
|
|
|
- _item.no = no + i + 1
|
|
|
- }
|
|
|
- return res.data
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
+ import {
|
|
|
+ STable,
|
|
|
+ VSelect
|
|
|
+ } from '@/components'
|
|
|
+ import AddBoxModal from './AddBoxModal.vue'
|
|
|
+ import {
|
|
|
+ getBoxList,
|
|
|
+ deleteBoxSetting
|
|
|
+ } from '@/api/boxSetting.js'
|
|
|
+ export default {
|
|
|
+ name: 'Equipment',
|
|
|
+ components: {
|
|
|
+ STable,
|
|
|
+ VSelect,
|
|
|
+ AddBoxModal
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ form: this.$form.createForm(this),
|
|
|
+ formItemLayout: {
|
|
|
+ labelCol: {
|
|
|
+ span: 7
|
|
|
+ },
|
|
|
+ wrapperCol: {
|
|
|
+ span: 17
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 查询参数
|
|
|
+ queryParam: {
|
|
|
+ name: '' // 箱体类型
|
|
|
+ },
|
|
|
+ openBoxModal: false, // 新增/编辑弹窗
|
|
|
+ itemId: '', // 箱体id
|
|
|
+ // 表头
|
|
|
+ columns: [{
|
|
|
+ title: '序号',
|
|
|
+ dataIndex: 'no',
|
|
|
+ width: 70,
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '创建时间',
|
|
|
+ dataIndex: 'createDate',
|
|
|
+ width: 180,
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '箱体类型名称',
|
|
|
+ dataIndex: 'name',
|
|
|
+ width: 200,
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '内置箱体数量(个)',
|
|
|
+ dataIndex: 'boxNum',
|
|
|
+ width: 80,
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '内置箱体投放限重(g)/ 对应资源分类',
|
|
|
+ children: [{
|
|
|
+ title: '1号箱',
|
|
|
+ dataIndex: 'one',
|
|
|
+ width: 120,
|
|
|
+ align: 'center',
|
|
|
+ customRender: (record, text) => {
|
|
|
+ return record ? (record.maxWeight ? (record.maxWeight + '/' + record.rubbishTypeDictValue) : '--') : '--'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '2号箱',
|
|
|
+ dataIndex: 'two',
|
|
|
+ width: 120,
|
|
|
+ align: 'center',
|
|
|
+ customRender: (record, text) => {
|
|
|
+ return record ? (record.maxWeight ? (record.maxWeight + '/' + record.rubbishTypeDictValue) : '--') : '--'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '3号箱',
|
|
|
+ dataIndex: 'three',
|
|
|
+ width: 120,
|
|
|
+ align: 'center',
|
|
|
+ customRender: (record, text) => {
|
|
|
+ return record ? (record.maxWeight ? (record.maxWeight + '/' + record.rubbishTypeDictValue) : '--') : '--'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '4号箱',
|
|
|
+ dataIndex: 'four',
|
|
|
+ width: 120,
|
|
|
+ align: 'center',
|
|
|
+ customRender: (record, text) => {
|
|
|
+ return record ? (record.maxWeight ? (record.maxWeight + '/' + record.rubbishTypeDictValue) : '--') : '--'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '5号箱',
|
|
|
+ dataIndex: 'five',
|
|
|
+ width: 120,
|
|
|
+ align: 'center',
|
|
|
+ customRender: (record, text) => {
|
|
|
+ return record ? (record.maxWeight ? (record.maxWeight + '/' + record.rubbishTypeDictValue) : '--') : '--'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '操作',
|
|
|
+ scopedSlots: {
|
|
|
+ customRender: 'action'
|
|
|
+ },
|
|
|
+ width: 120,
|
|
|
+ align: 'center'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ // 加载数据方法 必须为 Promise 对象
|
|
|
+ loadData: parameter => {
|
|
|
+ return getBoxList(Object.assign(parameter, this.queryParam)).then(res => {
|
|
|
+ if (res.status == 200) {
|
|
|
+ const no = (res.data.pageNo - 1) * res.data.pageSize
|
|
|
+ for (let i = 0; i < res.data.list.length; i++) {
|
|
|
+ const _item = res.data.list[i]
|
|
|
+ _item.no = no + i + 1
|
|
|
+ }
|
|
|
+ return res.data
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
|
|
|
- }
|
|
|
- },
|
|
|
- beforeRouteEnter (to, from, next) {
|
|
|
- next(vm => {
|
|
|
- vm.queryParam.name = ''
|
|
|
- })
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // 重置
|
|
|
- handleReset () {
|
|
|
- console.log('重置', this.queryParam)
|
|
|
- this.form.resetFields()
|
|
|
- this.queryParam.name = ''
|
|
|
- this.$refs.table.refresh(true)
|
|
|
- },
|
|
|
- // 新建
|
|
|
- openModal () {
|
|
|
- this.openBoxModal = true
|
|
|
- this.itemId = ''
|
|
|
- },
|
|
|
- // 编辑
|
|
|
- handleEdit (item) {
|
|
|
- this.openBoxModal = true
|
|
|
- this.itemId = item.id
|
|
|
- },
|
|
|
- // 新增/编辑 后刷新列表
|
|
|
- refreshTable () {
|
|
|
- if (this.itemId) {
|
|
|
- this.$refs.table.refresh()
|
|
|
- } else {
|
|
|
- this.$refs.table.refresh(true)
|
|
|
- }
|
|
|
- },
|
|
|
- // 删除
|
|
|
- delect (row) {
|
|
|
- const _this = this
|
|
|
- this.$confirm({
|
|
|
- title: '警告',
|
|
|
- centered: true,
|
|
|
- content: '删除后无法恢复,确认删除?',
|
|
|
- okText: '确定',
|
|
|
- cancelText: '取消',
|
|
|
- onOk () {
|
|
|
- deleteBoxSetting({
|
|
|
- id: row.id
|
|
|
- }).then(res => {
|
|
|
- console.log(res, 'res1111')
|
|
|
- if (res.status == 200) {
|
|
|
- _this.$message.success(res.message)
|
|
|
- _this.$refs.table.refresh()
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+ }
|
|
|
+ },
|
|
|
+ beforeRouteEnter(to, from, next) {
|
|
|
+ next(vm => {
|
|
|
+ vm.queryParam.name = ''
|
|
|
+ })
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 重置
|
|
|
+ handleReset() {
|
|
|
+ console.log('重置', this.queryParam)
|
|
|
+ this.form.resetFields()
|
|
|
+ this.queryParam.name = ''
|
|
|
+ this.$refs.table.refresh(true)
|
|
|
+ },
|
|
|
+ // 新建
|
|
|
+ openModal() {
|
|
|
+ this.openBoxModal = true
|
|
|
+ this.itemId = ''
|
|
|
+ },
|
|
|
+ // 编辑
|
|
|
+ handleEdit(item) {
|
|
|
+ this.openBoxModal = true
|
|
|
+ this.itemId = item.id
|
|
|
+ },
|
|
|
+ // 新增/编辑 后刷新列表
|
|
|
+ refreshTable() {
|
|
|
+ if (this.itemId) {
|
|
|
+ this.$refs.table.refresh()
|
|
|
+ } else {
|
|
|
+ this.$refs.table.refresh(true)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 删除
|
|
|
+ delect(row) {
|
|
|
+ const _this = this
|
|
|
+ this.$confirm({
|
|
|
+ title: '警告',
|
|
|
+ centered: true,
|
|
|
+ content: '删除后无法恢复,确认删除?',
|
|
|
+ okText: '确定',
|
|
|
+ cancelText: '取消',
|
|
|
+ onOk() {
|
|
|
+ deleteBoxSetting({
|
|
|
+ id: row.id
|
|
|
+ }).then(res => {
|
|
|
+ console.log(res, 'res1111')
|
|
|
+ if (res.status == 200) {
|
|
|
+ _this.$message.success(res.message)
|
|
|
+ _this.$refs.table.refresh()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
</script>
|
|
|
<style lang="less" scoped>
|
|
|
.network-table-page-search-wrapper {
|