企业资质管理

src/api/base/company/index.js

@@ -50,4 +50,47 @@ export function exportCompanyExcel(params) {
     params,
     responseType: 'blob'
   })
-}
+}
+
+// 创建企业资质
+export function createCompanyQuals(data) {
+  return request({
+    url: '/base/company-quals/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新企业资质
+export function updateCompanyQuals(data) {
+  return request({
+    url: '/base/company-quals/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除企业资质
+export function deleteCompanyQuals(id) {
+  return request({
+    url: '/base/company-quals/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得企业资质
+export function getCompanyQuals(id) {
+  return request({
+    url: '/base/company-quals/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得企业资质分页
+export function getCompanyQualsPage(params) {
+  return request({
+    url: '/base/company-quals/list',
+    method: 'get',
+    params
+  })
+}

src/utils/dict.js

@@ -9,6 +9,8 @@ export const DICT_TYPE = {
   USER_TYPE: 'user_type',
   COMMON_STATUS: 'common_status',
   TERMINAL: 'terminal',
+  // ========== 点亮BASE 模块 ==========
+  BASE_QUALS_TYPE: 'quals_type',
 
   // ========== SYSTEM 模块 ==========
   SYSTEM_USER_SEX: 'system_user_sex',

src/views/base/company/form/CompanyQualsForm.vue

@@ -0,0 +1,149 @@
+<template>
+  <div class="app-container">
+    <!-- 对话框(添加 / 修改) -->
+    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="60%" v-dialogDrag append-to-body>
+      <!-- 操作工具栏 -->
+      <el-row :gutter="10" class="mb8">
+        <el-col :span="1.5">
+          <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="openForm()"
+                     v-hasPermi="['base:company-quals:create']">新增</el-button>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="8" v-for="(item, index) in list"  :key="item.id" :offset="index > 0 ? 1 : 0">
+          <el-card :body-style="{ padding: '0px' }">
+            <div slot="header" class="clearfix" style="text-align:center;position: relative;">
+              <span>
+                <dict-tag :type="DICT_TYPE.BASE_QUALS_TYPE" :value="item.qualsType"/>
+              </span>
+              <el-button v-hasPermi="['base:company-quals:delete']" class="dl-del-button" @click="handleDelete(item.id)" type="text" icon="el-icon-delete" ></el-button>
+            </div>
+            <div class="dl-clearfix">
+              <!-- 卡片内容 -->
+              <image-preview :src="item.fileUrl" class="image"></image-preview>
+              <div class="dl-float-box">
+                <span>{{item.qualsName}}({{item.qualsNo}})</span>
+                <div class="bottom clearfix">
+                  <time class="time">有效期：{{item.startDate}}至{{item.endDate}}</time>
+                </div>
+              </div>
+              <el-button type="text" v-hasPermi="['base:company-quals:update']" @click="openForm(item.id)" class="button">编辑</el-button>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">关 闭</el-button>
+      </div>
+    </el-dialog>
+    <edit-quals-draw ref="qualsDrawRef" :corp-id="corpId" @success="editQualsSuccess"></edit-quals-draw>
+  </div>
+</template>
+<script>
+import * as CompanyQualsApi from '@/api/base/company'
+import EditQualsDraw from './EditQualsDraw'
+import ImagePreview from "@/components/ImagePreview";
+import {DICT_TYPE, getDictDatas} from "@/utils/dict";
+
+export default {
+  name: 'CompanyQualsForm',
+  components: { EditQualsDraw,ImagePreview },
+  data() {
+    return {
+      // 弹出层标题
+      dialogTitle: '',
+      // 是否显示弹出层
+      dialogVisible: false,
+      //所有资质
+      list:[],
+      // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+      formLoading:false,
+      //企业id
+      corpId:"",
+    }
+  },
+  created() {
+
+  },
+  methods: {
+    /** 打开弹窗 */
+    async open(corpName,id) {
+      this.corpId = id
+      this.dialogVisible = true
+      this.dialogTitle = corpName+"-资质管理"
+      this.getList()
+    },
+    /** 查询资质 */
+    async getList(){
+      const res = await CompanyQualsApi.getCompanyQualsPage({corpId:this.corpId})
+      this.list = res.data
+    },
+    /** 新增/编辑资质 */
+    async openForm(qualsId){
+      if(qualsId){
+        //编辑
+        this.$refs['qualsDrawRef'].open(qualsId)
+      }else{
+        //新增
+        this.$refs['qualsDrawRef'].open()
+      }
+    },
+    /** 删除按钮操作 */
+    async handleDelete(id) {
+      await this.$modal.confirm('是否确认删除数据？')
+      try {
+        await CompanyQualsApi.deleteCompanyQuals(id)
+        await this.getList()
+        this.$modal.msgSuccess('删除成功')
+      } catch {
+      }
+    },
+    /** 新增/编辑地址完成回调 */
+    editQualsSuccess(){
+      this.getList()
+    }
+  }
+}
+</script>
+
+<style>
+.dl-clearfix{
+  content: "";
+  display: flex;
+  clear: both;
+  position: relative;
+  height: 120px;
+}
+.dl-float-box{
+  padding: 10px 5px;
+  width: 50%;
+}
+.dl-del-button {
+  right: -13px;
+  top: -14px;
+  position: absolute;
+  padding: 3px 0
+}
+.time {
+  font-size: 13px;
+  color: #999;
+}
+
+.bottom {
+  margin-top: 13px;
+  line-height: 12px;
+}
+
+.button {
+  padding: 0;
+  position: absolute;
+  right: 5px;
+  bottom: 5px;
+}
+
+.image {
+  width: 50%;
+  display: block;
+}
+
+</style>

src/views/base/company/form/EditQualsDraw.vue

@@ -0,0 +1,171 @@
+<template>
+  <!-- 对话框(添加 / 修改) -->
+  <el-drawer
+    :title="drawTitle"
+    size="40%"
+    :visible.sync="drawVisible"
+    @close="cancel()"
+  >
+    <div style="padding: 0 40px;margin-bottom: 70px">
+      <el-form ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading" label-width="120px">
+        <el-form-item label="资质证书类型" prop="qualsType">
+          <el-select v-model="formData.qualsType"  placeholder="请选择">
+            <el-option v-for="dict in qualsTypeDictDatas" :key="dict.value" :label="dict.label" :value="dict.value"/>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="资质证书编号" prop="qualsNo">
+          <el-input v-model="formData.qualsNo" placeholder="请输入资质证书编号"/>
+        </el-form-item>
+        <el-form-item label="资质证书名称" prop="qualsName">
+          <el-input v-model="formData.qualsName" placeholder="请输入资质证书名称"/>
+        </el-form-item>
+        <el-form-item label="有效起始日期" prop="startDate">
+          <el-date-picker clearable v-model="formData.startDate" type="date" value-format="yyyy-MM-dd"
+                          placeholder="选择有效起始日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效截止日期" prop="endDate">
+          <el-date-picker clearable v-model="formData.endDate" type="date" value-format="yyyy-MM-dd"
+                          placeholder="选择有效截止日期"
+          />
+        </el-form-item>
+        <el-form-item label="资质证书" prop="fileUrl">
+          <ImageUpload v-model="formData.fileUrl" :limit="1"/>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="dl-draw-footer" >
+      <div class="demo-drawer__footer">
+        <el-button @click="cancel()">取 消</el-button>
+        <el-button type="primary" @click="submitForm" :disabled="formLoading">保 存</el-button>
+      </div>
+    </div>
+  </el-drawer>
+</template>
+
+<script>
+import * as CompanyQualsApi from '@/api/base/company'
+import ImageUpload from '@/components/ImageUpload';
+import {DICT_TYPE, getDictDatas} from "@/utils/dict";
+
+export default {
+  name: 'EditQualsDraw',
+  components: {
+    ImageUpload,
+  },
+  props:{
+    corpId:{
+      type:String,
+      default:""
+    }
+  },
+  data() {
+    return {
+      // 弹出层标题
+      drawTitle:"",
+      // 是否显示弹出层
+      drawVisible: false,
+      // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+      formLoading: false,
+      // 表单参数
+      formData: {
+        id: undefined,
+        qualsNo: undefined,
+        corpId: undefined,
+        qualsType: undefined,
+        qualsName: undefined,
+        fileUrl: undefined,
+        startDate: undefined,
+        endDate: undefined
+      },
+      // 表单校验
+      formRules: {
+        qualsType: [{ required: true, message: '请选择资质证书类型', trigger: 'blur' }],
+        qualsNo: [{ required: true, message: '资质证书编号不能为空', trigger: 'blur' }],
+        qualsName: [{ required: true, message: '资质证书名称不能为空', trigger: 'blur' }],
+        startDate: [{ required: true, message: '请选择有效起始日期', trigger: 'blur' }],
+        endDate: [{ required: true, message: '请选择有效截止日期', trigger: 'blur' }],
+        fileUrl: [{ required: true, message: '请上传资质证书', trigger: 'blur' }],
+      },
+      // 数据字典
+      qualsTypeDictDatas: getDictDatas(DICT_TYPE.BASE_QUALS_TYPE),
+    }
+  },
+  methods: {
+
+    /** 打开弹窗 */
+    async open(id) {
+      this.drawVisible = true
+      this.drawTitle = "新增资质"
+      this.reset()
+      // 修改时，设置数据
+      if (id) {
+        this.drawTitle = "编辑资质"
+        this.formLoading = true
+        try {
+          const res = await CompanyQualsApi.getCompanyQuals(id)
+          this.formData = res.data
+        } finally {
+          this.formLoading = false
+        }
+      }
+    },
+    /** 提交按钮 */
+    async submitForm() {
+      // 校验主表
+      await this.$refs['formRef'].validate()
+      this.formLoading = true
+      try {
+        const data = this.formData
+        data.corpId = this.corpId
+        // 修改的提交
+        if (data.id) {
+          await CompanyQualsApi.updateCompanyQuals(data)
+          this.$modal.msgSuccess('修改成功')
+          this.drawVisible = false
+          this.$emit('success')
+          return
+        }
+        // 添加的提交
+        await CompanyQualsApi.createCompanyQuals(data)
+        this.$modal.msgSuccess('新增成功')
+        this.drawVisible = false
+        this.$emit('success')
+      } finally {
+        this.formLoading = false
+      }
+    },
+    /** 表单重置 */
+    reset() {
+      this.formData = {
+        id: undefined,
+        qualsNo: undefined,
+        corpId: undefined,
+        qualsType: undefined,
+        qualsName: undefined,
+        fileUrl: undefined,
+        startDate: undefined,
+        endDate: undefined
+      }
+      this.resetForm('formRef')
+    },
+    /** 取消 */
+    cancel(){
+      this.drawVisible = false
+      this.reset()
+    }
+  }
+}
+</script>
+<style>
+.dl-draw-footer {
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  right: 0;
+  padding: 5px 20px 10px 0;
+  z-index: 999;
+  background: white;
+  text-align: right
+}
+</style>

src/views/base/company/index.vue

@@ -57,26 +57,26 @@
           <span>{{scope.$index + 1}}</span>
         </template>
       </el-table-column>
-      <el-table-column label="企业名称" align="center" prop="corpName" width="180"/>
+      <el-table-column label="企业名称" align="left" prop="corpName" width="180"/>
-      <el-table-column label="统一社会信用代码" align="center" prop="orgCard" width="180"/>
+      <el-table-column label="统一社会信用代码" align="left" prop="orgCard" width="180"/>
-      <el-table-column label="注册资本（万元）" align="center" prop="registFund" width="180"/>
+      <el-table-column label="注册资本（万元）" align="right" prop="registFund" width="180"/>
       <el-table-column label="注册日期" align="center" prop="registDate" width="180"/>
-      <el-table-column label="详细地址" align="center" prop="address" width="180"/>
+      <el-table-column label="详细地址" align="left" prop="address" width="180"/>
-      <el-table-column label="法人姓名" align="center" prop="legalName" width="180"/>
+      <el-table-column label="法人姓名" align="left" prop="legalName" width="180"/>
-      <el-table-column label="法人身份证号" align="center" prop="legalCard" width="180"/>
+      <el-table-column label="法人身份证号" align="left" prop="legalCard" width="180"/>
-      <el-table-column label="联系人" align="center" prop="contactName" width="180"/>
+      <el-table-column label="联系人" align="left" prop="contactName" width="180"/>
-      <el-table-column label="联系方式" align="center" prop="mobilePhone" width="180"/>
+      <el-table-column label="联系方式" align="left" prop="mobilePhone" width="180"/>
-      <el-table-column label="企业简介" align="center" prop="corpContent" width="250">
+      <el-table-column label="企业简介" align="left" prop="corpContent" width="250">
         <template v-slot="scope">
-          <popover-text :str="scope.row.corpContent" :maxLength="100"></popover-text>
+          <popover-text :str="scope.row.corpContent" :maxLength="15"></popover-text>
         </template>
       </el-table-column>
-      <el-table-column label="经营范围" align="center" prop="business" width="250">
+      <el-table-column label="经营范围" align="left" prop="business" width="250">
         <template v-slot="scope">
-          <popover-text :str="scope.row.business" :maxLength="100"></popover-text>
+          <popover-text :str="scope.row.business" :maxLength="15"></popover-text>
         </template>
       </el-table-column>
-      <el-table-column label="管理员登录账号" align="center" prop="loginAccount" width="180"/>
+      <el-table-column label="管理员登录账号" align="left" prop="loginAccount" width="180"/>
       <el-table-column fixed="right" label="操作" align="center" class-name="small-padding fixed-width" width="200">
         <template v-slot="scope">
           <el-button size="mini" type="text" icon="el-icon-edit" @click="openForm(scope.row.id)"
@@ -87,6 +87,14 @@
                      v-hasPermi="['base:company:delete']"
           >删除
           </el-button>
+          <el-dropdown  @command="(command) => handleCommand(command, scope.$index, scope.row)"
+                        v-hasPermi="['base:company-quals:query']">
+            <el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item command="handleQuals" size="mini" type="text" icon="el-icon-delete"
+                                v-hasPermi="['base:company-quals:query']">资质管理</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
         </template>
       </el-table-column>
     </el-table>
@@ -96,17 +104,20 @@
     />
     <!-- 对话框(添加 / 修改) -->
     <CompanyForm ref="formRef" @success="getList"/>
+    <CompanyQualsForm ref="qualsFormRef" @success="getList"/>
   </div>
 </template>
 
 <script>
 import * as CompanyApi from '@/api/base/company'
 import PopoverText from '@/components/PopoverText/PopoverText';
-import CompanyForm from './CompanyForm.vue'
+import CompanyForm from './form/CompanyForm.vue'
+import CompanyQualsForm from './form/CompanyQualsForm'
 
 export default {
   name: 'Company',
   components: {
+    CompanyQualsForm,
     CompanyForm,
     PopoverText
   },
@@ -146,6 +157,17 @@ export default {
     this.getList()
   },
   methods: {
+    // 更多操作
+    handleCommand(command, index, row) {
+      switch (command) {
+        case 'handleQuals':
+          //资质管理
+          this.handleQuals(row);
+          break;
+        default:
+          break;
+      }
+    },
     /** 查询列表 */
     async getList() {
       try {
@@ -171,6 +193,10 @@ export default {
     openForm(id) {
       this.$refs['formRef'].open(id)
     },
+    /** 资质管理 */
+    handleQuals(row){
+      this.$refs['qualsFormRef'].open(row.corpName,row.id)
+    },
     /** 删除按钮操作 */
     async handleDelete(row) {
       const id = row.id