zhaoshangyinzi/ruoyi-ui/src/views/management/info/index.vue

<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
     <!-- <el-form-item label="填报单位" prop="deptName">
        <el-input v-model="queryParams.deptName" placeholder="请输入填报单位" clearable size="small" @keyup.enter.native="handleQuery" />
      </el-form-item> -->
      <el-form-item label="项目名称" prop="name">
        <el-input v-model="queryParams.name" placeholder="请输入项目名称" clearable size="small" @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="填报单位" prop="name">
        <el-input v-model="queryParams.deptName" placeholder="请输入填报单位" clearable size="small" @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="填报日期" prop="addtime">
        <el-date-picker value-format="yyyy-MM-dd" @change="tiemsChange" v-model="times" type="daterange"
          range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="状态" prop="projectStatus">
        <el-select v-model="queryParams.projectStatus" placeholder="请选择状态" clearable size="small">
          <el-option v-for="dict in statusOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
        </el-select>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain style="background-color: #1C84C6;color: #fff;border: none;" size="mini" @click="handleAdd"
          v-hasPermi="['bmProject:project:add']">添加线索</el-button>
      </el-col>
      <!-- <el-col :span="1.5">
        <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
          v-hasPermi="['projectInfo:info:edit']">修改</el-button>
      </el-col> -->
      <el-col :span="1.5">
        <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
          v-hasPermi="['bmProject:project:remove']">销号</el-button>
      </el-col>
      <!-- <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['projectInfo:info:export']"
        >导出</el-button>
      </el-col> -->
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>
    <el-table v-loading="loading" :data="infoList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="项目名称" align="center" prop="name" />
      <el-table-column label="总投资金额(万)" align="center" prop="totAmt" />
      <el-table-column label="填报单位" align="center" prop="deptName" />
      <el-table-column label="审核情况" align="center">
        <template slot-scope="scope">
          <div v-html="scope.row.remark"></div>
        </template>
      </el-table-column>
      <el-table-column label="状态" align="center" prop="dictLabel" />
      <el-table-column label="填报日期" width="180" align="center" prop="createTime" />
      <el-table-column label="操作" width="280" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button size="mini" type="text" style="background: #0669B2;color: #FFF;padding: 7px;" v-hasPermi="['bmProject:project:query']"
            @click="chei(scope.row)">查看和编辑</el-button>
            <el-button size="mini" type="text" style="background: #00B034;color: #FFF;padding: 7px;" v-hasPermi="['bmProject:project:pass']" v-if="scope.row.projectStatus%2==0"
              @click="getPass(scope.row)">审核</el-button>
          <el-button size="mini" type="text" style="background: #3FBCEF;color: #FFF;padding: 7px;" v-hasPermi="['bmProject:project:examine']"
            @click="infoBtn(scope.row)" v-if="scope.row.projectStatus%2==1">提交</el-button>
            <el-button size="mini" type="text" style="background: #3FBCEF;color: #FFF;padding: 7px;" v-hasPermi="['bmProject:project:reject']"
              @click="infoBtn(scope.row)" v-if="scope.row.projectStatus%2==0">驳回</el-button>
          <!-- <el-button size="mini" type="text" style="background: #F5A40C;color: #FFF;padding: 7px;" v-hasPermi="['bmProject:project:edit']">修改</el-button> -->
          <el-button size="mini" type="text" style="background: #DE1939;color: #FFF;padding: 7px;" @click="handleDelete(scope.row)"
            v-hasPermi="['bmProject:project:remove']">销号</el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />
    <el-dialog :close-on-click-modal="false" title="添加线索" :visible.sync="flags" append-to-body>
      <el-form ref="forms" :model="xs_form" :rules="xs_rules" label-width="100px">
        <el-form-item label="名称:" prop="name">
          <el-input v-model="xs_form.name" placeholder="请输入项目名称" />
        </el-form-item>
        <el-form-item label="产品类别:" prop="industryCategory">
          <el-checkbox-group v-model="xs_form.industryCategory">
            <el-checkbox label="首位产业" name="type"></el-checkbox>
            <el-checkbox label="战略新兴" name="type"></el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="所属行业:" prop="industry">
            <el-row>
              <el-col :span="4" style="font-weight: bold;">
                工业项目
              </el-col>
              <el-col :span="20">
              <el-radio-group v-model="xs_form.industry">
               <el-radio :label="item.dictValue" v-for="(item,index) in industryOptions.filter(res => {
                 if(res.dictValue.substring(0,1) == '1'){
                   return res
                 }
               })" :key="index">
                  {{item.dictLabel}}
                </el-radio>
              </el-radio-group>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="4" style="font-weight: bold;">
                服务业项目
              </el-col>
              <el-col :span="20">
              <el-radio-group v-model="xs_form.industry">
               <el-radio :label="item.dictValue" v-for="(item,index) in industryOptions.filter(res => {
                 if(res.dictValue.substring(0,1) == '2'){
                   return res
                 }
               })" :key="index">
                  {{item.dictLabel}}
                </el-radio>
              </el-radio-group>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="4" style="font-weight: bold;">
                总部经济项目
              </el-col>
              <el-col :span="20">
              <el-radio-group v-model="xs_form.industry">
               <el-radio :label="item.dictValue" v-for="(item,index) in industryOptions.filter(res => {
                 if(res.dictValue.substring(0,1) == '3'){
                   return res
                 }
               })" :key="index">
                  {{item.dictLabel}}
                </el-radio>
              </el-radio-group>
              </el-col>
            </el-row>

        </el-form-item>
        <el-form-item label="是否返乡:" prop="isBackbussiness">
          <el-select v-model="xs_form.isBackbussiness" placeholder="请选择状态" clearable size="small">
            <el-option label="是" value="Y" />
            <el-option label="否" value="N" />
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="xs_submit">确 定</el-button>
        <el-button @click="flags=false">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 添加或修改项目-线索信息对话框 -->
    <el-dialog :close-on-click-modal="false" :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="项目id*" prop="bmProjectId">
          <el-input v-model="form.bmProjectId" placeholder="请输入项目id*" />
        </el-form-item>
        <el-form-item label="项目名称*" prop="name">
          <el-input v-model="form.name" placeholder="请输入项目名称*" />
        </el-form-item>
        <el-form-item label="是否删除(0未删除、1已删除)" prop="isDel">
          <el-input v-model="form.isDel" placeholder="请输入是否删除(0未删除、1已删除)" />
        </el-form-item>
        <el-form-item label="投资方联系人*" prop="contactor">
          <el-input v-model="form.contactor" placeholder="请输入投资方联系人*" />
        </el-form-item>
        <el-form-item label="投资方联系方式*" prop="phone">
          <el-input v-model="form.phone" placeholder="请输入投资方联系方式*" />
        </el-form-item>
        <el-form-item label="预计投资额*" prop="needAmt">
          <el-input v-model="form.needAmt" placeholder="请输入预计投资额*" />
        </el-form-item>
        <el-form-item label="固定资产投资*" prop="fixedAssets">
          <el-input v-model="form.fixedAssets" placeholder="请输入固定资产投资*" />
        </el-form-item>
        <el-form-item label="产品名称*" prop="productName">
          <el-input v-model="form.productName" placeholder="请输入产品名称*" />
        </el-form-item>
        <el-form-item label="设计产能*" prop="productQty">
          <el-input v-model="form.productQty" placeholder="请输入设计产能*" />
        </el-form-item>
        <el-form-item label="预计产值*" prop="productPrice">
          <el-input v-model="form.productPrice" placeholder="请输入预计产值*" />
        </el-form-item>
        <el-form-item label="预计税收*" prop="productTax">
          <el-input v-model="form.productTax" placeholder="请输入预计税收*" />
        </el-form-item>
        <el-form-item label="预计用工*" prop="productEmp">
          <el-input v-model="form.productEmp" placeholder="请输入预计用工*" />
        </el-form-item>
        <el-form-item label="项目计划用地" prop="plannedLand">
          <el-input v-model="form.plannedLand" placeholder="请输入项目计划用地" />
        </el-form-item>
        <el-form-item label="独立供地" prop="independentLand">
          <el-input v-model="form.independentLand" placeholder="请输入独立供地" />
        </el-form-item>
        <el-form-item label="流转土地" prop="circulationLan">
          <el-input v-model="form.circulationLan" placeholder="请输入流转土地" />
        </el-form-item>
        <el-form-item label="计划租赁用房" prop="needRoom">
          <el-input v-model="form.needRoom" placeholder="请输入计划租赁用房" />
        </el-form-item>
        <el-form-item label="计划租赁厂房" prop="needFactoryRoom">
          <el-input v-model="form.needFactoryRoom" placeholder="请输入计划租赁厂房" />
        </el-form-item>
        <el-form-item label="计划租赁办公生活用房" prop="needBusRoom">
          <el-input v-model="form.needBusRoom" placeholder="请输入计划租赁办公生活用房" />
        </el-form-item>
        <el-form-item label="其他需求" prop="other">
          <el-input v-model="form.other" placeholder="请输入其他需求" />
        </el-form-item>
        <el-form-item label="拟落户地点*" prop="address">
          <el-input v-model="form.address" placeholder="请输入拟落户地点*" />
        </el-form-item>
        <el-form-item label="是否签订框架协议* Y/N" prop="isFrameorder">
          <el-input v-model="form.isFrameorder" placeholder="请输入是否签订框架协议* Y/N" />
        </el-form-item>
        <el-form-item label="框架协议附件url(框架协议为是，需要上传)" prop="attachment">
          <el-input v-model="form.attachment" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="备注" prop="description">
          <el-input v-model="form.description" type="textarea" placeholder="请输入内容" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import {
    setReject,
    setExamine,
    listInfo,
    getInfo,
    delInfo,
    addInfo,
    updateInfo,
    listProject,
    setPass,
    exportInfo
  } from "@/api/projectInfo/info";
  import { listDept } from '@/api/system/dept'
  let vm = ''

  export default {
    name: "Info",
    components: {},
    data() {
      vm = this
      return {
        xs_form: {
          industryCategory: []
        },
        flags: false,
        xs_rules: {
          name: [{
            required: true,
            message: "名称不能为空",
            trigger: "blur"
          }],
          industryCategory: [{
            required: true,
            message: "请选择产品类别",
            trigger: "blur"
          }],
          industry: [{
            required: true,
            message: "请选择所属行业",
            trigger: "blur"
          }],
          isBackbussiness: [{
            required: true,
            message: "状态不能为空",
            trigger: "blur"
          }],
        },
        times: '',
        industryOptions: [],
        statusOptions: [],
        // 遮罩层
        loading: true,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 项目-线索信息表格数据
        infoList: [],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          bmProjectId: null,
          name: null,
          isDel: null,
          contactor: null,
          phone: null,
          needAmt: null,
          fixedAssets: null,
          productName: null,
          productQty: null,
          productPrice: null,
          productTax: null,
          productEmp: null,
          plannedLand: null,
          independentLand: null,
          circulationLan: null,
          needRoom: null,
          needFactoryRoom: null,
          needBusRoom: null,
          other: null,
          address: null,
          isFrameorder: null,
          attachment: null,
          description: null,
          deptName: undefined,
          deptList: []
        },
        // 表单参数
        form: {},
        // 表单校验
        rules: {}
      };
    },
    created() {
      this.getDicts('project_status').then(res => {
        this.statusOptions = res.data
      })
      this.getDicts('project_industry').then(res => {
        this.industryOptions = res.data
      })
      this.getList();
    },
    filters: {
      dictStatus(e) {
        let is = ''
        for (let item of vm.statusOptions) {
          if (e == item.dictValue) {
            is = item.dictLabel
          }
        }
        return is
      }
    },
    methods: {
      getPass(row) {
        const _this = this
        this.$confirm('是否提交通过', "提醒", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return setPass({
          code: 3,
          bmProjectId: row.id,
        })
        }).then(() => {
          _this.getList();
          _this.msgSuccess("提交成功");
        })
      },
      infoBtn(scrop) {
        const _this = this
        if (scrop.projectStatus % 2 == 1) {
          this.$confirm('是否确认提交审核', "提醒", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return setExamine({
              code: 1,
              bmProjectId: scrop.id
            });
          }).then(() => {
            _this.getList();
            _this.msgSuccess("提交成功");
          })
        } else {
          this.$prompt("请输入驳回意见", "提醒", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
            .then(function({ value }) {
              return setReject({
                code: 2,
                bmProjectId: scrop.id,
                remark:value
              });
            })
            .then(({ value }) => {
              _this.msgSuccess("驳回成功");
              _this.getList();
            });
        }
      },
      xs_submit() {
        this.$refs["forms"].validate(valid => {
          if (valid) {
            let data = JSON.parse(JSON.stringify(this.xs_form))
            data.industryCategory = data.industryCategory.join(',')
            listProject(data).then(res => {
              this.msgSuccess("添加成功");
              this.flags = false;
              this.getList();
              this.chei(res.data)

            })
          }
        });
      },
      tiemsChange(e) {
        console.log(e, this.times)
        if (this.times) {
          this.queryParams.beginTime = this.times[0]
          this.queryParams.endTime = this.times[1]
        } else {
          this.queryParams.beginTime = ''
          this.queryParams.endTime = ''
        }

      },
      /** 查询项目-线索信息列表 */
      getList() {
        this.loading = true;
        listInfo(this.queryParams).then(response => {
          this.infoList = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
      },
      // 表单重置
      reset() {
        this.form = {
          id: null,
          bmProjectId: null,
          createBy: null,
          createTime: null,
          updateBy: null,
          updateTime: null,
          name: null,
          isDel: null,
          contactor: null,
          phone: null,
          needAmt: null,
          fixedAssets: null,
          productName: null,
          productQty: null,
          productPrice: null,
          productTax: null,
          productEmp: null,
          plannedLand: null,
          independentLand: null,
          circulationLan: null,
          needRoom: null,
          needFactoryRoom: null,
          needBusRoom: null,
          other: null,
          address: null,
          isFrameorder: null,
          attachment: null,
          description: null,
          deptName: undefined,
          deptList: []
        };
        this.resetForm("form");
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        listDept(this.queryParams).then(response => {
          if (response.data.length  !== 0){
            for (var i = 0; i < response.data.length; i++) {
              this.queryParams.deptList.push(response.data[i].deptId)
            }
          }
        });
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.id)
        this.single = selection.length !== 1
        this.multiple = !selection.length
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.reset();
        this.flags = true;
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        this.reset();
        const id = row.id || this.ids
        getInfo(id).then(response => {
          this.form = response.data;
          this.open = true;
          this.title = "修改项目-线索信息";
        });
      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            if (this.form.id != null) {
              updateInfo(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.open = false;
                this.getList();
              });
            } else {
              addInfo(this.form).then(response => {
                this.msgSuccess("新增成功");
                this.open = false;
                this.getList();

              });
            }
          }
        });
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const ids = row.id || this.ids;
        this.$confirm('是否确认删除项目-线索信息"' + (row.name||this.ids) + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return delInfo(ids);
        }).then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        })
      },
      /** 导出按钮操作 */
      handleExport() {
        const queryParams = this.queryParams;
        this.$confirm('是否确认导出所有项目-线索信息数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return exportInfo(queryParams);
        }).then(response => {
          this.download(response.msg);
        })
      },
      //查看
      chei(row) {
        this.$router.push({
          path: '/management/row/index',
          query: {
            setid: row.id,
            setrd: row.projectStatus
          },
        })
      }
    }
  };
</script>
<style lang="scss" scoped>
  .lab_box{
  }
</style>