gas-cylinder/src/views/system/transport.vue

<template>
  <!-- 运输企业管理 -->
  <div>
    <actionBar menuTitle="运输企业管理" :operateList="operateList" :formList="formList" :ruleForm="searchRuleForm"
      @openModel="openModel" @searchProtocol="searchProtocol"></actionBar>
    <treeTable :suspension="true" :treeData="treeData" :treeDataList="treeDataList" @buttonData="buttonData">
    </treeTable>
    <el-dialog :title="shopTitle" :visible.sync="shopDialogVisible" width="60%" :close-on-click-modal="false"
      @close="closeDialog">
      <forms ref="childRules" :formNewList="formRuleList" :ruleForm="ruleForm" :operationType="operationType"
        labelWidth="130px"></forms>
      <span slot="footer" class="dialog-footer" v-if="operationType != 'logs'">
        <el-button plain @click="shopDialogVisible = false">取 消</el-button>
        <el-button type="primary" :loading="confirmLoading" @click="handleAdd">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
  import {
    getTruckList,
    getEnterprise,
    addEnterprise,
    putEnterprise,
    enterEnterprise,
    delEnterprise
  } from '@/api/transport'
  import actionBar from '@/components/actionBar'
  import treeTable from '@/components/treeTable'
  import forms from '@/components/forms'
  import {
    rules,
    formRules
  } from "./transportation.js";
  export default {
    components: {
      actionBar,
      treeTable,
      forms
    },
    data() {
      return {
        formList: [{
          type: 'input',
          label: '运输企业名称',
          field: 'name',
          placeholder: '请输入运输企业名称查找',
        }],
        searchRuleForm: {
          name: '',
        },
        operateList: [{
          type: 'add',
          title: '添加一级运输企业',
          icon: 'el-icon-plus',
        }],
        treeData: rules(),
        treeDataList: [],
        shopDialogVisible: false,
        shopTitle: '添加',
        formRuleList: [],
        ruleForm: {},
        parentId: 0,
        operationType: '',
        enterpriseId: null,
        confirmLoading: false,
        searchValue: {},
      }
    },
    mounted() {
      const dataList = formRules();
      this.formRuleList = dataList;
      this.getList()
    },
    methods: {
      // 搜索
      searchProtocol(value) {
        this.searchValue = value
        this.treeDataList = []
        this.getList()
      },
      getList() {
        getTruckList(this.searchValue).then(res => {
          if (res.code == 200) {
            this.treeDataList = res.data
          }
        })
      },
      openModel(type) {
        this.operationType = type
        if (type == 'add') {
          this.shopTitle = '添加'
        }
        this.shopDialogVisible = true
      },
      // 弹窗表单添加
      handleAdd() {
        if (this.operationType == 'add') {
          let flag = this.$refs['childRules'].validateForm();
          if (flag) {
            this.confirmLoading = true
            var params = {
              ...this.ruleForm
            }
            params.city = this.ruleForm.cityRegion[0]
            params.area = this.ruleForm.cityRegion[1]
            delete params.cityRegion;
            addEnterprise({
              parentId: this.parentId,
              provTruckEnterprise: params
            }).then(res => {
              if (res.code == 200) {
                this.$message({
                  message: '操作成功',
                  type: 'success'
                });
                this.getList()
              }
              this.confirmLoading = false
              this.shopDialogVisible = false
            }).catch(() => {
              this.confirmLoading = false
            })
          } else {
            this.$message.error('表单信息不完整，请继续填写完整');
          }
        } else if (this.operationType == 'edit') {
          this.editItem()
        }
      },
      editItem() {
        let flag = this.$refs['childRules'].validateForm();
        if (flag) {
          this.confirmLoading = true
          var params = {
            ...this.ruleForm
          }
          params.city = this.ruleForm.cityRegion[0]
          params.area = this.ruleForm.cityRegion[1]
          delete params.cityRegion;
          putEnterprise({
            id: this.enterpriseId,
            provTruckEnterprise: params
          }).then(res => {
            if (res.code == 200) {
              this.$message({
                message: '操作成功',
                type: 'success'
              });
              this.getList()
            }
            this.shopDialogVisible = false
            this.confirmLoading = false
          }).catch(() => {
            this.confirmLoading = false
          })
        } else {
          this.$message.error('表单信息不完整，请继续填写完整');
        }
      },
      // 进入
      enterInto(id) {
        enterEnterprise({
          id: id,
        }).then(res => {
          if (res.code == 200) {
            this.$message({
              message: res.msg,
              type: 'success'
            });
            // this.getList()
          }
        })
      },
      // 删除
      deleteItem(id) {
        this.$confirm('此操作将永久删除该企业, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          delEnterprise({
            id: id,
          }).then(res => {
            if (res.code == 200) {
              this.$message({
                message: '操作成功',
                type: 'success'
              });
              this.getList()
            }
          })
        }).catch(() => {});
      },
      // 表格操作按钮
      buttonData(row, type) {
        this.enterpriseId = row.id
        this.operationType = type
        if (type == 'add') {
          this.shopTitle = '添加'
        } else if (type == 'edit') {
          this.shopTitle = '修改'
        } else if (type == 'logs') {
          this.formRuleList.forEach((item, index) => {
            item.disabled = true
          })
          this.shopTitle = '详情'
        }
        if (type == 'del') {
          if (row.children && row.children.length > 0) {
            this.$message({
              message: '请先删除子级企业',
              type: 'warning'
            });
          } else {
            this.deleteItem(row.id)
          }
        } else if (type == 'edit' || type == 'logs') {
          if (row.provTruckEnterprise) {
            this.ruleForm = JSON.parse(JSON.stringify(row.provTruckEnterprise))
            var arr = []
            arr.push(row.provTruckEnterprise.city)
            arr.push(row.provTruckEnterprise.area)
            this.ruleForm.cityRegion = arr
          }
          this.shopDialogVisible = true
        } else if (type == 'add') {
          this.parentId = row.id
          this.shopDialogVisible = true
        } else if (type == 'entry') {
          // 进入
          this.$store.commit('SET_NAME', row.name)
          localStorage.setItem('companyName', row.name);
          this.enterInto(row.id)
        }
      },
      closeDialog() {
        this.ruleForm = {}
        this.formRuleList.forEach((item, index) => {
          item.disabled = false
        })
        this.$refs.childRules.resetCheck();
      }
    }
  }
</script>

<style lang="scss" scoped>
</style>