dev/dcp-web-gate/src_old/views/userCenter/userCenterItem/userCenterMyFeedBackService.vue

<template>
  <div style="width: 100%;background: #fff;min-height: 700px;"
       class="userCenterMyProject">
      <div style="height: 60px;line-height: 60px;padding-top: 30px;margin-left: 30px;margin-right: 30px; border-bottom: 1px solid rgba(228, 228, 228, 1);">
          {{$t('common.MyFeetBack')}}
      </div>
<!--    <div style="margin: 20px 0 0px 30px;"-->
<!--         v-if="$i18n.locale=='zh'">-->
<!--      <span v-for="(item,index) in taberPhone"-->
<!--            style="margin-right: 70px;padding: 10px;"-->
<!--            :class="item.value==taberIndex?'taberPhone1 cursor':'taberPhone2 cursor'"-->
<!--            @click="getTaberPhone(item,index)">{{$t(item.label)}}</span>-->
<!--    </div>-->
<!--    <div style="margin: 20px 0 0px 30px;"-->
<!--         v-else>-->
<!--      <span v-for="(item,index) in taberPhone"-->
<!--            style="margin-right: 40px;padding: 10px;"-->
<!--            :class="item.value==taberIndex?'taberPhone1 cursor':'taberPhone2 cursor'"-->
<!--            @click="getTaberPhone(item,index)"-->
<!--            :style="{marginRight:index==4?'0':'40px'}">{{$t(item.label)}}</span>-->
<!--    </div>-->
    <div style="margin: 20px 0 0px 30px;">
      <el-table :data="tableData"
                stripe
                highlight-current-row
                @row-click="toLook"
                class="projectName"
                style="width: 100%">
        <template slot="empty">
          {{$t('common.UserNoData')}}
        </template>
        <el-table-column type="index" fixed :label="$t('common.serialNumber')" width="80"> </el-table-column>
        <el-table-column prop="suggestion"  :label="$t('common.SuggestedType')" width='200'> </el-table-column>
          <el-table-column prop="status"  :label="$t('common.Status')" width='320'> </el-table-column>
        <el-table-column prop="report" :label="$t('common.ContentFeedback')" width='320'> </el-table-column>
        <el-table-column prop="answer" :label="$t('common.ReplyContent')" width='320'> </el-table-column>
<!--        <el-table-column :prop="senderDate" :formatter="dateFormat"  :label="$t('common.ConsultationTime')" width="150"></el-table-column>-->
<!--        <el-table-column fixed="right" prop="adddress5" :label="$t('common.Option')" width="210">-->
<!--        <template slot-scope="scope">-->
<!--        <el-button-->
<!--            @click="change(scope.row)"-->
<!--            @click.stop-->
<!--            v-if="scope.row.consultMessageInfo"-->
<!--            type="text"-->
<!--            size="small"-->
<!--            >-->
<!--            {{$t('common.check')}}-->
<!--        </el-button>-->
<!--        <el-button-->
<!--            @click.native.prevent="deleteRow(scope.$index, tableData)"-->
<!--            @click.stop-->
<!--            type="text"-->
<!--            size="small">-->
<!--            {{$t('common.Delete')}}-->
<!--            </el-button>-->
<!--        </template>-->
<!--        </el-table-column>-->
      </el-table>
      <div style="width: 100%;text-align: center;">
            <el-pagination
                style="margin-top: 50px;height: 80px;"
                background
                layout="prev, pager, next"
                :total=totalCount  @size-change="handleSizeChange"
                @current-change="handleCurrentChange">
            </el-pagination>
        </div>
