费用报销模块增加了删除和双击编辑

fhKeeper/formulahousekeeper/timesheet/config/index.js

@@ -2,7 +2,8 @@ var path = require('path')
 
 
  var ip = '192.168.2.21'
- 
+ var ip = '47.100.37.243'
+//  47.100.37.243
 // var os = require('os'), ip = '', ifaces = os.networkInterfaces() // 获取本机ip
 // for (var i in ifaces) {
 //     for (var j in ifaces[i]) {

fhKeeper/formulahousekeeper/timesheet/src/views/expense/expense.vue

@@ -1,6 +1,6 @@
 <template>
   <section>
-    <div class="sidebars" style="width: 250px">
+    <div class="sidebars" style="width: 200px">
       <h2><i class="iconfont firerock-iconcaiwu" style="padding-right: 10px"></i>费用报销模块</h2>
       <el-col :span="12">
         <el-menu
@@ -42,7 +42,7 @@
     </div>
     <!-- 内容主体区域 -->
     <!-- 上面部分 -->
-    <div class="staff" style="margin-left: 250px" v-if="!displayTable">
+    <div class="staff" style="margin-left: 200px" v-if="!displayTable">
       <!-- 公共 -->
       <div class="public">
         <el-form :model="addForm" label-width="80px">
@@ -92,55 +92,47 @@
       <el-dialog
         title="新增"
         :visible.sync="dialogVisible"
-        width="30%"
-        :before-close="handleClose">
-        
+        width="550px"
+        :before-close="handleClose"
+        >
         <div class="messages">
           <el-form ref="form" :model="form" label-width="80px">
-            <!-- 项目 -->
             <el-form-item label="项目">
               <el-select v-model="form.projectId" placeholder="项目" style="width: 150px">
                 <el-option v-for="(item, index) in projectList" :key="index" :label="item.projectName" :value="item.id" @click="ok(item)"></el-option>
               </el-select>
             </el-form-item>
-            <!-- 费用日期 -->
-            <div class="sdat">费用日期：<el-date-picker
+            <div class="sdat">费用日期<el-date-picker
               v-model="form.happenDate"
               type="date"
+              style="margin-left: 12px;"
               value-format="yyyy-MM-dd"
               placeholder="选择日期">
             </el-date-picker></div>
-            <!-- 发票种类 -->
             <el-form-item label="发票种类">
-              <el-select v-model="form.invoiceType" default-value="yyyy-MM-dd" placeholder="请选择费用类型" style="width: 150px">
+              <el-select v-model="form.invoiceType" default-value="yyyy-MM-dd" placeholder="请选择费用类型" style="width: 150px;">
                 <el-option label="增值税专用发票" value="0"></el-option>
                 <el-option label="增值税普通发票" value="1"></el-option>
               </el-select>
             </el-form-item>
-          <!-- 费用金额 -->
           <el-form-item label="费用金额">
               <el-input v-model.number="form.amount"></el-input>
             </el-form-item>
-          <!-- 发票号 -->
             <el-form-item label="发票号">
               <el-input disabled v-model="form.invoiceNo"></el-input>
             </el-form-item>
-          <!-- 税率 -->
             <el-form-item label="税率">
-              <el-input v-model.number="form.taxPercent"></el-input>%
-            </el-form-item>
-          <!-- 税额 -->
+              <el-input v-model.number="form.taxPercent"></el-input>
+            </el-form-item>&nbsp;&nbsp;&nbsp;%
             <el-form-item label="税额">
-              <el-input v-model.number="form.taxValue"></el-input>元
-            </el-form-item>
-            <!-- 备注 -->
+              <el-input v-model.number="form.taxValue"></el-input>
+            </el-form-item>&nbsp;&nbsp;&nbsp;元
             <el-form-item label="备注">
               <el-input v-model="form.remark"></el-input>
             </el-form-item>
           
           </el-form>
         </div>
-
         <span slot="footer" class="dialog-footer">
           <el-button @click="dialogVisible = false">取 消</el-button>
           <el-button type="primary" @click="ensure">确 定</el-button>
@@ -152,7 +144,8 @@
         <el-table
           :data="invoiceList"
           border
-          style="width: 100%">
+          style="width: 100%"
+          @row-dblclick="dbclick">
           <el-table-column
             prop="projectName"
             label="项目"
