Browse Source

驾校管理子模块

wyling 4 years ago
parent
commit
eedd4c03a1
2 changed files with 702 additions and 0 deletions
  1. 53 0
      src/api/school/info.js
  2. 649 0
      src/views/school/info/index.vue

+ 53 - 0
src/api/school/info.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 查询驾校列表
+export function listInfo(query) {
+  return request({
+    url: '/school/info/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询驾校详细
+export function getInfo(inscode) {
+  return request({
+    url: '/school/info/' + inscode,
+    method: 'get'
+  })
+}
+
+// 新增驾校
+export function addInfo(data) {
+  return request({
+    url: '/school/info',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改驾校
+export function updateInfo(data) {
+  return request({
+    url: '/school/info',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除驾校
+export function delInfo(inscode) {
+  return request({
+    url: '/school/info/' + inscode,
+    method: 'delete'
+  })
+}
+
+// 导出驾校
+export function exportInfo(query) {
+  return request({
+    url: '/school/info/export',
+    method: 'get',
+    params: query
+  })
+}

+ 649 - 0
src/views/school/info/index.vue

@@ -0,0 +1,649 @@
+<template>
+  <div class="app-container">
+    <el-form
+      v-show="showSearch"
+      ref="queryForm"
+      :model="queryParams"
+      :inline="true"
+      label-width="68px"
+    >
+      <el-form-item label="驾校名称" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入驾校名称(模糊搜索)"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item
+        label="经营负责人"
+        prop="responsiblePerson"
+        label-width="90px"
+      >
+        <el-input
+          v-model="queryParams.responsiblePerson"
+          placeholder="请输入经营负责人"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+
+      <el-form-item label="驾校电话" prop="tel">
+        <el-input
+          v-model="queryParams.tel"
+          placeholder="请输入驾校电话"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+
+      <el-form-item>
+        <el-button
+          type="cyan"
+          icon="el-icon-search"
+          size="mini"
+          @click="handleQuery"
+        >搜索</el-button>
+        <el-button
+          icon="el-icon-refresh"
+          size="mini"
+          @click="resetQuery"
+        >重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['school:info:add']"
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['school:info:edit']"
+          type="success"
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['school:info:remove']"
+          type="danger"
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['school:info:export']"
+          type="warning"
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :show-search.sync="showSearch" @queryTable="getList" />
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="infoList"
+      @selection-change="handleSelectionChange"
+      height="calc(100vh - 300px)"
+    >
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column
+        label="驾校全国统一编号"
+        align="center"
+        prop="inscode"
+        width="180"
+      />
+      <el-table-column
+        label="驾校名称"
+        align="center"
+        prop="name"
+        width="350"
+      />
+      <el-table-column
+        label="经营负责人"
+        align="center"
+        prop="responsiblePerson"
+        width="100"
+      />
+      <el-table-column
+        label="驾校地址"
+        align="center"
+        prop="address"
+        width="350"
+      />
+
+      <el-table-column label="驾校电话" align="center" prop="tel" width="120" />
+
+      <el-table-column
+        label="添加时间"
+        align="center"
+        prop="registrationDate"
+        width="120"
+      >
+        <template slot-scope="scope">
+          <span>{{
+            parseTime(scope.row.registrationDate, '{y}-{m}-{d}')
+          }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+        min-width="200"
+        fixed='right'
+      >
+        <template slot-scope="scope">
+          <el-button
+            v-hasPermi="['school:info:edit']"
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleDetail(scope.row)"
+          >详情</el-button>
+          <el-button
+            v-hasPermi="['school:info:edit']"
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+          >修改</el-button>
+          <el-button
+            v-hasPermi="['school:info:remove']"
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 详情或添加或修改驾校对话框 -->
+    <el-dialog
+      :title="title"
+      :visible.sync="open"
+      width="1000px"
+      append-to-body
+    >
+      <el-form
+        ref="form"
+        :model="form"
+        :rules="rules"
+        label-width="80px"
+        :inline="true"
+        class="dialog"
+      >
+        <div class="top">
+          <div class="log">基础信息</div>
+          <el-form-item label="驾校名称" prop="name">
+            <el-input v-model="form.name" placeholder="请输入驾校名称" />
+          </el-form-item>
+          <el-form-item label="驾校电话" prop="tel">
+            <el-input v-model="form.tel" placeholder="请输入驾校电话" />
+          </el-form-item>
+          <el-form-item label="所在区域" prop="areaName">
+            <el-input
+              v-model="form.areaName"
+              placeholder="请输入行政区划名称"
+            />
+          </el-form-item>
+          <el-form-item label="详细地址" prop="address">
+            <el-input v-model="form.address" placeholder="请输入驾校地址" />
+          </el-form-item>
+          <el-form-item label="微信" prop="wechar">
+            <el-input v-model="form.wechar" placeholder="请输入驾校微信号" />
+          </el-form-item>
+          <el-form-item label="QQ" prop="wechar">
+            <el-input v-model="form.wechar" placeholder="请输入驾校微信号" />
+          </el-form-item>
+        </div>
+
+        <div class="center">
+          <div class="log">详细信息</div>
+          <div class="item2">
+            <div class="left">
+              <el-form-item label="公司LOGO" prop="sname" label-width="90px">
+                <!-- <img src="form.sname" width="80px" height="80px"> -->
+                <!-- <el-image :src="form.sname" style="width: 100px; height: 100px">
+                  <div slot="error" class="image-slot">
+                    <i class="el-icon-picture-outline" />
+                  </div>
+                </el-image> -->
+                <el-upload
+                  class="avatar-uploader"
+                  action="https://jsonplaceholder.typicode.com/posts/"
+                  :show-file-list="false"
+                  :on-success="handleAvatarSuccess"
+                  :before-upload="beforeAvatarUpload"
+                >
+                  <img
+                    v-if="form.imageUrl"
+                    :src="form.imageUrl"
+                    class="avatar"
+                  >
+                  <i v-else class="el-icon-plus avatar-uploader-icon" />
+                </el-upload>
+              </el-form-item>
+            </div>
+
+            <div class="right">
+              <el-form-item label="负责人" prop="responsiblePerson">
+                <el-input
+                  v-model="form.responsiblePerson"
+                  placeholder="请输入经营负责人"
+                />
+              </el-form-item>
+              <el-form-item
+                label="负责人电话"
+                prop="responsiblePerson"
+                label-width="90px"
+              >
+                <el-input
+                  v-model="form.responsiblePerson"
+                  placeholder="请输入经营负责人"
+                />
+              </el-form-item>
+              <el-form-item label="公司评级" prop="credibilityScore">
+                <el-input
+                  v-model="form.credibilityScore"
+                  placeholder="请输入当前信用得分"
+                />
+              </el-form-item>
+              <el-form-item
+                label="公司传真"
+                prop="responsiblePerson"
+                label-width="90px"
+              >
+                <el-input
+                  v-model="form.responsiblePerson"
+                  placeholder="请输入经营负责人"
+                />
+              </el-form-item>
+              <el-form-item label="公司介绍" prop="pxcx" class="Introduction">
+                <el-input
+                  v-model="form.pxcx"
+                  type="textarea"
+                  placeholder="请输入内容"
+                  :autosize="{ minRows: 3, maxRows: 4 }"
+                  maxlength="300"
+                  show-word-limit
+                />
+              </el-form-item>
+            </div>
+          </div>
+        </div>
+
+        <div class="bottom">
+          <div class="log">财务信息</div>
+          <el-form-item label="企业税号" prop="responsiblePerson">
+            <el-input
+              v-model="form.responsiblePerson"
+              placeholder="请输入经营负责人"
+            />
+          </el-form-item>
+          <el-form-item label="开户银行" prop="responsiblePerson">
+            <el-input
+              v-model="form.responsiblePerson"
+              placeholder="请输入经营负责人"
+            />
+          </el-form-item>
+          <el-form-item label="银行账号" prop="credibilityScore">
+            <el-input
+              v-model="form.credibilityScore"
+              placeholder="请输入当前信用得分"
+            />
+          </el-form-item>
+        </div>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button
+          v-if="submitFlag"
+          type="primary"
+          @click="submitForm"
+        >确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  listInfo,
+  getInfo,
+  delInfo,
+  addInfo,
+  updateInfo,
+  exportInfo
+} from '@/api/school/info'
+import myamap from '@/components/Amap'
+
+export default {
+  name: 'Info',
+  components: {
+    myamap
+  },
+  data() {
+    return {
+      // 详情确定按钮隐藏
+      submitFlag: false,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 驾校表格数据
+      infoList: [],
+      // 弹出层标题
+      title: '',
+      // 是否显示弹出层
+      open: false,
+      // 是否显示详情弹出层
+      openDetails: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        name: null,
+        sname: null,
+        address: null,
+        legalPersonIdNumber: null,
+        responsiblePerson: null,
+        legalPersonName: null,
+        areaName: null,
+        areaCode: null,
+        tel: null,
+        wechar: null,
+        registrationDate: null,
+        licenseNumber: null,
+        licenseWord: null,
+        licenseValidPeriodFrom: null,
+        licenseValidPeriodEnd: null,
+        credibilityGrade: null,
+        credibilityScore: null,
+        vehicleSum: null,
+        regcapital: null,
+        bizlicense: null,
+        poiLon: null,
+        poiLat: null,
+        removed: null,
+        initialReceiptDate: null,
+        businessStatusName: null,
+        pxcx: null
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {}
+    }
+  },
+  created() {
+    this.getList()
+  },
+  methods: {
+    // 上传方法
+    handleAvatarSuccess(res, file) {
+      this.imageUrl = URL.createObjectURL(file.raw)
+    },
+    beforeAvatarUpload(file) {
+      const isJPG = file.type === 'image/jpeg'
+      const isLt2M = file.size / 1024 / 1024 < 2
+
+      if (!isJPG) {
+        this.$message.error('上传头像图片只能是 JPG 格式!')
+      }
+      if (!isLt2M) {
+        this.$message.error('上传头像图片大小不能超过 2MB!')
+      }
+      return isJPG && isLt2M
+    },
+    /** 查询驾校列表 */
+    getList() {
+      this.loading = true
+      listInfo(this.queryParams).then(response => {
+        this.infoList = response.rows
+        this.total = response.total
+        this.loading = false
+      })
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false
+      this.reset()
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        inscode: null,
+        name: null,
+        sname: null,
+        address: null,
+        legalPersonIdNumber: null,
+        responsiblePerson: null,
+        legalPersonName: null,
+        areaName: null,
+        areaCode: null,
+        tel: null,
+        wechar: null,
+        registrationDate: null,
+        licenseNumber: null,
+        licenseWord: null,
+        licenseValidPeriodFrom: null,
+        licenseValidPeriodEnd: null,
+        credibilityGrade: null,
+        credibilityScore: null,
+        vehicleSum: null,
+        regcapital: null,
+        bizlicense: null,
+        poiLon: null,
+        poiLat: null,
+        removed: null,
+        createTime: null,
+        updateTime: null,
+        initialReceiptDate: null,
+        businessStatusName: null,
+        pxcx: null
+      }
+      this.resetForm('form')
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1
+      this.getList()
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm('queryForm')
+      this.handleQuery()
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.inscode)
+      this.single = selection.length !== 1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset()
+      this.open = true
+      this.title = '添加驾校'
+    },
+    /** 详情按钮操作 */
+    handleDetail(row) {
+      this.reset()
+      const inscode = row.inscode || this.ids
+      getInfo(inscode).then(response => {
+        this.form = response.data
+        this.open = true
+        this.title = '驾校详情'
+        this.submitFlag = false
+      })
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset()
+      const inscode = row.inscode || this.ids
+      getInfo(inscode).then(response => {
+        this.form = response.data
+        this.open = true
+        this.title = '修改驾校'
+        this.submitFlag = true
+      })
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs['form'].validate(valid => {
+        if (valid) {
+          if (this.form.inscode != null) {
+            updateInfo(this.form).then(response => {
+              this.msgSuccess('修改成功')
+              this.open = false
+              this.getList()
+            })
+          } else {
+            addInfo(this.form).then(response => {
+              this.msgSuccess('新增成功')
+              this.open = false
+              this.getList()
+            })
+          }
+        }
+      })
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const inscodes = row.inscode || this.ids
+      this.$confirm(
+        '是否确认删除驾校编号为"' + inscodes + '"的数据项?',
+        '警告',
+        {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }
+      )
+        .then(function() {
+          return delInfo(inscodes)
+        })
+        .then(() => {
+          this.getList()
+          this.msgSuccess('删除成功')
+        })
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      const queryParams = this.queryParams
+      this.$confirm('是否确认导出所有驾校数据项?', '警告', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(function() {
+          return exportInfo(queryParams)
+        })
+        .then(response => {
+          this.download(response.data)
+        })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+/deep/ .image-slot {
+  width: 100%;
+  height: 100%;
+  background-color: #ccc;
+  align-items: center;
+  display: flex;
+  justify-content: center;
+}
+.dialog {
+  text-align: center;
+  max-height: calc(100vh - 220px);
+  overflow: auto;
+  .log {
+    margin: 18px;
+    text-align: left;
+    font-size: 18px;
+    font-weight: 600;
+    border-left: 5px solid royalblue;
+    padding-left: 5px;
+  }
+  .top {
+    .el-form-item {
+      width: 32%;
+    }
+  }
+  .center {
+    .item2 {
+      width: 100%;
+      display: flex;
+      justify-content: space-between;
+      .left {
+        width: 32%;
+        .el-form-item {
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+        }
+      }
+      .right {
+        width: 64%;
+        padding-right: 2.4%;
+        text-align: left;
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-between;
+        // align-content: space-between;
+        .Introduction {
+          width: 100%;
+          display: flex;
+          justify-content: flex-start;
+          /deep/ .el-form-item__content {
+            flex: 1;
+          }
+        }
+      }
+    }
+  }
+  .bottom {
+    .el-form-item {
+      width: 32%;
+    }
+  }
+}
+</style>