站内直转

src/api/materialsStation/index.js

@@ -302,7 +302,7 @@ export function equipmentTypeTree(data) {
 }
 
 // 领料申请租赁工程下拉框
-export function getListProject(data) {
+export function getListProject(data = {}) {
   return request({
     url: '/material/select/getProjectInfo',
     method: 'post',
@@ -846,3 +846,74 @@ export function getLeaseDataByCode(data) {
   })
 }
 
+// 站内直转-列表
+export function getUseDataApi(data) {
+  return request({
+    url: '/material/material_direct/getUseData',
+    method: 'post',
+    data
+  })
+}
+
+// 站内直转-设备树
+export function getUseThreeTreeApi(data) {
+  return request({
+    url: '/material/material_direct/getUseThreeTree',
+    method: 'post',
+    data
+  })
+}
+
+// 站内直转-新增
+export function addUseApi(data) {
+  return request({
+    url: '/material/material_direct/add',
+    method: 'post',
+    data
+  })
+}
+
+// 站内直转审核
+export function getUseListApi(data) {
+  return request({
+    url: '/material/material_direct/list',
+    method: 'get',
+    params: data
+  })
+}
+
+// 站内直转-编辑详情
+export function getInfoApi(query) {
+  return request({
+    url: '/material/material_direct/getInfo',
+    method: 'get',
+    params: query
+  })
+}
+
+// 站内直转-编辑
+export function editUseApi(data) {
+  return request({
+    url: '/material/material_direct/edit',
+    method: 'post',
+    data
+  })
+}
+
+// 站内直转-删除
+export function deleteUseApi(data) {
+  return request({
+    url: '/material/material_direct/delete',
+    method: 'post',
+    data
+  })
+}
+
+// 站内直转-审核
+export function directUpdateApi(data) {
+  return request({
+    url: '/material/material_direct/directUpdate',
+    method: 'post',
+    data
+  })
+}

src/views/materialsStation/straight/straightTransferReview/components/title-tip.vue

@@ -0,0 +1,37 @@
+<template>
+    <div class="title-tip">
+        <div class="is-green"></div>
+        <div class="title-child">{{ title }}</div>
+    </div>
+</template>
+
+<script>
+export default {
+    props: {
+        title: {
+            type: String,
+            default: () => '基本信息'
+        }
+    }
+}
+</script>
+
+<style scoped>
+.title-tip {
+    display: flex;
+    align-items: center;
+    background-color: #ebeaea;
+}
+
+.is-green {
+    margin: 0 6px;
+    width: 5px;
+    height: 20px;
+    background-color: #19a4a0;
+}
+.title-child {
+    font-weight: bold;
+    letter-spacing: 1px;
+    font-size: 18px;
+}
+</style>

src/views/materialsStation/straight/straightTransferReview/index.vue

@@ -0,0 +1,267 @@
+<template>
+  <!-- 直转审核页面 -->
+  <div class="app-container">
+    <el-form v-show="showSearch" :model="queryParams" ref="queryForm" size="small" inline>
+      <el-form-item label="申请日期" prop="timeRange">
+        <el-date-picker
+          clearable
+          type="daterange"
+          v-model="timeRange"
+          range-separator="至"
+          format="yyyy-MM-dd"
+          style="width: 240px"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="yyyy-MM-dd"
+        />
+      </el-form-item>
+      <el-form-item label="关键字" prop="keyWord">
+        <el-input
+          clearable
+          placeholder="请输入关键字"
+          v-model="queryParams.keyWord"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="审核状态" prop="status">
+        <el-select v-model="queryParams.status" placeholder="请选择审核状态" clearable>
+          <el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+      </el-form-item>
+
+      <!-- 表单按钮 -->
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
+        <el-button icon="el-icon-refresh" @click="handleReset">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出数据</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" />
+    </el-row>
+    <el-table :data="tableList" fit highlight-current-row style="width: 100%" :max-height="650" v-loading="isLoading">
+      <!-- 多选 -->
+      <el-table-column
+        type="index"
+        width="55"
+        label="序号"
+        align="center"
+        :index="indexContinuation(queryParams.pageNum, queryParams.pageSize)"
+      />
+      <el-table-column
+        v-for="column in tableColumns"
+        :show-overflow-tooltip="column.showTooltip"
+        :key="column.prop"
+        :label="column.label"
+        :prop="column.prop"
+        :width="column.width"
+        align="center"
+      >
+        <!-- 插槽 -->
+        <template v-slot="scope" v-if="column.prop == 'status'">
+          <el-tag v-if="scope.row.status == '0'" type="warning" size="mini">待审核</el-tag>
+          <el-tag v-else-if="scope.row.status == '1'" size="mini">审核中</el-tag>
+          <el-tag v-else-if="scope.row.status == '2'" type="success" size="mini">已通过</el-tag>
+          <el-tag v-else-if="scope.row.status == '3'" type="danger" size="mini">已驳回</el-tag>
+        </template>
+      </el-table-column>
+      <!-- 操作 -->
+      <el-table-column label="操作" align="center">
+        <template slot-scope="scope">
+          <el-button
+            type="text"
+            size="mini"
+            icon="el-icon-edit"
+            v-if="auditingShow(scope.row)"
+            @click="handleReview(scope.row, 2)"
+          >
+            审核
+          </el-button>
+          <el-button
+            type="text"
+            size="mini"
+            icon="el-icon-edit"
+            v-if="scope.row.status == 0 || scope.row.status == 3"
+            @click="handleEdit(scope.row)"
+          >
+            编辑
+          </el-button>
+          <el-button
+            type="text"
+            size="mini"
+            icon="el-icon-delete"
+            v-if="scope.row.status == 0 || scope.row.status == 3"
+            @click="handleDelete(scope.row)"
+            style="color: red"
+          >
+            删除
+          </el-button>
+          <el-button type="text" size="mini" icon="el-icon-search" @click="handleReview(scope.row, 1)">查看</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页 -->
+    <pagination
+      :total="total"
+      v-show="total > 0"
+      @pagination="getList"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+    />
+  </div>
+</template>
+
+<script>
+import { getUseListApi, deleteUseApi } from '@/api/materialsStation'
+import { formatTime } from '@/utils/bonus.js'
+
+export default {
+  name: 'straightTransferReview',
+  data() {
+    return {
+      isLoading: false,
+      showSearch: true,
+      userId: '',
+      timeRange: [],
+      // 表格数据
+      tableList: [],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        keyWord: '', // 关键字
+        status: '' // 审核状态
+      },
+      // 状态
+      statusOptions: [
+        { label: '待审核', value: '0' },
+        { label: '审核中', value: '1' },
+        { label: '已完成', value: '2' },
+        { label: '已驳回', value: '3' }
+      ],
+      total: 0, // 总条数
+      // 表头
+      tableColumns: [
+        { label: '直转单号', prop: 'code' },
+        { label: '申请时间', prop: 'createTime', showToolTip: true, width: '100' },
+        { label: '申请人', prop: 'createBy', showToolTip: true, width: '80' },
+        { label: '转出工程', prop: 'backProName', showToolTip: false },
+        { label: '转出班组', prop: 'backTeamName', showToolTip: false },
+        { label: '转入工程', prop: 'leaseProName', showToolTip: false },
+        { label: '转入班组', prop: 'leaseTeamName', showToolTip: false },
+        { label: '状态', prop: 'status', showToolTip: true, width: '80' }
+      ]
+    }
+  },
+  created() {
+    this.userId = sessionStorage.getItem('userId')
+    console.log('🚀 ~ created ~ this.userId:', this.userId)
+    this.getList()
+  },
+  methods: {
+    // 查询
+    handleQuery() {
+      this.getList()
+    },
+    // 重置
+    handleReset() {
+      this.timeRange = []
+      this.queryParams.pageNum = 1
+      this.queryParams.pageSize = 10
+      this.$refs.queryForm.resetFields()
+      this.getList()
+    },
+    // 获取列表
+    async getList() {
+      try {
+        this.isLoading = true
+        const params = {
+          ...this.queryParams,
+          startTime: this.timeRange ? this.timeRange[0] : '',
+          endTime: this.timeRange ? this.timeRange[1] : ''
+        }
+        const res = await getUseListApi(params)
+        this.tableList = res.data.rows
+        this.total = res.data.total || 0
+      } catch (error) {
+        this.tableList = []
+        this.total = 0
+      } finally {
+        this.isLoading = false
+      }
+    },
+    // 审核/详情
+    handleReview(row, type) {
+      // ----type---- 1. 查看 2. 审核
+      // 跳转审核详情页面
+      this.$router.push({
+        path: '/materialsStation/straight/reviewDetails',
+        query: {
+          ...row,
+          taskId: row.id,
+          type: type === 1 ? 'detail' : 'edit',
+        }
+      })
+    },
+    // 编辑
+    handleEdit(row, type) {
+      this.$router.push({
+        path: '/materialsStation/straight/straightTransfer',
+        query: {
+          id: row.id,
+          type: 'edit'
+        }
+      })
+    },
+    // 删除
+    handleDelete(row) {
+      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(async () => {
+        try {
+          this.isLoading = true
+          await deleteUseApi({ id: row.id })
+          this.$message({
+            type: 'success',
+            message: '删除成功'
+          })
+        } catch (error) {
+          console.log('🚀 ~ handleDelete ~ error:', error)
+        } finally {
+          this.isLoading = false
+          this.getList()
+        }
+      })
+    },
+    // 判断审核按钮显示隐藏
+    auditingShow(row) {
+      if (row.directUserIds) {
+        const directUserIds = row.directUserIds.split(',')
+        return (row.status == 1 || row.status == 0) && directUserIds.includes(this.userId)
+      }
+    },
+    // 导出数据
+    handleExport() {
+      // 提示
+      this.$message({
+        type: 'warning',
+        message: '导出功能开发中，敬请期待！'
+      })
+      try {
+        let fileName = `导出_${formatTime(new Date())}.xLsx`
+        let url = '/material/material_direct/export'
+        const params = { ...this.queryParams }
+        console.log('🚀 ~ 导出 ~ params:', params)
+        this.download(url, params, fileName)
+      } catch (error) {
+        console.log('导出数据失败', error)
+      }
+    }
+  }
+}
+</script>

src/views/materialsStation/straight/straightTransferReview/reviewDetails.vue

@@ -0,0 +1,477 @@
+<template>
+  <div class="business-details-container">
+    <el-row>
+      <el-col :span="18">
+        <div class="left-container">
+          <div class="pages-title">直转申请详情</div>
+          <TitleTip :title="`基本信息`" />
+
+          <el-form :model="maForm" ref="maForm" size="small" label-width="100px" disabled style="margin-top: 20px">
+            <el-row :gutter="20" class="cont-center" style="margin-bottom: 20px">
+              <el-col :span="10" :offset="0">
+                <el-card shadow="always" :body-style="{ padding: '20px' }" style="min-width: 400px">
+                  <!-- card body -->
+                  <el-form-item label="转出工程" prop="backProId">
+                    <el-input
+                      v-model="maForm.backProName"
+                      placeholder="请输入转出工程"
+                      clearable
+                      maxlength="50"
+                      style="width: 240px"
+                    />
+                  </el-form-item>
+                  <el-form-item label="转出班组" prop="backTeamName">
+                    <el-input
+                      v-model="maForm.backTeamName"
+                      placeholder="请输入转出班组"
+                      clearable
+                      maxlength="50"
+                      style="width: 240px"
+                    />
+                  </el-form-item>
+                  <el-form-item label="转出人" prop="backMan">
+                    <el-input
+                      v-model="maForm.backMan"
+                      placeholder="请输入转出人"
+                      clearable
+                      maxlength="50"
+                      style="width: 240px"
+                    />
+                  </el-form-item>
+                  <el-form-item label="联系电话" prop="backPhone">
+                    <el-input
+                      v-model="maForm.backPhone"
+                      placeholder="请输入联系电话"
+                      clearable
+                      maxlength="11"
+                      style="width: 240px"
+                    />
+                  </el-form-item>
+                </el-card>
+              </el-col>
+              <el-col :span="3" :offset="0">
+                <div class="cont-center">
+                  <el-image
+                    style="width: 100px; height: 100px"
+                    :src="require('@/assets/img/transform.png')"
+                    fit="fit"
+                  ></el-image>
+                </div>
+              </el-col>
+              <el-col :span="10" :offset="0">
+                <el-card shadow="always" :body-style="{ padding: '20px' }" style="min-width: 400px">
+                  <!-- card body -->
+                  <el-form-item label="转入工程" prop="leaseProId">
+                    <el-input
+                      v-model="maForm.leaseProName"
+                      placeholder="请输入转入工程"
+                      clearable
+                      maxlength="50"
+                      style="width: 240px"
+                    />
+                  </el-form-item>
+                  <el-form-item label="转入班组" prop="leaseTeamName">
+                    <el-input
+                      v-model="maForm.leaseTeamName"
+                      placeholder="请输入转入班组"
+                      clearable
+                      maxlength="50"
+                      style="width: 240px"
+                    />
+                  </el-form-item>
+                  <el-form-item label="转入人" prop="leaseMan">
+                    <el-input
+                      v-model="maForm.leaseMan"
+                      placeholder="请输入转入人"
+                      clearable
+                      maxlength="50"
+                      style="width: 240px"
+                    />
+                  </el-form-item>
+                  <el-form-item label="联系电话" prop="leasePhone">
+                    <el-input
+                      v-model="maForm.leasePhone"
+                      placeholder="请输入联系电话"
+                      clearable
+                      maxlength="11"
+                      style="width: 240px"
+                    />
+                  </el-form-item>
+                </el-card>
+              </el-col>
+            </el-row>
+          </el-form>
+          <TitleTip :title="`明细信息`" />
+
+          <el-table ref="equipmentList" :data="equipmentList">
+            <el-table-column align="center" label="序号" type="index" width="55" />
+            <el-table-column
+              v-for="(column, index) in tableColumns"
+              :key="column.prop"
+              :label="column.label"
+              :prop="column.prop"
+              align="center"
+              show-overflow-tooltip
+            ></el-table-column>
+          </el-table>
+          <TitleTip :title="`附件信息`" />
+
+          <div class="file-box">
+            <div v-for="(file, index) in fileList" :key="index">
+              <div v-if="file.type === 'pdf'" style="margin: 10px">
+                <a :href="file.url" target="_blank">
+                  <el-image :src="require('@/assets/file.png')" fit="file" style="width: 100px; height: 100px" />
+                </a>
+              </div>
+              <div v-else-if="file.type === 'image'" style="margin: 10px">
+                <el-image
+                  :src="file.url"
+                  fit="file"
+                  :preview-src-list="previewList"
+                  @click="handleImg(file)"
+                  style="width: 100px; height: 100px"
+                />
+              </div>
+            </div>
+          </div>
+        </div>
+      </el-col>
+      <el-col :span="6">
+        <div class="right-container">
+          <div class="right-title">
+            <div></div>
+            <div></div>
+            <div>流程记录</div>
+          </div>
+
+          <div class="process-record">
+            <el-steps :space="120" direction="vertical">
+              <el-step v-for="(step, index) in auditingList" :key="index" :title="step.nodeName">
+                <template slot="description">
+                  <div class="custom-description">
+                    审核结果:
+                    <el-tag size="mini" type="primary" v-if="step.isAccept === 0">待审批</el-tag>
+                    <el-tag size="mini" type="success" v-if="step.isAccept === 1">已通过</el-tag>
+                    <el-tag size="mini" type="danger" v-if="step.isAccept === 2">已驳回</el-tag>
+                  </div>
+
+                  <div class="node-info" v-if="step.auditBy">
+                    审核人:
+                    {{ step.auditBy }}
+                  </div>
+
+                  <div class="node-info" v-if="step.createTime">
+                    审核时间:
+                    {{ step.createTime }}
+                  </div>
+
+                  <div class="node-info" v-if="step.remark">
+                    审核意见:
+                    {{ step.remark }}
+                  </div>
+                </template>
+              </el-step>
+            </el-steps>
+          </div>
+
+          <div class="auditing-container" v-if="isEdit && auditingList.length > 0">
+            <el-input
+              type="textarea"
+              v-model="auditingParams.remark"
+              placeholder="请输入审核意见"
+              :autosize="{ minRows: 2, maxRows: 6 }"
+            />
+
+            <el-row class="btn-container">
+              <el-button type="success" size="mini" @click="onSubmitPass">通过</el-button>
+              <el-button type="danger" size="mini" @click="onSubmitReject">驳回</el-button>
+            </el-row>
+          </div>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import TitleTip from './components/title-tip.vue'
+import { getAuditingDetailsApi } from '@/api/receive-apply/index.js'
+import { getInfoApi, directUpdateApi } from '@/api/materialsStation/index'
+
+export default {
+  components: {
+    TitleTip
+  },
+  name: '',
+  data() {
+    return {
+      id: '',
+      flowId: '',
+      isEdit: false, // 是否编辑
+      isDetail: false, // 是否查看
+      isAccept: '',
+      remark: '',
+      maForm: {},
+      auditingList: [], // 流程记录
+      equipmentList: [], // 设备列表
+      // 表头
+      tableColumns: [
+        { label: '直转数量', prop: 'directNum' },
+        { label: '类型名称', prop: 'typeName' },
+        { label: '规格型号', prop: 'typeModelName' },
+        { label: '机具编号', prop: 'maCode' },
+        { label: '计量单位', prop: 'unitName' },
+        { label: '领料人', prop: 'leasePerson' },
+        { label: '领料日期', prop: 'startTime' }
+      ],
+      fileList: [],
+      previewList: [],
+      auditingParams: {
+        nodeId: '', // 当前审核记录的id
+        remark: '', // 审核意见
+        typeId: '', // 当前审核记录中的 typeId
+        taskId: '', // 外层列表的taskId
+        isAccept: '', // 审批结果 1. 通过 2. 驳回
+        recordId: '',
+        nextNodeId: '' // 下个流程节点ID
+      },
+      currentRow: {}
+    }
+  },
+  created() {
+    // 判断当前路由页面是否有查询参数
+    this.currentRow = this.$route.query
+    console.log('🚀 ~ created ~ this.currentRow:', this.currentRow)
+    if (this.$route.query.type == 'edit') {
+      this.isEdit = true
+      this.isDetail = false
+      this.id = this.$route.query.id
+      this.flowId = this.$route.query.flowId
+    } else if (this.$route.query.type == 'detail') {
+      this.isEdit = false
+      this.isDetail = true
+      this.id = this.$route.query.id
+      this.flowId = this.$route.query.flowId
+    }
+
+    this.getTaskInfo()
+    if (this.$route.query) {
+      const { nodeId, flowId, taskId } = this.$route.query
+      this.auditingParams.taskId = flowId
+      this.currentNodeId = nodeId
+      this.getLeaseTaskDetailFun(flowId || taskId)
+    }
+  },
+  methods: {
+    // 通过
+    onSubmitPass() {
+      // 弹框提示
+      this.$confirm('是否确认通过审核？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.currentRow.isAccept = 1
+          this.submitAuditing()
+        })
+        .catch(() => {
+          this.$message.info('已取消')
+        })
+    },
+    // 驳回
+    onSubmitReject() {
+      // 弹框提示
+      this.$confirm('是否确认驳回审核？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.currentRow.isAccept = 2
+          this.submitAuditing()
+        })
+        .catch(() => {
+          this.$message.info('已取消')
+        })
+    },
+    // 提交审核
+    async submitAuditing() {
+      // 组装参数
+
+      // const currentAuditing = this.auditingList.filter(e => e.nodeId === this.currentNodeId) // 获取当前审核的节点
+      // const currentIndex = this.auditingList.findIndex(e => e.nodeId === this.currentNodeId) // 获取当前的索引
+
+      // const { recordId, id, typeId, isAccept } = currentAuditing[0]
+
+      // // if (isAccept !== 0) {
+      // //     this.$modal.msgError('当前已审核，不可重复审核')
+      // //     return
+      // // }
+      // Object.assign(this.auditingParams, {
+      //   typeId,
+      //   recordId,
+      //   nodeId: id
+      // })
+      // if (currentIndex !== this.auditingList.length - 1) {
+      //   this.auditingParams.nextNodeId = this.auditingList[currentIndex + 1].id
+      // }
+
+      // this.auditingParams.taskTypeId = 16
+
+      this.currentRow.remark = this.auditingParams.remark
+      const loading = this.$loading()
+      try {
+        await directUpdateApi(this.currentRow)
+        this.$message.success('审核成功')
+        this.$tab.closePage()
+      } catch (error) {
+        console.log('🚀 ~ submitAuditing ~ error:', error)
+      } finally {
+        loading.close()
+      }
+    },
+    // 获取详情
+    async getTaskInfo() {
+      const loading = this.$loading()
+      try {
+        const res = await getInfoApi({ id: this.id })
+        console.log('🚀 ~ getTaskInfo ~ res:', res)
+        this.maForm = res.data.directApplyInfo || {}
+        this.equipmentList = res.data.directApplyInfoDetails || []
+        this.fileList = res.data.directApplyInfo.dirUrls || []
+        if (this.fileList.length > 0) {
+          this.fileList.forEach(item => {
+            // 如果url 是 .pdf 结尾 添加 type= pdf
+            if (item.url.includes('.pdf')) {
+              item.type = 'pdf'
+            } else {
+              item.type = 'image'
+            }
+          })
+        }
+        console.log('🚀 ~ getTaskInfo ~ fileList:', this.fileList)
+        console.log('🚀 ~ getTaskInfo ~ this.equipmentList:', this.equipmentList)
+        loading.close()
+      } catch (error) {
+        console.log('🚀 ~ error:', error)
+        loading.close()
+      }
+    },
+    handleImg(img) {
+      console.log('🚀 ~ handleImg ~ img:', img)
+      this.previewList = this.fileList.filter(file => file.type === 'image').map(file => file.url)
+    },
+    // 获取数据详情 和 审核记录详情
+    async getLeaseTaskDetailFun(taskId) {
+      const taskType = 25
+      const result = await getAuditingDetailsApi({ taskId, taskType })
+      console.log('result', result)
+      this.auditingList = result.rows
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.business-details-container {
+  padding: 20px;
+}
+
+.pages-title {
+  padding: 10px 0 30px 0;
+  font-size: 20px;
+  font-weight: bold;
+  letter-spacing: 2px;
+  text-align: center;
+  color: #19a4a0;
+}
+
+.file-box {
+  padding: 10px;
+  display: flex;
+  flex-wrap: wrap;
+  box-sizing: border-box;
+  /* div {
+    width: calc((100% - 110px) / 12);
+    height: 60px;
+    margin-right: 10px;
+    margin-top: 10px;
+    text-align: center;
+    line-height: 60px;
+    background-color: #19a4a0;
+  }
+
+  & div:nth-child(12n) {
+    margin-right: 0;
+  } */
+}
+
+.right-container {
+  padding: 0 20px;
+}
+
+.right-title {
+  display: flex;
+  align-items: center;
+  font-size: 14px;
+  & div:first-child {
+    width: 16px;
+    height: 16px;
+    border-radius: 50%;
+    background-color: #19a4a0;
+    z-index: 9;
+  }
+  & div:nth-child(2) {
+    width: 16px;
+    height: 16px;
+    border-radius: 50%;
+    background-color: #b2e1e0;
+    transform: translateX(-50%);
+  }
+}
+
+.process-record {
+  margin-top: 20px;
+  //   height: 60vh;
+}
+
+.btn-container {
+  margin-top: 10px;
+  display: flex;
+  justify-content: space-around;
+}
+
+::v-deep .el-step__icon.is-text {
+  background-color: #19a4a0;
+  color: #19a4a0;
+  border: none;
+  width: 16px;
+  height: 16px;
+}
+
+::v-deep .el-step.is-vertical .el-step__line {
+  width: 2px;
+  top: 26px;
+  bottom: 8px;
+  left: 7px;
+}
+
+::v-deep .el-step__title.is-finish {
+  font-weight: bold;
+  color: #303133;
+  font-size: 16px;
+}
+
+::v-deep .el-step__title.is-wait {
+  font-weight: bold;
+  color: #303133;
+  font-size: 16px;
+}
+// 居中
+.cont-center {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+</style>