@@ -161,61 +154,109 @@
           <el-table-column
             prop="happenDate"
             label="费用日期"
-            width="180">
-          </el-table-column>
-          <!-- <el-table-column
-            prop="invoiceType"
-            label="发票种类" v-if="invoiceType == '0'">
-            增值税专用发票
+            width="130px">
           </el-table-column>
           <el-table-column
-            prop="invoiceType"
-            label="发票种类" v-if="invoiceType == '1'">
-            增值税普通发票
-          </el-table-column> -->
-          <el-table-column
-            prop="invoiceType"
             label="发票种类">
+            <template slot-scope="scope">  
+                <p v-if="scope.row.invoiceType == 0" style="font-size: 10px;">增值税专用发票</p>
+                <p v-else style="font-size: 10px;">增值税普通发票</p>
+            </template>
           </el-table-column>
           <el-table-column
-            prop="amount"
             label="费用金额">
+            <template slot-scope="scope">
+              <el-input v-if="isOK == true" v-model="scope.row.amount" style="width:100%;hight:100%" @blur="oosk(isOK)"></el-input>
+              <span v-else>{{scope.row.amount}}</span>
+            </template>
           </el-table-column>
           <el-table-column
             prop="invoiceNo"
             label="发票号">
           </el-table-column>
           <el-table-column
-            prop="taxPercent"
             label="税率%">
+            <template slot-scope="scope">
+              <el-input v-if="isOK == true" v-model="scope.row.taxPercent" style="width:100%;hight:100%" @blur="oosk"></el-input>
+              <span v-else>{{scope.row.taxPercent}}</span>
+            </template>
           </el-table-column>
           <el-table-column
-            prop="taxValue"
             label="税额">
+            <template slot-scope="scope">
+              <el-input v-if="isOK == true" v-model="scope.row.taxValue" style="width:100%;hight:100%" @blur="oosk"></el-input>
+              <span v-else>{{scope.row.taxValue}}</span>
+            </template>
           </el-table-column>
           <el-table-column
-            prop="remark"
             label="备注">
