工时管理30%

spring

2025-02-15 74da5f0d434681ca8e9090e242e7fd29c144ebcb

 src/views/system/customer/index.vue

@@ -2,318 +2,253 @@
  <div class="app-container">
    <div class="search">
      <div>
        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
          <el-form-item label="状态" prop="state">
            <el-input size="small" placeholder="请输入" clearable v-model="queryParams.company"
                      @keyup.enter.native="refreshTable()"></el-input>
        <el-form
          :model="queryParams"
          ref="queryForm"
          size="small"
          :inline="true"
        >
          <el-form-item label="客户名称" prop="company">
            <el-input
              size="small"
              placeholder="请输入"
              clearable
              v-model="queryParams.company"
              @keyup.enter.native="getList"
            ></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="el-icon-search" size="mini" @click="refreshTable">查 询</el-button>
            <el-button icon="el-icon-refresh" size="mini" @click="refresh">重 置</el-button>
            <el-button
              type="primary"
              icon="el-icon-search"
              size="mini"
              @click="getList"
              >查 询</el-button
            >
            <el-button icon="el-icon-refresh" size="mini" @click="refresh"
              >重 置</el-button
            >
          </el-form-item>
        </el-form>
      </div>
      <div>
        <el-button size="small" type="primary" @click="addDia = true" v-if="addPower" icon="el-icon-plus">新增</el-button>
        <el-button
          size="small"
          type="primary"
          @click="openFormDia('add')"
          icon="el-icon-plus"
          >新增</el-button
        >
      </div>
    </div>
<!--    <div class="table">-->
<!--      <ValueTable ref="ValueTable" :url="$api.user.selectCustomPageList" :delUrl="$api.user.delCustomById"-->
<!--                  :componentData="componentData" :key="upIndex" :upUrl="$api.user.upCustom"/>-->
<!--    </div>-->
    <el-dialog title="新增客户" :visible.sync="addDia" width="450px">
      <div style="margin-bottom: 15px;">
        <el-row style="line-height: 50px;">
          <el-col :span="7" style="text-align: right;padding-right: 8px;"><span class="required-span">*
                  </span>客户名称：</el-col>
          <el-col :span="15">
            <el-input v-model="user.company" size="small" clearable></el-input>
          </el-col>
        </el-row>
        <el-row style="line-height: 50px;">
          <el-col :span="7" style="text-align: right;padding-right: 8px;"><span class="required-span">*
                  </span>客户单位EN：</el-col>
          <el-col :span="15">
            <el-input v-model="user.companyEn" size="small" clearable></el-input>
          </el-col>
        </el-row>
        <el-row style="margin-top: 15px;">
          <el-col :span="7" style="text-align: right;padding-right: 8px;"><span class="required-span">*
                  </span>单位地址：</el-col>
          <el-col :span="15">
            <el-input type="textarea" v-model="user.address" size="small" clearable
                      :autosize="{minRows: 2, maxRows: 4}"></el-input>
          </el-col>
        </el-row>
        <el-row style="margin-top: 15px;">
          <el-col :span="7" style="text-align: right;padding-right: 8px;"><span class="required-span">*
                  </span>客户地址EN：</el-col>
          <el-col :span="15">
            <el-input type="textarea" v-model="user.addressEn" size="small" clearable
                      :autosize="{minRows: 2, maxRows: 4}"></el-input>
          </el-col>
        </el-row>
        <el-row style="line-height: 50px;">
          <el-col :span="7" style="text-align: right;padding-right: 8px;"><span class="required-span">*
              </span>加急额度：</el-col>
          <el-col :span="15">
            <el-input v-model="user.num" size="small" clearable></el-input>
          </el-col>
        </el-row>
        <el-row style="line-height: 50px;">
          <el-col :span="7" style="text-align: right;padding-right: 8px;">单位电话：</el-col>
          <el-col :span="15">
            <el-input v-model="user.phone" size="small" clearable></el-input>
          </el-col>
        </el-row>
        <el-row style="line-height: 50px;">
          <el-col :span="7" style="text-align: right;padding-right: 8px;">工厂域：</el-col>
          <el-col :span="15">
            <el-input v-model="user.code" size="small" clearable></el-input>
          </el-col>
        </el-row>
        <el-row style="line-height: 50px;">
          <el-col :span="7" style="text-align: right;padding-right: 8px;"><span class="required-span">*
              </span>客户编号：</el-col>
          <el-col :span="15">
            <el-input v-model="user.code2" size="small" clearable></el-input>
          </el-col>
        </el-row>
      </div>
    <div>
      <lims-table
        :tableData="tableData"
        :column="column"
        :page="page"
        :tableLoading="tableLoading"
      ></lims-table>
    </div>
    <el-dialog :title="formTitle" :visible.sync="addDia" width="450px">
      <el-form
        ref="userForm"
        :model="user"
        :rules="userRules"
        label-position="right"
        label-width="100px"
      >
        <el-form-item label="客户名称" prop="company">
          <el-input v-model="user.company" size="small" clearable></el-input>
        </el-form-item>
        <el-form-item label="客户单位EN" prop="companyEn">
          <el-input v-model="user.companyEn" size="small" clearable></el-input>
        </el-form-item>
        <el-form-item label="单位地址" prop="address">
          <el-input
            type="textarea"
            v-model="user.address"
            size="small"
            clearable
            :autosize="{ minRows: 2, maxRows: 4 }"
          ></el-input>
        </el-form-item>
        <el-form-item label="单位地址EN" prop="addressEn">
          <el-input
            type="textarea"
            v-model="user.addressEn"
            size="small"
            clearable
            :autosize="{ minRows: 2, maxRows: 4 }"
          ></el-input>
        </el-form-item>
        <el-form-item label="单位电话" prop="phone">
          <el-input v-model="user.phone" size="small" clearable></el-input>
        </el-form-item>
        <el-form-item label="加急额度" prop="num">
          <el-input v-model="user.num" size="small" clearable></el-input>
        </el-form-item>
        <el-form-item label="客户编号" prop="code2">
          <el-input v-model="user.code2" size="small" clearable></el-input>
        </el-form-item>
        <el-form-item label="工厂域" prop="code">
          <el-input v-model="user.code" size="small" clearable></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
            <el-button @click="addDia = false">取 消</el-button>
            <el-button type="primary" @click="customAdd" :loading="loading">确 定</el-button>
         </span>
    </el-dialog>
    <el-dialog title="选择用户" :visible.sync="selectUserDia" width="70%">
      <div class="search" style="height: 35px; margin-bottom: 9px;">
        <div class="search_thing">
          <div class="search_label">用户名：</div>
          <div class="search_input"><el-input size="small" placeholder="请输入" clearable
                                              v-model="componentData2.entity.name" @keyup.enter.native="$refs.ValueTable2.selectList()"></el-input></div>
        </div>
      </div>
