zzw
1 天以前 943b68c17b27f3b0f9973533f832c48dd6afbb6f
emergency-repair-web/src/views/system/ContractorManage.vue
@@ -3,52 +3,52 @@
    <div class="page-title">
      <div>
        <h2>承修单位管理</h2>
        <p>排序用于XCB助理审核时显示前7个常用承修单位</p>
        <p>数据来源:组织机构部门表(DEPT_TYPE = cj)</p>
      </div>
      <el-button type="primary" icon="el-icon-plus" @click="openCreate">新增承修单位</el-button>
    </div>
    <div class="toolbar">
      <el-input v-model="keyword" placeholder="名称 / 简称 / 联系人" clearable style="width:260px"></el-input>
      <el-button type="primary" icon="el-icon-search" @click="load">查询</el-button>
      <el-button icon="el-icon-refresh" @click="load">刷新</el-button>
    </div>
    <div class="toolbar">
      <el-input
        v-model="keyword"
        placeholder="名称 / 部门编码 / 负责人"
        clearable
        style="width:280px"
        @keyup.enter.native="load"
      ></el-input>
      <el-button type="primary" icon="el-icon-search" @click="load">查询</el-button>
      <div class="spacer"></div>
      <span class="summary">共 {{ filteredRows.length }} 个承修单位</span>
    </div>
    <div class="table-panel">
      <el-table :data="filteredRows" border stripe height="calc(100vh - 205px)">
      <el-table
        v-loading="loading"
        :data="filteredRows"
        border
        stripe
        height="calc(100vh - 245px)"
      >
        <el-table-column prop="sortNo" label="排序" width="80" align="center"></el-table-column>
        <el-table-column label="常用" width="80" align="center">
          <template slot-scope="{ $index }"><el-tag v-if="$index < 7" size="mini" type="success">前7</el-tag><span v-else>-</span></template>
          <template slot-scope="{ $index }">
            <el-tag v-if="$index < 7" size="mini" type="success">前7</el-tag>
            <span v-else>-</span>
          </template>
        </el-table-column>
        <el-table-column prop="name" label="名称" min-width="220"></el-table-column>
        <el-table-column prop="shortName" label="简称" width="150"></el-table-column>
        <el-table-column prop="nature" label="单位性质" width="130"></el-table-column>
        <el-table-column prop="contact" label="联系人" width="120"></el-table-column>
        <el-table-column prop="dishonest" label="是否失信单位" width="130">
          <template slot-scope="{ row }"><el-tag size="mini" :type="row.dishonest === 1 ? 'danger' : 'success'">{{ row.dishonest === 1 ? '是' : '否' }}</el-tag></template>
        </el-table-column>
        <el-table-column prop="remark" label="备注" min-width="180" show-overflow-tooltip></el-table-column>
        <el-table-column label="操作" width="130" fixed="right">
        <el-table-column prop="name" label="名称" min-width="240" show-overflow-tooltip></el-table-column>
        <el-table-column prop="deptCode" label="部门编码" width="160"></el-table-column>
        <el-table-column prop="contact" label="负责人" width="120"></el-table-column>
        <el-table-column prop="phone" label="联系电话" width="160"></el-table-column>
        <el-table-column label="状态" width="100" align="center">
          <template slot-scope="{ row }">
            <el-button type="text" @click="openEdit(row)">编辑</el-button>
            <el-button type="text" class="danger-link" @click="remove(row)">删除</el-button>
            <el-tag size="mini" :type="row.status === '1' ? 'info' : 'success'">
              {{ row.status === '1' ? '停用' : '正常' }}
            </el-tag>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <el-dialog :title="form.id ? '编辑承修单位' : '新增承修单位'" :visible.sync="dialogVisible" width="620px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="110px">
        <el-form-item label="名称" prop="name"><el-input v-model="form.name"></el-input></el-form-item>
        <el-form-item label="简称" prop="shortName"><el-input v-model="form.shortName"></el-input></el-form-item>
        <el-form-item label="单位性质"><el-select v-model="form.nature" style="width:100%"><el-option v-for="item in natures" :key="item" :label="item" :value="item"></el-option></el-select></el-form-item>
        <el-form-item label="排序"><el-input-number v-model="form.sortNo" :min="1" style="width:180px"></el-input-number></el-form-item>
        <el-form-item label="联系人"><el-input v-model="form.contact"></el-input></el-form-item>
        <el-form-item label="是否失信单位"><el-switch v-model="form.dishonest" :active-value="1" :inactive-value="0"></el-switch></el-form-item>
        <el-form-item label="备注"><el-input v-model="form.remark" type="textarea" :rows="3"></el-input></el-form-item>
      </el-form>
      <template slot="footer"><el-button @click="dialogVisible = false">取消</el-button><el-button type="primary" :loading="saving" @click="save">保存</el-button></template>
    </el-dialog>
  </div>
</template>
<script>
@@ -57,42 +57,37 @@
  name: 'ContractorManage',
  data() {
    return {
      rows: [], keyword: '', dialogVisible: false, saving: false,
      natures: ['厂家', '服务商', '综合单位', 'T队', '其他'],
      form: {},
      rules: {
        name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
        shortName: [{ required: true, message: '请输入简称', trigger: 'blur' }]
      }
      loading: false,
      rows: [],
      keyword: ''
    }
  },
  computed: {
    filteredRows() {
      if (!this.keyword) return this.rows
      const text = this.keyword.toLowerCase()
      return this.rows.filter(item => [item.name, item.shortName, item.contact].some(value => String(value || '').toLowerCase().includes(text)))
      const keyword = this.keyword.trim().toLowerCase()
      if (!keyword) return this.rows
      return this.rows.filter(item => [item.name, item.deptCode, item.contact]
        .some(value => String(value || '').toLowerCase().includes(keyword)))
    }
  },
  created() { this.load() },
  created() {
    this.load()
  },
  methods: {
    load() { api.get('/system/contractors').then(res => { this.rows = res.data || [] }) },
    blank() { return { name: '', shortName: '', nature: '厂家', sortNo: this.rows.length + 1, contact: '', dishonest: 0, remark: '' } },
    openCreate() { this.form = this.blank(); this.dialogVisible = true },
    openEdit(row) { this.form = { ...row }; this.dialogVisible = true },
    save() {
      this.$refs.form.validate(valid => {
        if (!valid) return
        this.saving = true
        const request = this.form.id ? api.put('/system/contractors/' + this.form.id, this.form) : api.post('/system/contractors', this.form)
        request.then(() => { this.$message.success('保存成功'); this.dialogVisible = false; this.load() }).finally(() => { this.saving = false })
    load() {
      this.loading = true
      api.get('/system/contractors').then(res => {
        this.rows = res.data || []
      }).finally(() => {
        this.loading = false
      })
    },
    remove(row) {
      this.$confirm(`确定删除“${row.name}”吗?`, '删除确认', { type: 'warning' }).then(() => api.delete('/system/contractors/' + row.id)).then(() => {
        this.$message.success('删除成功'); this.load()
      }).catch(() => {})
    }
  }
}
</script>
<style scoped>.danger-link { color: #d9534f; }</style>
<style scoped>
.summary {
  color: #6d7f91;
  font-size: 13px;
}
</style>