<!--        <el-dialog-->
<!--        v-if="row.consultMessageInfo"-->
<!--        :title="$t('common.IntentionConsultation')"-->
<!--        :visible.sync="dialogVisible"-->
<!--        width="30%"-->
<!--        :before-close="handleClose">-->
<!--           <div style="padding: 0 20px;">-->
<!--               <div class="consultTitle">-->
<!--                   <span>{{projectName}}</span>-->
<!--               </div>-->
<!--               <div style="border-bottom:1px solid #dfdfdf">-->
<!--                   <div style="margin-top:24px;">-->
<!--                       <div style="display:inline-block;background:#0091ff;width:20px;height:20px;color:#fff;line-height:20px;border-radius:50%;text-align:center">Q</div>-->
<!--                       <span style="color:#0091ff;margin-left:10px">{{$t('common.qustion')}}：</span>-->
<!--                   </div>-->
<!--                   <p v-html="row.content"></p>-->
<!--                   <span style="float:right;margin-bottom:20px">{{$t('common.qustionTime')}}：{{dateFormat(row)}}</span>-->
<!--                    <div style="clear:both"></div>-->
<!--               </div>-->
<!--               <div>-->
<!--                   <div style="margin-top:24px;">-->
<!--                       <div style="display:inline-block;background:#6dd400;width:20px;height:20px;color:#fff;line-height:20px;border-radius:50%;text-align:center">A</div>-->
<!--                       <span style="color:#6dd400;margin-left:10px">{{$t('common.replyMessage')}}</span>-->
<!--                   </div>-->
<!--                   <p v-html="row.consultMessageInfo.content"></p>-->
<!--                   <span style="float:right;margin-bottom:20px">{{$t('common.replyMessageTime')}}：{{dateFormat(row)}}</span>-->
<!--                    <div style="clear:both"></div>-->
<!--               </div>-->
<!--           </div>-->
<!--        </el-dialog>-->
    </div>
  </div>
