zhouwx
2026-06-17 facea208b2fc7c8c7a0d176df06305b866c6520f
src/views/hazardousChemicals/subscribeApplyManage/record/index.vue
@@ -2,16 +2,16 @@
  <div class="app-container">
    <div style="display: flex;justify-content: space-between">
      <el-form :inline="true" style="display: flex;align-items: center;flex-wrap: wrap;" >
<!--        <el-form-item>-->
<!--          <el-button-->
<!--              type="primary"-->
<!--              plain-->
<!--              icon="Plus"-->
<!--              @click="openDialog('add',{})"-->
<!--          >新增</el-button>-->
<!--        </el-form-item>-->
        <el-form-item>
          <el-button
              type="primary"
              plain
              icon="Plus"
              @click="openDialog('add',{})"
          >新增</el-button>
        </el-form-item>
        <el-form-item label="审批状态:" >
          <el-select v-model="data.queryParams.state" placeholder="请选择" >
          <el-select v-model="data.queryParams.status" placeholder="请选择" >
            <el-option
                v-for="item in data.stateOptions"
                :key="item.id"
@@ -20,7 +20,28 @@
            />
          </el-select>
        </el-form-item>
        <el-form-item label="审批人:" prop="userId" >
        <el-form-item label="申购人:" v-if="data.isAdmin">
          <el-select
              clearable
              v-model="data.userNameS"
              filterable
              remote
              @change="selectValueS"
              reserve-keyword
              placeholder="请输入申购人名称"
              remote-show-suffix
              :remote-method="getPeopleList"
              style="width: 100%"
          >
            <el-option
                v-for="item in data.peopleList"
                :key="item.id"
                :label="item.name"
                :value="item.name"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="审批人:" >
          <el-select
              clearable
              v-model="data.userName"
@@ -57,19 +78,57 @@
    <!-- 表格数据 -->
    <el-table v-loading="loading" :data="dataList" :border="true">
      <el-table-column label="序号" type="index" align="center" width="80" />
      <el-table-column label="申购单号" prop="creditCode" align="center"  />
      <el-table-column label="危化品名称" prop="code" align="center" />
      <el-table-column label="申购数量" prop="name" align="center" />
      <el-table-column label="申购人" prop="major" align="center"  />
      <el-table-column label="审批人" prop="phone" align="center"/>
      <el-table-column label="申购文件" prop="phone" align="center">
      <el-table-column label="申购单号" prop="subscribeNum" align="center"  />
      <el-table-column label="危化品名称" align="center"  class-name="subscribe-quantity-cell" width="200">
        <template #default="scope">
          <el-link v-if="scope.row.fileName" style="" type="primary" @click="openFile(scope.row.filePath)">{{scope.row.fileName}}</el-link>
          <div style="width: 100%; height: 100%;display: flex; flex-direction: column;justify-content: center;align-items: center; ">
            <div
                v-for="(item, index) in scope.row.subscribeHazmats"
                :key="item.id"
                style="
              width: 100%;
              text-align: center;
              padding: 8px 0;
              border-bottom: 1px solid #ebeef5;"
                :style="{
                borderBottom: index === scope.row.subscribeHazmats.length - 1 ? 'none' : '1px solid #ebeef5'
                }"
            >
              <span>{{ item.hazmatName }}</span>
            </div>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="审批状态" prop="phone" align="center">
      <el-table-column label="申购数量" align="center" class-name="subscribe-quantity-cell">
        <template #default="scope">
          <span> {{scope.row.state == 0 ? '未审批' :scope.row.state == 1 ?'审批通过':scope.row.state == 2 ?'审批驳回':''}}</span><span></span>
          <div style="width: 100%; height: 100%;display: flex; flex-direction: column;justify-content: center;align-items: center; ">
            <div
                v-for="(item, index) in scope.row.subscribeHazmats"
                style="
            width: 100%;
            text-align: center;
            padding: 8px 0;
            border-bottom: 1px solid #ebeef5;"
                :style="{
              borderBottom: index === scope.row.subscribeHazmats.length - 1 ? 'none' : '1px solid #ebeef5'
            }"
            >
              {{ item.hazmatCount }}
            </div>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="申购人" prop="subscribePersonName" align="center"  />
      <el-table-column label="审批人" prop="checkName" align="center"/>
      <el-table-column label="申购文件" prop="fileName" align="center">
        <template #default="scope">
          <el-link v-if="scope.row.fileName" style="" type="primary" @click="openFile(scope.row.filePath)">{{scope.row.fileName}}</el-link>
          <span v-else></span>
        </template>
      </el-table-column>
      <el-table-column label="审批状态" prop="status" align="center">
        <template #default="scope">
          <span> {{scope.row.status == 0 ? '未审批' :scope.row.status == 1 ?'审批通过':scope.row.status == 2 ?'审批驳回':''}}</span><span></span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="200" >