<!--      <div class="body" style="height: 60vh;" v-if="selectUserDia">-->
<!--        <ValueTable ref="ValueTable2" :url="$api.user.selectUserList" :componentData="componentData2" />-->
<!--      </div>-->
      <span slot="footer" class="dialog-footer">
            <el-button @click="selectUserDia = false">取 消</el-button>
            <el-button type="primary" @click="selectUser">确 定</el-button>
         </span>
        <el-button @click="reset">取 消</el-button>
        <el-button type="primary" @click="customAdd" :loading="loading"
          >确 定</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
import ValueTable from '@/components/Table/value-table.vue'
import limsTable from "@/components/Table/lims-table.vue";
import {
  addCustom,
  selectCustomPageList,
  upCustom,
} from "@/api/system/customer";
export default {
  components: {
    ValueTable
    limsTable,
  },
  data() {
    return {
      queryParams: {
        company: ''
        company: "",
      },
      componentData: {
        entity: {
          company: null,
          orderBy: {
            field: 'id',
            order: 'asc'
          }
      tableData: [],
      column: [
        { label: "客户名称", prop: "company" },
        { label: "客户单位EN", prop: "companyEn" },
        { label: "单位地址", prop: "address" },
        { label: "单位地址EN", prop: "addressEn" },
        { label: "单位电话", prop: "phone" },
        { label: "加急额度", prop: "num" },
        { label: "客户编号", prop: "code2" },
        { label: "工厂域", prop: "code" },
        {
          dataType: "action",
          fixed: "right",
          label: "操作",
          operation: [
            {
              name: "编辑",
              type: "text",
              clickFun: (row) => {
                this.openFormDia("edit", row);
              },
            },
          ],
        },
        isIndex: true,
        showSelect: false,
        select: false,
        do: [{
          font: '委托记录',
          type: 'text',
          method: 'entrust'
        }, {
          font: '协议记录',
          type: 'text',
          method: 'protocol'
        },{
          id: 'update',
          font: '编辑',
          type: 'text',
          method: 'doDiy',
          field:[]
        },{
          id: 'delete',
          font: '删除',
          type: 'text',
          method: 'doDiy'
        }],
        tagField: {
          state: {
            select: [{
              value: 1,
              type: 'success',
              label: '启用'
            }, {
              value: 0,
              type: 'danger',
              label: '停用'
            }]
          }
        },
        selectField: {
          state: {
            select: [{
              value: 1,
              type: 'success',
              label: '启用'
            }, {
              value: 0,
              type: 'danger',
              label: '停用'
            }]
          }
        },
        requiredAdd: [],
        requiredUp: ['company','address','code2','companyEn','addressEn','num']
      ],
      page: {
        total: 0,
        size: 10,
        current: 0,
      },
      entityCopy: {},
      upIndex: 0,
      tableLoading: false,
      // 编辑客户弹框
      operationType: "",
      formTitle: "",
      addDia: false,
      addPower: true,
      user: {
        name: null
      user: {},
      userRules: {
        company: [
          { required: true, message: "请输入客户名称", trigger: "blur" },
        ],
        companyEn: [
          { required: true, message: "请输入客户名称EN", trigger: "blur" },
        ],
        address: [
          { required: true, message: "请输入单位地址", trigger: "blur" },
        ],
        addressEn: [
          { required: true, message: "请输单位地址EN", trigger: "blur" },
        ],
        num: [{ required: true, message: "请输入加急额度", trigger: "blur" }],
        code2: [{ required: true, message: "请输入客户编号", trigger: "blur" }],
      },
      selectUserDia: false,
      loading: false,
      componentData2: {
        entity: {
          isCustom: 0,
          orderBy: {
            field: 'id',
            order: 'asc'
          }
        },
        isIndex: true,
        showSelect: true,
        select: false,
        do: [],
        tagField: {
          state: {
            select: [{
              value: 1,
              type: 'success',
              label: '启用'
            }, {
              value: 0,
              type: 'danger',
              label: '停用'
            }]
          }
        },
        selectField: {},
        needSort: ['company'],
      }
    }
      //
    };
  },
  mounted() {
    this.entityCopy = this.HaveJson(this.componentData.entity)
    this.getPower()
    this.getList();
  },
  methods: {
    refreshTable() {
      this.$refs['ValueTable'].selectList()
    // 查询客户列表
    getList() {
      this.tableLoading = true;
      selectCustomPageList({ ...this.queryParams, ...this.page })
        .then((res) => {
          this.tableLoading = false;
          if (res.code === 200) {
            this.tableData = res.data;
            this.page.total = res.total;
          }
        })
        .catch((err) => {
          this.tableLoading = false;
        });
    },
    // 重置table
    refresh() {
      this.componentData.entity = this.HaveJson(this.entityCopy)
      this.upIndex++
      this.queryParams.company = "";
      this.getList();
    },
    openFormDia(type, row) {
      this.addDia = true;
      this.formTitle = type === "add" ? "新增客户" : "编辑客户";
      this.operationType = type;
    },
    customAdd() {
      if (this.user.company == '' || this.user.company == null) {
        this.$message.error('请填写客户单位')
        return
      }
      if (this.user.address == '' || this.user.address == null) {
        this.$message.error('请填写单位地址')
        return
      }
      if (this.user.companyEn == '' || this.user.companyEn == null) {
        this.$message.error('请填写英文客户单位')
        return
      }
      if (this.user.addressEn == '' || this.user.addressEn == null) {
        this.$message.error('请填写英文单位地址')
        return
      }
      if (this.user.code2 == '' || this.user.code2 == null) {
        this.$message.error('请填写客户编号')
        return
      }
      if (this.user.code2 == '' || this.user.code2 == null) {
        this.$message.error('请填写加急额度')
        return
      }
      this.loading = true
      this.$axios.post(this.$api.user.addCustom, this.user, {
        headers: {
          'Content-Type': 'application/json'
      this.$refs["userForm"].validate((valid) => {
        if (valid) {
          this.loading = true;
          if (this.operationType === "add") {
            addCustom(this.user)
              .then((res) => {
                this.loading = false;
                if (res.code !== 200) return;
                this.$message.success("新增成功");
                this.getList();
                this.reset();
              })
              .catch((err) => {
                this.loading = false;
              });
          } else {
            upCustom(this.user)
              .then((res) => {
                this.loading = false;
                if (res.code !== 200) return;
                this.$message.success("修改成功");
                this.getList();
                this.reset();
              })
              .catch((err) => {
                this.loading = false;
              });
          }
        }
      }).then(res => {
        if (res.code == 201) return
        this.$message.success('添加成功')
        this.refreshTable()
        this.loading = false
        this.addDia = false
      })
      });
    },
    // 权限分配
    getPower() {
      let power = JSON.parse(sessionStorage.getItem('power'))
      let up = false
      let del = false
      let add = false
      for (var i = 0; i < power.length; i++) {
        if (power[i].menuMethod == 'delCustomById') {
          del = true
        }
        if (power[i].menuMethod == 'addCustom') {
          add = true
        }
        if (power[i].menuMethod == 'upCustom') {
          up = true
        }
      }
      if (!del) {
        this.componentData.do.splice(3, 1)
      }
      if (!up) {
        this.componentData.do.splice(2, 1)
      }
      this.addPower = add
    reset() {
      this.addDia = false;
      this.resetForm("userForm");
    },
    entrust(data) {

    },
    protocol(data) {

    },
    selectUser() {
      let selects = this.$refs.ValueTable2.multipleSelection
      if (selects.length == 0) {
        this.$message.error('未选择数据')
        return
      }
      delete selects['orderBy']
      delete selects['updateUser']
      delete selects['updateTime']
      this.user = selects
      this.selectUserDia = false
    }
  }
}
  },
};
</script>

<style scoped>
.search {
  height: 80px;
  height: 46px;
  display: flex;
  justify-content: space-between;
}