gameapi-client/src/views/fedback/index.vue

<template>
   <div class="app-container">
    <div style="margin-bottom: 20px;">
      <el-button type="primary" icon="Plus" @click="handleAdd" style="width: 130px;" v-hasPermi="['sys:feedback:add']">{{ t('新增反馈建议') }}</el-button>
    </div>
      <el-table v-loading="loading" :data="commissionList" stripe border class="c-table-main" height="672px">
         <!-- <el-table-column type="selection" width="55" align="center" /> -->
         <el-table-column :label="t('标题')" align="center" prop="title" />
         <el-table-column :label="t('内容')" align="center" prop="content" />
         <el-table-column :label="t('联系方式')" align="center" prop="phone" />
         <el-table-column :label="t('回复内容')" align="center" prop="replyContent" />

         <el-table-column :label="t('状态')" align="center" prop="status" >
            <template #default="scope">
               <span v-if="scope.row.status == 1">{{ t('待处理') }}</span>
               <span v-if="scope.row.status == 2">{{ t('已处理') }}</span>
            </template>
         </el-table-column>
         <el-table-column :label="t('创建时间')" align="center" prop="createTime" :show-overflow-tooltip="true">
            <template #default="scope">{{ parseTime(scope.row.createTime) }}</template>
         </el-table-column>
         <el-table-column :label="t('更新时间')" align="center" prop="updateTime" :show-overflow-tooltip="true">
            <template #default="scope">{{ parseTime(scope.row.updateTime) }}</template>
         </el-table-column>
         <el-table-column :label="t('操作')" align="center"  v-hasPermi="['sys:feedback:edit']">
            <template #default="scope">
              <el-button link type="primary" @click="resetCont(scope.row)">{{ t('回复') }}</el-button>
            </template>
         </el-table-column>
      </el-table>
      <pagination
         v-show="total > 0"
         :total="total"
         v-model:page="queryParams.pageNum"
         v-model:limit="queryParams.pageSize"
         @pagination="getList"
      />

       <!-- 添加或修改定时任务对话框 -->
       <el-dialog :title="t('新增系统反馈')" align-center v-model="open" width="520px" append-to-body>
          <el-form ref="agentRef" :model="form" :rules="rules" label-width="120px">
            <el-form-item :label="t('标题')" prop="title">
              <el-input v-model="form.title" :placeholder="t('请输入标题')" />
            </el-form-item>
            <el-form-item :label="t('联系方式')" prop="phone">
              <el-input v-model="form.phone" :placeholder="t('请输入联系方式')" />
            </el-form-item>
            <el-form-item :label="t('内容')" prop="content">
              <el-input v-model="form.content"  :rows="6"
              type="textarea" :placeholder="t('请输入内容')" />
            </el-form-item>
            
          </el-form>
          <template #footer>
             <div class="dialog-footer">
                <el-button type="primary" @click="submitForm" :loading="loadingButton">{{ t('确 定') }}</el-button>
                <el-button @click="cancel">{{ t('取 消') }}</el-button>
             </div>
          </template>
       </el-dialog>
       <el-dialog :title="t('回复反馈')" align-center v-if="openView" v-model="openView" width="520px" append-to-body>
          <el-form ref="agentRef" :model="form" :rules="rules" label-width="120px">
            <el-form-item :label="t('内容')" prop="replyContent">
              <el-input v-model="form.replyContent"  :rows="6"
              type="textarea" :placeholder="t('请输入回复内容')" />
            </el-form-item>
            
          </el-form>
          <template #footer>
             <div class="dialog-footer">
                <el-button type="primary" @click="submitForm1" :loading="loadingButton">{{ t('确 定') }}</el-button>
                <el-button @click="openView = false">{{ t('取 消') }}</el-button>
             </div>
          </template>
       </el-dialog>
   </div>
</template>