@@ -98,6 +157,8 @@
import editDialog from "./components/editDialog.vue";
import {getUser} from "@/api/hazardousChemicals/user";
import {renderAsync} from "docx-preview";
import {delSubscribe, getSubscribeList} from "@/api/hazardousChemicals/subscribeApply";
import Cookies from "js-cookie";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const dialogRef = ref();
@@ -105,16 +166,12 @@
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    state: null,
    userId:null
    status: null,
    subscribePersonId:null,
    checkId:null
  },
  total: 0,
  dataList: [
    {
      id:1,
      state:2
    }
  ],
  dataList: [],
  stateOptions:[
    {
      id: 0,
@@ -130,7 +187,9 @@
    },
  ],
  peopleList:[],
  userName:''
  userName:'',
  userNameS:'',
  isAdmin:false
});
const { queryParams, total, dataList } = toRefs(data);
@@ -138,6 +197,10 @@
onMounted(()=>{
  getList()
  getPeopleList("")
  const userInfo= JSON.parse(Cookies.get('userInfo'))
  if(userInfo.userType === 0){
    data.isAdmin = true;
  }
})
onUnmounted(()=>{
@@ -146,13 +209,18 @@
const getList = async () => {
  loading.value = true
  // const res = await getCompany(data.queryParams)
  // if(res.code == 200){
  //   data.dataList = res.data.list
  //   data.total = res.data.total
  // }else{
  //   ElMessage.warning(res.message)
  // }
  getSubscribeList(data.queryParams).then((res)=>{
    if(res.code == 200){
      data.dataList = res.data.list
      data.total = res.data.total
    }else{
      ElMessage.warning(res.message)
    }
  }).catch(error => {
    loading.value = false
  })
  loading.value = false
}
@@ -165,10 +233,12 @@
  data.queryParams = {
    pageNum: 1,
    pageSize: 10,
    state: null,
    userId:null
    status: null,
    subscribePersonId:null,
    checkId:null
  }
  data.userName = ''
  data.userNameS = ''
  getList()
  getPeopleList("")
}
@@ -182,7 +252,7 @@
        type: 'warning',
      })
      .then( async() => {
        const res = await delCompany(val.id)
        const res = await delSubscribe(val.id)
        if(res.code == 200){
          ElMessage.success('数据删除成功')
          await getList()
@@ -194,11 +264,11 @@
const getPeopleList = async (val)=>{
  let queryParams = {}
  if(val != ""){
     queryParams = {
    queryParams = {
      name: val
    }
  }else {
     queryParams = {
    queryParams = {
      pageNum: 1,
      pageSize: 10
    }
@@ -212,14 +282,25 @@
}
const selectValue =  (val) => {
  if(!val){
    data.queryParams.userId = null
    data.queryParams.checkId = null
  }
  data.peopleList.forEach(item => {
    if(item.name === val){
      data.queryParams.userId = item.id
      data.queryParams.checkId = item.id
    }
  })
}
const selectValueS =  (val) => {
  if(!val){
    data.queryParams.subscribePersonId = null
  }
  data.peopleList.forEach(item => {
    if(item.name === val){
      data.queryParams.subscribePersonId = item.id
    }
  })
}
const openFile = async(path)=>{
  const ext = path.split('.').pop().toLowerCase();
  if (ext === 'doc' || ext === 'xls' || ext === 'xlsx' || ext === 'ppt' || ext === 'pptx') {
@@ -262,5 +343,10 @@
    }
  }
}
</script>
<style scoped>
/* 只对申购数量这一列生效 */
:deep(.subscribe-quantity-cell .cell) {
  padding: 0 !important; /* 关键:把默认的padding清零,优先级拉满 */
}
</style>