zhangzl
/
nsgk_mobile
2
0
Atdalīts 0
Kods Problēmas 0 Izmaiņu pieprasījumi 0 Laidieni 0 Vikivietne Aktivitāte
移动端
Nevar pievienot vairāk kā 25 tēmas Tēmai ir jāsākas ar burtu vai ciparu, tā var saturēt domu zīmes ('-') un var būt līdz 35 simboliem gara.
1553 Revīzijas
7 Atzari
79 MiB
 
 
Koks: 10a310b728
Atzari Tagi
${ item.name }
Izveidot atzaru ${ searchTerm }
no '10a310b728'
${ noResults }
nsgk_mobile/src/views/sunVillage_info/information.vue

431 rinda
14 KiB
Neapstrādāts Vainot Vēsture 

  1.  <template>

  2.      <div class="home_wrapper">

  3.          <div class="header_main">

  4.              合同信息

  5.              <div class="return_btn" @click="onClickLeft"></div>

  6.              <div class="add_btn" @click="goAdd"></div>

  7.          </div>

  8.          <div class="search_info">

  9.             <div class="search_block">

  10.                 <i class="icon"></i>

  11.                 <input type="text" class="ipt" placeholder="搜索" v-model="queryParams.name" @input="getSearchList">

  12.             </div>

  13.             <div class="total">共{{listLength}}个合同</div>

  14.          </div>

  15.          <div class="list_main">

  16.            <van-list

  17.              v-model="loading"

  18.              :finished="finished"

  19.              finished-text="没有更多了"

  20.              @load="getList"

  21.            >

  22.              <!--1-->

  23.              <van-swipe-cell right-width="150" class="item" v-for="(item,index) in applicationList" :key="index">

  24.                 <div class="item_box" @click="$router.push({name:'sunVillageInfoInformationDetail',query:{id:item.id}})">

  25.                   <div class="head_block">

  26.                       <i class="icon"></i>

  27.                       <div class="title">{{item.name}}</div>

  28.                   </div>

  29.                   <div class="order_block">

  30.                       <div class="order">{{item.code}}</div>

  31.                       <div :class="{'describe':true,'suspend':item.contractionStatus == '撤销','normal':item.contractionStatus == '正常','undo':item.contractionStatus == '终止'}">{{item.contractionStatus}}<i class="icon"></i></div>

  32.                   </div>

  33.                   <div class="function_block">

  34.                      <div class="value">合同金额<span class="amount">￥{{item.totalAmount}}</span></div>

  35.                      <div class="startStop_time">

  36.                         <div class="time"><div class="unim start">起</div>{{item.startTime}}</div>

  37.                         <div class="time"><div class="unim stop">止</div>{{item.endTime}}</div>

  38.                      </div>

  39.                   </div>

  40.                 </div>

  41.                <template #right>

  42.                  <div @click="handleDelete(item,index)" style="background-color: #ee0a24;height: 100%">删除</div>

  43.                  <router-link :to="{name:'sunVillageInfoInformationEdit',query:{id:item.id}}" style="background-color: #07c160">修改</router-link>

  44.                  <div @click="openLoader(item.id,0)" style="background-color: rgba(98,173,102,0.2);color: #62AD66;">附件</div>

  45.                  <router-link :to="{name:'sunVillageInfoInformationFunPlan',query:{id:item.id}}" style="background-color: #4169E1;">结款</router-link>

  46.                </template>

  47.              </van-swipe-cell>

  48.            </van-list>

  49. 

  50.          </div>

  51. <!--         <div class="bottom_tips">-->

  52. <!--            <span class="xs">已经到底啦</span>-->

  53. <!--        </div>-->

  54.        <van-popup v-model="show" lock-scroll closeable position="top" :style="{ height: '30%' }" >

  55.          <div style="padding: 0 13% 0 5%;">

  56.            <van-divider>附件</van-divider>

  57.            <van-uploader v-model="fileList" :after-read="afterRead" @delete="deleteFile1" multiple />

  58.          </div>

  59.        </van-popup>

  60.     </div>

  61. </template>

  62. 

  63. <script>

  64.  import { contractionList , delInfo , commonAttach , attachmentList , systemAttachment } from "@/api/sunVillage_info/fixedAssets";

  65.  import request from '@/utils/request'

  66.  export default {

  67.    name: "certificateList",

  68.    data() {

  69.      return {

  70.        applicationList:[],

  71.        applicationListSecond:[],

  72.        assetStatusOptions:[],

  73.        auditStatus:[],

  74.        loading: false,

  75.        finished: false,

  76.        show: false,

  77.        fileList:[],

  78.        listLength:'0',

  79.        searchInput:'',

  80.        queryParams:{

  81.          pageNum:1,

  82.          pageSize:10,

  83.          orderByColumn:'createTime',

  84.          isAsc:'desc',

  85.          name:'',

  86.        },

  87.        uploadFiles1:[],

  88.        projectId:'',

  89.        projectIndex:''

  90.      };

  91.    },

  92.    created() {

  93.      this.houseGetDicts("contraction_status").then((response) => {

  94.        this.contractionStatusOptions = response.data;

  95.      });

  96.    },

  97.    methods: {

  98.      getList(){

  99.        setTimeout(() => {

  100.          contractionList(this.queryParams).then(response => {

  101.            this.listLength = response.total;

  102.            for (var i = 0; i < response.rows.length; i++) {

  103.              response.rows[i].contractionStatus = this.selectDictLabel(this.contractionStatusOptions, response.rows[i].contractionStatus);

  104.              response.rows[i].totalAmount = Number(response.rows[i].totalAmount ).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, ($0, $1) => { return $1 + ","; }).replace(/\.$/, "")

  105.              this.applicationList.push(response.rows[i]);

  106.              this.applicationListSecond.push(response.rows[i]);

  107.            }

  108.            if(this.applicationList.length >= response.total){

  109.              this.finished = true;

  110.              return;

  111.            }else{

  112.              this.loading = false;

  113.              this.queryParams.pageNum += 1 ;

  114.            }

  115.          });

  116.        }, 1000);

  117.      },

  118.      getSearchList(){

  119.        this.applicationList = [];

  120.        this.queryParams.pageNum = 1;

  121.        this.getList();

  122.      },

  123.      afterRead(file) {

  124.        // 此时可以自行将文件上传至服务器

  125.        this.uploadFiles1.push(file.file);

  126.          let params1 = new FormData();

  127.          params1.append("tableId", this.projectId);

  128.          params1.append("tableName", "t_contraction_info");

  129.          params1.append("bizPath", "contraction");

  130.          params1.append("fileType", this.projectIndex);

  131.          params1.append("file", file.file);

  132.          commonAttach(params1).then((r1) => {

  133.            this.$notify({ type: 'success', message: '上传成功' });

  134.          })

  135.      },

  136.      openLoader(id,index){

  137.        this.show = true;

  138.        this.projectId = id;

  139.        this.projectIndex = index;

  140.        this.fileList = [];

  141.        let oData1= {

  142.          tableId: id,

  143.          tableName: "t_contraction_info",

  144.          bizPath: "contraction",

  145.          fileType: '',

  146.        }

  147.        attachmentList(oData1).then(res => {

  148.          res.rows.map(r => {

  149.            let baseUrl = location.protocol+"//"+location.host+request.defaults.baseURL

  150.            this.fileList.push({"url":baseUrl + r.fileUrl,"file":new File([],r.fileName,{}),"id":r.id})

  151.          })

  152.        })

  153.      },

  154.      /** 删除按钮操作 */

  155.      handleDelete(row,index) {

  156. 

  157.        const ids = row.id || this.ids;

  158. 

  159.        this.$dialog.alert(

  160.          {

  161.            message:'是否确认删除合同信息?',

  162.            title:"警告",

  163.            showCancelButton:true,

  164.            confirmButtonText: "确定",

  165.            cancelButtonText: "取消",

  166.          }

  167.        )

  168.          .then(function () {

  169.            return delInfo(ids);

  170.          })

  171.          .then(() => {

  172.            this.applicationList.splice(index, 1);

  173.            this.$notify({ type: 'success', message: '删除成功' });

  174.          });

  175.      },

  176.      deleteFile1(file){

  177.        console.log(file)

  178.        systemAttachment(file.id).then(res => {

  179.          this.$notify({ type: 'success', message: '删除成功' });

  180.        })

  181.      },

  182.      goAdd(){

  183.        this.$router.push('/sunVillage_info/informationAdd')

  184.      },

  185.    },

  186.  }

  187. </script>

  188. 

  189. <style scoped lang="scss">

  190. .home_wrapper{

  191.     background: #e9e9e9;

  192.     min-height: 100vh;

  193.     width: 100vw;

  194.     .header_main {

  195.         height: 116px;

  196.         background: url('../../assets/images/sunVillage_info/list_head.png') no-repeat;

  197.         background-size: 100% 100%;

  198.         position: fixed;

  199.         top: 0;

  200.         left: 0;

  201.         width: 100%;

  202.         font-size: 36px;

  203.         line-height: 116px;

  204.         text-align: center;

  205.         color: #fff;

  206.         position: relative;

  207. 

  208.         .return_btn {

  209.             width: 24px;

  210.             height: 43.2px;

  211.             background: url('../../assets/images/sunVillage_info/list_icon_5.png') center center no-repeat;

  212.             background-size: 20px 36px;

  213.             position: absolute;

  214.             left: 38px;

  215.             top: 36px;

  216.         }

  217. 

  218.         .add_btn {

  219.             width: 56.4px;

  220.             height: 40.8px;

  221.             background: url('../../assets/images/sunVillage_info/list_icon_9.png') center center no-repeat;

  222.             background-size: 47px 34px;

  223.             position: absolute;

  224.             right: 38px;

  225.             top: 36px;

  226.         }

  227.     }

  228.     .search_info{

  229.         padding:20px 23px;

  230.         display: flex;

  231.         .search_block{

  232.         height: 59px;

  233.         width: 535px;

  234.         border-radius: 59px;

  235.         background: #fff;

  236.         display: flex;

  237.         border:2px solid #3494ff;

  238.         padding-right: 35px;

  239.         align-items: center;

  240.         .icon{

  241.             width: 30px;

  242.             height: 30px;

  243.             background: url('../../assets/images/sunVillage_info/fixedAssets_icon_1.png') no-repeat;

  244.             background-size: 100% 100%;

  245.             display: block;

  246.             margin:0 8px 0 26px;

  247.         }

  248.         .ipt{

  249.         flex: 1;

  250.         font-size: 26px;

  251.         background: none;

  252.         border:0 none;

  253.         line-height: 59px;

  254.         }

  255.         }

  256.         .total{

  257.         flex: 1;

  258.         display: flex;

  259.         align-items: center;

  260.         justify-content: center;

  261.         font-size: 26px;

  262.         color: #858585;

  263.         }

  264.     }

  265.     .list_main{

  266.         padding:0 22px;

  267.         .item{

  268.             height: 207px;

  269.             border-radius: 30px;

  270.             background: #fff;

  271.             box-shadow: 4px 6px 5px rgba(63, 68, 75, 0.1);

  272.             margin-bottom: 20px;

  273.             .item_box{

  274.               padding:25px 32px;

  275.             }

  276.             .head_block{

  277.                 height: 56px;

  278.                 display: flex;

  279.                 align-items: center;

  280.                 width: 100%;

  281.                  .icon{

  282.                     width: 34px;

  283.                     height: 30px;

  284.                     background: url('../../assets/images/sunVillage_info/fixedAssets_icon_2.png') no-repeat;

  285.                     background-size: 100% 100%;

  286.                     display: block;

  287.                     margin-right: 12px;

  288.                 }

  289.                 .title{

  290.                     flex:1;

  291.                     font-size: 32px;

  292.                     color: #252525;

  293.                     overflow: hidden;

  294.                     text-overflow: ellipsis;

  295.                     white-space: nowrap;

  296.                     padding-right: 20px;

  297. 

  298.                 }

  299.             }

  300.             .order_block{

  301.                 height: 50px;

  302.                 display: flex;

  303.                 align-items: center;

  304.                 width: 100%;

  305.                 .order{

  306.                     flex: 1;

  307.                     font-size: 26px;

  308.                     color: #252525;

  309.                 }

  310.                 .describe{

  311.                     font-size: 26px;

  312.                     display: flex;

  313.                     align-items: center;

  314.                     &.suspend{

  315.                         color: #f69600;

  316.                         .icon{

  317.                             width: 27px;

  318.                             height: 26px;

  319.                             background: url('../../assets/images/sunVillage_info/information_icon_1.png') no-repeat;

  320.                             background-size: 100% 100%;

  321.                             display: block;

  322.                             margin-left: 15px;

  323.                         }

  324.                     }

  325.                     &.normal{

  326.                         color: #69c100;

  327.                         .icon{

  328.                             width: 32px;

  329.                             height: 26px;

  330.                             background: url('../../assets/images/sunVillage_info/information_icon_2.png') no-repeat;

  331.                             background-size: 100% 100%;

  332.                             display: block;

  333.                             margin-left: 15px;

  334.                         }

  335.                     }

  336.                     &.undo{

  337.                         color: #858585;

  338.                         .icon{

  339.                             width: 27px;

  340.                             height: 26px;

  341.                             background: url('../../assets/images/sunVillage_info/information_icon_3.png') no-repeat;

  342.                             background-size: 100% 100%;

  343.                             display: block;

  344.                             margin-left: 15px;

  345.                         }

  346.                     }

  347. 

  348. 

  349.                 }

  350.             }

  351.             .function_block{

  352.                 height: 50px;

  353.                 display: flex;

  354.                 align-items: center;

  355.                 width: 100%;

  356.                 .value{

  357.                     flex: 1;

  358.                     font-size: 24px;

  359.                     color: #252525;

  360.                     .amount{

  361.                         color: #eb1616;

  362.                     }

  363.                 }

  364.                 .startStop_time{

  365.                     display: flex;

  366.                     align-items: center;

  367.                     .time{

  368.                         display: flex;

  369.                         align-items: center;

  370.                         font-size: 24px;

  371.                         color: #002022;

  372.                         margin-left: 25px;

  373.                         .unim{

  374.                             width: 32px;

  375.                             height: 32px;

  376.                             font-size: 22px;

  377.                             color: #fff;

  378.                             text-align: center;

  379.                             line-height: 32px;

  380.                             border-radius: 6px;

  381.                             margin-right: 8px;

  382.                             &.start{background: #3e7df2;}

  383.                             &.stop{background: #eb1616;}

  384.                         }

  385.                     }

  386.                 }

  387.             }

  388. 

  389. 

  390.         //    <div class="function_block">

  391.         //              <div class="value">合同金额<span class="amount">￥199.00</span></div>

  392.         //              <div class="startStop_time">

  393.         //                 <div class="time"><div class="unim">起</div>2022.05.04</div>

  394.         //                 <div class="time"><div class="unim">起</div>2022.05.04</div>

  395.         //              </div>

  396.         //          </div>

  397. 

  398. 

  399.         }

  400.     }

  401.     .bottom_tips{

  402.         font-size: 24px;

  403.          color: #a7a6a6;

  404.          text-align: center;

  405.          margin-top: 32px;

  406.          background: url('../../assets/images/sunVillage_info/list_icon_8.png') center center no-repeat;

  407.          background-size: 260px 2px;

  408.          .xs{

  409.             padding:0 8px;

  410.             background: #e9e9e9;

  411.          }

  412.     }

  413.     /deep/ .van-swipe-cell__right{

  414.       display: flex;

  415.       align-items: center;

  416.       width: 150PX;

  417.       margin-left: 5PX;

  418.       a,div{

  419.         margin: 0;

  420.         display: flex;

  421.         align-items: center;

  422.         justify-content: center;

  423.         color: #ffffff;

  424.         font-size: 14PX;

  425.         height: 100%;

  426.         flex: 1;

  427.       }

  428.     }

  429. }

  430. </style>