前端提交wm

ruoyi-ui/src/views/management/row/index.vue

@@ -0,0 +1,489 @@
+<template>
+
+  <div class="app-container">
+    <div class="header">
+      项目详情 >
+    </div>
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          @click="handleAdd"
+          v-hasPermi="['system:config:add']"
+        >提交</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          @click="handleUpdate"
+          v-hasPermi="['system:config:edit']"
+        >暂存</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+  <div class="naue">
+    <!-- //步骤条 -->
+    <div class="nuae_wtu">
+      <div class="naue_one">
+       <p class="naue_name">项目名称：电子类企业</p>
+       <p>返乡创业：是</p>
+       <p>所属产业：电子产业</p>
+      </div>
+      <div class="naue_two">
+        <el-steps :active="naueactive" align-center finish-status="success">
+          <el-step title="线索审核中"></el-step>
+          <el-step title="线索审核成功"></el-step>
+          <el-step title="签约审核成功"></el-step>
+          <el-step title="在建审核成功"></el-step>
+          <el-step title="结束"></el-step>
+        </el-steps>
+      </div>
+    </div>
+    <!-- //tab栏 -->
+    <div class="naue_tab">
+     <p @click="tabClid(index)" v-for="(item,index) in tabNume"  :key="index" :class="[tab == index? 'p' : '']">{{item}}</p>
+    </div>
+    <!-- 内容的显示隐藏 -->
+     <div class="mation" v-if="true">
+       <div class="nvestor">
+         <p>投资方 <i>*</i></p>
+       </div>
+       <p class="enterprise">企业</p>
+       <p class="enterprise_tw"><i class="el-icon-circle-plus-outline"></i>添加企业</p>
+       <el-table v-loading="loading" :data="configList" >
+         <!-- <el-table-column type="selection" width="55" align="center" /> -->
+         <el-table-column label="企业名称" align="center" prop="configId" />
+         <el-table-column label="企业所在地" align="center" prop="configName" :show-overflow-tooltip="true" />
+         <el-table-column label="法人代表姓名" align="center" prop="configKey" :show-overflow-tooltip="true" />
+         <el-table-column label="统一社会信用代码" align="center" prop="configValue" />
+         <el-table-column label="联系方式" align="center" prop="configType" :formatter="typeFormat" />
+        <!-- <el-table-column label="操作" align="center" prop="remark" :show-overflow-tooltip="true" /> -->
+         <el-table-column label="操作" align="center" >
+           <!-- class-name="small-padding fixed-width" -->
+           <template slot-scope="scope">
+             <el-button
+               size="mini"
+               type="warning"
+               @click="handleUpdate(scope.row)"
+               v-hasPermi="['system:config:edit']"
+             >修改</el-button>
+             <el-button
+               size="mini"
+               type="danger"
+               @click="handleDelete(scope.row)"
+               v-hasPermi="['system:config:remove']"
+             >删除</el-button>
+           </template>
+         </el-table-column>
+       </el-table>
+ <p class="enterprise">自然人</p>
+ <p class="enterprise_tw"><i class="el-icon-circle-plus-outline"></i>添加自然人</p>
+ <el-table v-loading="loading" :data="configList" >
+   <!-- <el-table-column type="selection" width="55" align="center" /> -->
+   <el-table-column label="姓名" align="center" prop="configId" />
+   <el-table-column label="自然人所在地" align="center" prop="configName" :show-overflow-tooltip="true" />
+   <el-table-column label="身份证号码" align="center" prop="configKey" :show-overflow-tooltip="true" />
+   <el-table-column label="联系方式" align="center" prop="configValue" />
+   <!-- <el-table-column label="联系方式" align="center" prop="configType" :formatter="typeFormat" /> -->
+  <!-- <el-table-column label="操作" align="center" prop="remark" :show-overflow-tooltip="true" /> -->
+   <el-table-column label="操作" align="center" >
+     <!-- class-name="small-padding fixed-width" -->
+     <template slot-scope="scope">
+       <el-button
+         size="mini"
+         type="warning"
+         @click="handleUpdate(scope.row)"
+         v-hasPermi="['system:config:edit']"
+       >修改</el-button>
+       <el-button
+         size="mini"
+         type="danger"
+         @click="handleDelete(scope.row)"
+         v-hasPermi="['system:config:remove']"
+       >删除</el-button>
+     </template>
+   </el-table-column>
+ </el-table>
+       <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+         <el-form-item label="参数名称" prop="configName">
+           <el-input
+             v-model="queryParams.configName"
+             placeholder="请输入参数名称"
+             clearable
+             size="small"
+             style="width: 240px"
+             @keyup.enter.native="handleQuery"
+           />
+         </el-form-item>
+         <el-form-item label="参数键名" prop="configKey">
+           <el-input
+             v-model="queryParams.configKey"
+             placeholder="请输入参数键名"
+             clearable
+             size="small"
+             style="width: 240px"
+             @keyup.enter.native="handleQuery"
+           />
+         </el-form-item>
+         <el-form-item label="系统内置" prop="configType">
+           <el-select v-model="queryParams.configType" placeholder="系统内置" clearable size="small">
+             <el-option
+               v-for="dict in typeOptions"
+               :key="dict.dictValue"
+               :label="dict.dictLabel"
+               :value="dict.dictValue"
+             />
+           </el-select>
+         </el-form-item>
+         <el-form-item label="创建时间">
+           <el-date-picker
+             v-model="dateRange"
+             size="small"
+             style="width: 240px"
+             value-format="yyyy-MM-dd"
+             type="daterange"
+             range-separator="-"
+             start-placeholder="开始日期"
+             end-placeholder="结束日期"
+           ></el-date-picker>
+         </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>
+     </div>
+  </div>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改参数配置对话框 -->
+    <el-dialog :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="参数名称" prop="configName">
+          <el-input v-model="form.configName" placeholder="请输入参数名称" />
+        </el-form-item>
+        <el-form-item label="参数键名" prop="configKey">
+          <el-input v-model="form.configKey" placeholder="请输入参数键名" />
+        </el-form-item>
+        <el-form-item label="参数键值" prop="configValue">
+          <el-input v-model="form.configValue" placeholder="请输入参数键值" />
+        </el-form-item>
+        <el-form-item label="系统内置" prop="configType">
+          <el-radio-group v-model="form.configType">
+            <el-radio
+              v-for="dict in typeOptions"
+              :key="dict.dictValue"
+              :label="dict.dictValue"
+            >{{dict.dictLabel}}</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" 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 { listConfig, getConfig, delConfig, addConfig, updateConfig, exportConfig, clearCache } from "@/api/system/config";
+
+export default {
+  name: "Config",
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      //步骤条
+      naueactive:2,
+      tab:1,
+      tabNume:['线索信息','签约信息','在建信息','投产信息'],
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 参数表格数据
+      configList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 类型数据字典
+      typeOptions: [],
+      // 日期范围
+      dateRange: [],
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        configName: undefined,
+        configKey: undefined,
+        configType: undefined
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        configName: [
+          { required: true, message: "参数名称不能为空", trigger: "blur" }
+        ],
+        configKey: [
+          { required: true, message: "参数键名不能为空", trigger: "blur" }
+        ],
+        configValue: [
+          { required: true, message: "参数键值不能为空", trigger: "blur" }
+        ]
+      }
+    };
+  },
+  created() {
+    this.getList();
+    this.getDicts("sys_yes_no").then(response => {
+      this.typeOptions = response.data;
+    });
+  },
+  methods: {
+    /** 查询参数列表 */
+    getList() {
+      this.loading = true;
+      listConfig(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
+          this.configList = response.rows;
+          this.total = response.total;
+          this.loading = false;
+        }
+      );
+    },
+    // 参数系统内置字典翻译
+    typeFormat(row, column) {
+      return this.selectDictLabel(this.typeOptions, row.configType);
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        configId: undefined,
+        configName: undefined,
+        configKey: undefined,
+        configValue: undefined,
+        configType: "Y",
+        remark: undefined
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.dateRange = [];
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加参数";
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.configId)
+      this.single = selection.length!=1
+      this.multiple = !selection.length
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const configId = row.configId || this.ids
+      getConfig(configId).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改参数";
+      });
+    },
+    /** 提交按钮 */
+    submitForm: function() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.configId != undefined) {
+            updateConfig(this.form).then(response => {
+              this.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addConfig(this.form).then(response => {
+              this.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const configIds = row.configId || this.ids;
+      this.$confirm('是否确认删除参数编号为"' + configIds + '"的数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return delConfig(configIds);
+        }).then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        })
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      const queryParams = this.queryParams;
+      this.$confirm('是否确认导出所有参数数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return exportConfig(queryParams);
+        }).then(response => {
+          this.download(response.msg);
+        })
+    },
+    /** 清理缓存按钮操作 */
+    handleClearCache() {
+      clearCache().then(response => {
+        this.msgSuccess("清理成功");
+      });
+    },
+    //tab
+    tabClid(index){
+    this.tab = index
+    }
+  }
+};
+</script>
+<style rel="stylesheet/scss" lang="scss">
+.app-container{
+  .header{
+    padding-left: 22px;
+    height: 45px;
+    line-height: 40px;
+    background-color: #F1F1F1;
+    font-size: 18px;
+    color: #343434;
+    margin-bottom: 40px;
+  }
+  .naue{
+    border: 1px solid #DADADA;
+    padding:  20px;
+    margin-top: 40px;
+    .nuae_wtu{
+      display: flex;
+      justify-content: center;
+      align-content: center;
+     .naue_one{
+       width: 30%;
+       p{
+         font-size: 12px;
+         font-family: PingFang SC;
+         font-weight: 400;
+         color: #343434;
+       }
+       .naue_name{
+         font-size: 14px;
+         font-family: PingFang SC;
+         font-weight: bold;
+         color: #0669B2;
+         margin-bottom: 30px;
+       }
+     }
+     .naue_two{
+       flex: 1;
+       padding-top: 20px;
+       // display: flex;
+       // align-items: center;
+       // justify-content: center;
+     }
+    }
+    //tab
+    .naue_tab{
+      border-bottom: 1px solid #CDCDCD;
+      display: flex;
+      margin-top: 30px;
+      padding: 0 10px;
+      margin-bottom: 30px;
+      p{
+        font-size: 12px;
+        font-family: PingFang SC;
+        font-weight: 400;
+        color: #343434;
+        padding: 11px 15px;
+        margin: 0;
+      }
+      .p{
+        border-bottom: 2px solid #1C84C6;
+        margin-bottom: -1px;
+      }
+    }
+    .mation{
+      .nvestor{
+        p{
+          margin:0;
+          font-size: 14px;
+          font-family: PingFang SC;
+          font-weight: bold;
+          color: #343434;
+          height: 30px;
+          line-height: 30px;
+          border-left: 3px solid #1C84C6;
+          padding-left: 13px;
+          i{
+            color: red;
+          }
+        }
+      }
+      .enterprise{
+        font-size: 14px;
+        font-family: PingFang SC;
+        font-weight: bold;
+        color: #1C84C6;
+        margin-top: 25px;
+        margin-bottom: 20px;
+      }
+      .enterprise_tw{
+        i{
+          margin-right: 5px;
+        }
+        font-size: 14px;
+        font-family: PingFang SC;
+        font-weight: 600;
+        color: #666666;
+      }
+    }
+
+  }
+}
+</style>