<script setup name="Commission">
import { listFeedback,createSysFeedback,updateSysFeedback } from "@/api/fedback";
import Crontab from '@/components/Crontab'
import { parseTime } from '@/utils/ruoyi'; // 时间格式化
import { id } from "element-plus/es/locales.mjs";
const router = useRouter();
const { proxy } = getCurrentInstance();
const { ff_tenant_type, ff_tenant_status,ff_tenant_agent_approval_status,ff_tenant_agent_commission_type } = proxy.useDict("ff_tenant_type", "ff_tenant_status","ff_tenant_agent_approval_status","ff_tenant_agent_commission_type");

const loadingButton = ref(false);
const commissionList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const title = ref("");
const openView = ref(false);
const openCron = ref(false);
const expression = ref("");
const tenantAgentPlatforms = ref([]);


const unwithdrawn = ref(0);
const withdrawn = ref(0);
const total = ref(0);
const invite = ref(0);
const take = ref(0);
const dateRange = ref([]);
const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    orderByColumn: "createTime",
    isAsc:'desc'
  },
  rules: {
    title:[
      { required: true, message: "请输入标题", trigger: "change" },
    ],
    phone:[
      { required: true, message: "请输入手机号", trigger: "change" },
    ],
    content:[
      { required: true, message: "请输入内容", trigger: "change" },
    ],
    replyContent:[
      { required: true, message: "请输入回复内容", trigger: "change" },
    ],
  }
});

const { queryParams, form, rules } = toRefs(data);

/** 查询列表 */
function getList() {
  loading.value = true;
  listFeedback(queryParams.vlaue).then(response => {
    commissionList.value = response.rows;
    total.value = response.total;
    loading.value = false;
  });
}

/** 取消按钮 */
function cancel() {
  open.value = false;
  reset();
}

/** 表单重置 */
function reset() {
  form.value = {
    account: "",
    password: "",
    scoreRatio: 1,
    tenantType: 1,
    tenantAgentPlatforms: [],
  };
  proxy.resetForm("agentRef");
}

/** 搜索按钮操作 */
function handleQuery() {
  queryParams.value.pageNum = 1;
  getList();
}

function queryCode(type) {
   form.value.tenantAgentPlatforms = form.value.tenantAgentPlatforms.map((item, index) => {
      if (type === 'del' && item.cost > tenantAgentPlatforms.value[index].cost) {
         item.cost -= 0.5;
         item.useCost -= 0.5
      } else if (type === 'add') {
         item.cost += 0.5;
         item.useCost += 0.5
      }
      return item
   })
}
const handleAdd = () => { 
  open.value = true;

};

const resetCont = (row) => { 
  openView.value = true;
  form.value.id = row.id;
};

/** 提交按钮 */
function submitForm() {
  proxy.$refs["agentRef"].validate(valid => {
    if (valid) {
      loadingButton.value = true;
      createSysFeedback(form.value).then(response => {
        loadingButton.value = false;
          proxy.$modal.msgSuccess(proxy.t('新增成功'));
          open.value = false;
          getList();
        });
      
    }
  });
}
/** 提交按钮 */
function submitForm1() {
  proxy.$refs["agentRef"].validate(valid => {
    if (valid) {
      loadingButton.value = true;
      let obj ={
        id:form.value.id,
        replyContent:form.value.replyContent,
        status:2
      }
      updateSysFeedback(obj).then(response => {
        loadingButton.value = false;
          proxy.$modal.msgSuccess(proxy.t('回复成功'));
          openView.value = false;
          form.value.replyContent = '';

          getList();
        }).catch(() => {
          loadingButton.value = false;
        });
    }
  });
}

getList();
</script>

<style scoped lang="scss">
 .label-scoreRatio{
   width: 100%;
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 10px;
   span{
      width: 120px;
      text-align: right;
      font-weight: 700;
      padding-right: 12px;
   }
 }
 .scoreRatioTable{
   width: calc(100% - 120px);
   margin-left: 120px;
 }
 .flooter {
   .el-tag{
      margin: 8px;
   }
 }
</style>