</template>
<script>
import Base from "@/views/base/Base"
import { getDicts } from '@/api/dict';
import {getReport} from "@/api/operation/feedback/feedback";
import moment from 'moment'
import { getToken,resetToken } from '@/utils/auth'
import Bus from "@/api/bus"; 
export default {
  name: 'userCenterMyFeedBackService',
  extends: Base,
  data () {
    return {
      formInline: {
        user: '',
        region: ''
      },
      taberPhone: [{
        label: "common.IntentionConsultation",
        value: '1'
      }, {
        label: "common.thinkTankConsultation",
        value: '6'
      }],
      taberIndex: '',
        suggestionDicts:[],
        statusDicts:[],
      // baseMemberApplies: [],
      // coopCustomServices: [],
      // resourceApplications: [],
      // memberApplyStatus: [],
      // serviceTypeDicts: [],
      // childTypeDicts: [],
      // supportWayDicts: [],
      // phaseDicts: [],
      // statusDicts: [],
      phaseDictsEnMap: {
        '1': 'Fill in the information',
        '2': 'Preliminary review',
        '3': 'Approval by the Chairman Office Meeting',
        '4': 'Qualification',
        '5': 'Membership confirmation',
        '6': 'Issue the certificate',
        '7': 'Complete'
      },
      memberApplyStatusEnMap: {
        '1': 'Not audit',
        '2': 'To audit',
        '3': 'Approved',
        '4': 'Rejected',
      },
      customServiceMap: {
        '0': 'Draft',
        '1': 'To audit',
        '2': 'Rejected',
        '3': 'Approved'
      },
      auditStatusDicts: [],
      auditStatusDictsENMap: {
        '1': 'Have not been submitted',
        '2': 'To audit',
        '3': 'First approval rejected',
        '4': 'First approval agreed',
        '5': 'Second approval is rejected',
        '6': 'Second approval is agreed',
      },
      // baseLeagueApplies: [],
      // releaseStatus: [],
      // thinkTankConsultations: [],
      // thinkTankTypeDicts: [],
      tableData: [],
      dialogVisible:false,
      dialogVisible1:false,
      projectName: "",
      totalCount:0,
      totalCount1:0,
      row:{},
      rowConsultations: {},
      param: {
                    pageNo:0,
                    pageSize:10,
                    language:'',
                },
      items: {
        pageNo:0,
        pageSize:10,
      }
    }
  },
  watch: {
    '$i18n.locale' () {
      this.getDicts()
      this.getinitData(this.taberIndex);
    },
    'taberIndex' () {
      this.getinitData(this.taberIndex);
    }

  },
  mounted () {
    this.taberIndex = this.$route.params.index ? this.$route.params.index : '1'
    this.getDicts()
  },
  computed: {
      suggestionMap:function(){
          return this.suggestionDicts.array2Obj("value","label");
  }
  },
  methods: {
    getDicts () {
      if (this.$i18n.locale === 'zh') {
        getDicts("SUGGESTION_DICT").then(result => {
          var stautusZH =[{
            label:"未处理",
            value:null
          },
            {
              label: "已处理",
              value: "1"
            }
          ]


          if (result.data) {
              this.suggestionDicts = result.data[0];
              this.statusDicts=stautusZH
              this.tableData.forEach((i) => {
                this.suggestionDicts.forEach((v) =>{
                  if (i.suggestion==v.value){
                    i.suggestion=v.label
                  }
                } )
                this.statusDicts.forEach((v) =>{
                  if (i.status==v.value){
                    i.status=v.label
                  }
                } )
              })
          }
        });
      } else {
        getDicts("SUGGESTION_DICT_EN").then(result => {
          var stautusEN=[
            {
              label:" Unprocessed",
              value:null
            },
            {
              label: "Processed",
              value: "1"
            }
          ]
            if (result.data) {
                this.suggestionDicts = result.data[0];
                this.statusDicts=stautusEN
              this.tableData.forEach((i) => {
                this.suggestionDicts.forEach((v) =>{
                  if (i.suggestion==v.value){
                    i.suggestion=v.label
                  }
                } )
                this.statusDicts.forEach((v) =>{
                  if (i.status==v.value){
                    i.status=v.label
                  }
                } )
              })
            }
        });
      }

      console.log(this.suggestion)
    },
      getFeedBack(){
          let token = getToken();
        this.tableData = []
          this.param.language = this.$i18n.locale.toUpperCase();
          getReport(this.param,token).then(res=>{

              this.tableData=res.data.feedbacks;
              this.totalCount=res.data.page.totalCount-0;
              this.resetToken();
            this.getDicts();
          })
      },
    dateFormat(row) {
                return  moment(row.senderDate).format('YYYY-MM-DD');
            },
    getinitData (index) {
        this.getFeedBack();
      // if (index == "1") {
      //   this.getReply()
      // }
      //
      //
      // if (index == "6") {
      //  this.getThinkTankConsultations();
      // }
      
    },
    // changeToAlliance (index, rows) {
    //   this.$router.push('userCentermyConcernsProgressCheckAlliance', rows)
    // },
    // handleCurrentChange(val) {
    //             this.param.pageNo=val;
    //             this.getReply()
    //
    //         },
    // getTaberPhone (item, index) {
    //   this.taberIndex = item.value
    //   console.log(this.taberIndex)
    // },
    // handleCurrentChange1 (val) {
    //    this.item.pageNo=val;
    //    this.getThinkTankConsultations();
    // },
    YymmddFormat (newDate) {
      let Month = newDate.getMonth() + 1;
      Month = Month >= 10 ? Month : '0' + Month;
      let d = newDate.getDate();
      d = d >= 10 ? d : '0' + d
      return [
        [newDate.getFullYear(), Month, d].join('-'), [newDate.getHours(), newDate.getMinutes()].join(':')
      ].join(' ');
    },
    // edit (row) {
    //   console.log(row);
    //   this.$router.push({ name: 'IntroductionMemberProfile', query: { data: row, key: 'custom', index: this.taberIndex } })
    // },
    // toApply (row) {
    //   console.log(row);
    //   this.$router.push({ name: 'resourceSharingResourceApply', query: { key: row.id } })
    // },
    // toLook (row) {
    //   this.toView('projectPresentationDetails',row.columnCode)
    // },
    toView(router, json) {
          window.localStorage.setItem('router', '');
          this.$store.commit('modify', router);
          Bus.$emit("router", router);    //存 Bus.$emit
          const { href } =this.$router.resolve({
            name: router,
            query: {
              key: json,
            }
          });
          window.open(href, '_blank');
        },
    toDel (row) {
      let params = {
        id: row.id
      }
      this.$confirm(this.$i18n.locale === 'zh' ? '确定删除？' : 'Are you sure you want to delete?', this.$t('common.Tips'), {
        confirmButtonText: this.$t('common.OK'),
        cancelButtonText: this.$t('common.cancel'),
        type: 'warning'
      }).then(() => {
        deleteByDoor(params).then(result => {
          this.$message({
            type: 'success',
            message: this.$i18n.locale === 'zh' ? '删除成功!' : 'Successfully deleted'
          });
          this.getDicts()
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: this.$t('common.Cancelled'),
        });
      });
    },
    del (row, index) {
      this.$confirm(this.$i18n.locale === 'zh' ? '确定删除？' : 'Are you sure you want to delete?', this.$t('common.Tips'), {
        confirmButtonText: this.$t('common.OK'),
        cancelButtonText: this.$t('common.cancel'),
        type: 'warning'
      }).then(() => {
        del(row.id).then(() => {
          this.$message({
            type: 'success',
            message: this.$i18n.locale === 'zh' ? '删除成功!' : 'Successfully deleted'
          });
        })
        this.getinitData(index);
      })
        .catch(() => {
          this.$message({
            type: "info",
            message: this.$t('common.Cancelled'),
          });
        });

    },
    view (row) {
      this.$router.push({ name: 'IntroductionMemberProfile', query: { data: row, key: 'custom', disable: true, index: this.taberIndex } })
    },
    commit(row) {
      this.$confirm(this.$i18n.locale === 'zh' ? '确定提交？' : 'Are you sure you want to commit?', this.$t('common.Tips'), {
        confirmButtonText: this.$t('common.OK'),
        cancelButtonText: this.$t('common.cancel'),
        type: 'warning'
      }).then(() => {
        commit(row.id).then(() => {
          this.$message({
            type: 'success',
            message: this.$i18n.locale === 'zh' ? '提交成功!' : 'Commit Successfully'
          });
          this.getThinkTankConsultations();
        })
      })
        .catch(() => {
        }); 
    },
    toDelThink(row) {
      this.$confirm(this.$i18n.locale === 'zh' ? '确定删除？' : 'Are you sure you want to delete?', this.$t('common.Tips'), {
        confirmButtonText: this.$t('common.OK'),
        cancelButtonText: this.$t('common.cancel'),
        type: 'warning'
      }).then(() => {
        deleteTo(row.id).then(() => {
          this.$message({
            type: 'success',
            message: this.$i18n.locale === 'zh' ? '删除成功!' : 'Successfully Deleted'
          });
          this.getThinkTankConsultations();
        })

      })
        .catch(() => {
        }); 
    },
    toLookReply(row) {
      this.rowConsultations = row;
      this.dialogVisible1=true;
    },
    handleSizeChange(){},
    handleSizeChange1(){}
  }
}
</script>
<style scoped>
.el-input {
  width: 200px;
}

.el-form-item__content,
.el-select {
  width: 200px !important;
}

.el-table thead {
  background: #eee;
}

.userCenterMyProject >>> .el-pagination .el-pager li,
.userCenterMyProject >>> .el-pagination .btn-next,
.userCenterMyProject >>> .el-pagination .btn-prev {
  width: 35px;
  height: 35px;
  line-height: 35px;
}

.userCenterMyProject
  >>> .el-pagination.is-background
  .el-pager
  li:not(.disabled).active {
  background: #0050d8;
}

.taberPhone1 {
  border-bottom: 2px solid #0c5afa;
  color: #0c5afa;
}

.el-table_body{
    color: red;
}
.projectName >>> .el-table__row td:nth-of-type(2){
  color: #0a0000af !important;
}
.projectName >>> .hover-row td:nth-of-type(2){
  color: #0079ef !important;
}
/* .projectName >>> .el-table__row td:nth-of-type(2){
  color: red ;
} */
.projectName >>> .el-table__row td:nth-of-type(2) .cell{
    cursor: pointer;
}

</style>