+            <template slot-scope="scope">
+              <el-input v-if="isOK == true" v-model="scope.row.remark" style="width:100%;hight:100%" @blur="oosk"></el-input>
+              <span v-else>{{scope.row.remark}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="操作">
+            <template slot-scope="scope">
+              <el-button type="danger" size="mini" style="display: inline-block;margin-left:0;margin-top: 3px" @click="chanc(scope.$index)">删除</el-button>
+            </template>
           </el-table-column>
         </el-table>
       </div>
     </div>
 
     <!-- 下面部分 -->
-    <div class="staff" style="margin-left: 250px" v-if="displayTable">
+    <div class="staff" style="margin-left: 200px" v-if="displayTable">
       <div class="search">
-        <el-input v-model="input" placeholder="单据编号"></el-input>
+        <el-input v-model="input" placeholder="单据编号" style="display: inline-block;width: 200px"></el-input>
         <span>单据类别：
           <el-select v-model="value" placeholder="请选择">
-            <el-option
-              v-for="item in options"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value">
-            </el-option>
+            <el-option label="一般费用填表" value="0"></el-option>
+            <el-option label="差旅费用填表" value="1"></el-option>
+            <el-option label="外包费用填表" value="2"></el-option>
           </el-select>
+          <el-button type="primary" icon="el-icon-search">搜索</el-button>
         </span>
       </div>
+
+      <div class="tables">
+        <el-table
+          :data="getLists.records"
+          border
+          style="width: 100%">
+          <el-table-column prop="code" label="单据编号">
+          </el-table-column>
+          <el-table-column label="单据类型">
+            <template slot-scope="scope">
+              <p v-if="scope.row.type == 0">一般费用填报</p>
+              <p v-if="scope.row.type == 1">差旅费用填报</p>
+              <p v-if="scope.row.type == 2">外包费用填报</p>
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="ownerId"
+            label="填报人">
+          </el-table-column>
+          <el-table-column
+            prop="status"
+            label="核审状态">
+          </el-table-column>
+          <el-table-column
+            prop="createDate"
+            label="填报时间">
+          </el-table-column>
+          <el-table-column
+            prop="remark"
+            label="备注">
+          </el-table-column>
+          <el-table-column
+            label="操作">
+            <template slot-scope="scope">
+              <el-button type="danger" size="mini" @click="deletes(scope.row.id)">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
     </div>
   </section>
 </template>
@@ -234,22 +275,6 @@ export default {
       companyId: [], // 人员的id
       dialogVisible: false,
       code: null,
-        options: [{
-          value: '选项1',
-          label: '黄金糕'
-        }, {
-          value: '选项2',
-          label: '双皮奶'
-        }, {
-          value: '选项3',
-          label: '蚵仔煎'
-        }, {
-          value: '选项4',
-          label: '龙须面'
-        }, {
-          value: '选项5',
-          label: '北京烤鸭'
-        }],
       addForm:{code:null,ownerId:null,createDate: null, ticketNum:0,type:0,remark:null,totalAmount:0,},
       page: 1,
       size:20,
@@ -257,7 +282,9 @@ export default {
       invoiceList: [],
       kkk: null, // 
       ddId: null,
-      dldl: []
+      dldl: [],
+      isOK: false,
+      value: null
     };
   },
   computed: {},
@@ -274,6 +301,7 @@ export default {
     },
     bills() { // 控制
       this.displayTable = true
+      this.getList()
     },
     //  获取人员信息
     getUsers() {
@@ -317,19 +345,6 @@ export default {
       // this.ok()
       this.form = {happenDate: null,invoiceType:null,amount:null,invoiceNo:null,taxPercent:null,taxValue:null,remark:null}
     },
-    // ok(){
-    //   var nadao = this.projectList
-    //   var kk = this.form.projectId
-    //   var c = 0
-    //   console.log(kk, nadao);
-    //   for(var i = 0; i <= nadao.length; i++) {
-    //       c++
-    //       if(nadao[i].projectName == kk){
-    //           this.ddId = nadao[c - 1].id
-    //       }
-    //   }
-    //   console.log(this.ddId);
-    // },
     //获取项目列表
     getProjectList() {
         this.http.post( this.port.project.list, {},
@@ -362,10 +377,6 @@ export default {
             if (res.code == "ok") {
                 this.getLists = res.data
                 console.log(this.getLists, '获取过来的单据列表');
-                this.$message({
-                message: '填报成功',
-                type: "success"
-                });
             } else {
                 this.$message({
                 message: res.msg,
@@ -381,12 +392,14 @@ export default {
         });
     },
     //删除单据
-    delete(id) {
+    deletes(id) {
+      console.log(id);
       this.http.post('/expense-sheet/delete', {id: id},
         res => {
             if (res.code == "ok") {
+              this.getList()
                 this.$message({
-                message: '填报成功',
+                message: '删除成功',
                 type: "success"
                 });
             } else {
@@ -454,6 +467,17 @@ export default {
             });
         });
     },
+    // 点击删除
+    chanc(k) {
+      this.invoiceList.splice(k, 1)
+    },
+    // 双击
+    dbclick(row, event, column){
+      this.isOK = true
+    },
+    oosk(s){
+      this.isOK = false
+    }
   },
 };
 </script>
@@ -475,9 +499,6 @@ export default {
   width: 100%
 }
 
-.staff {
-}
-
 .public {
   height: 185px;
   border-bottom: 1px solid #ddd;
@@ -494,7 +515,8 @@ export default {
   box-sizing: border-box;
 }
 .pu_table {
-  margin: 10px 10px 10px 10px;
+  margin-left: 10px;
+  margin-top: 10px;
 }
 
 /* 我的单据报销凭证 */
@@ -502,6 +524,26 @@ export default {
 
 /*  */
 .sdat{
-  margin:0 0 20px 10px;
+    display: inline-block;
+    width: 260px;
+    margin-left: 13px;
+}
+.messages .el-form-item{
+  display: inline-block;
+}
+.messages .el-date-editor.el-input, .el-date-editor.el-input__inner{
+  width: 190px;
+}
+
+/* 我的报销单据 */
+.search {
+  position: relative;
+  top: 20px;
+  left: 20px;
+}
+.tables {
+  margin-top: 50px;
+  box-sizing: border-box;
+  padding: 10px;
 }
 </style>