talk_appAmin/pages/work/guanli_gold/guanli_gold.vue

324 lines
6.7 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view class="content">
<view class="box_item" v-for="(item, index) in item_List">
<!-- 标题 -->
<p class="box_title">{{ item.title }}</p>
<!-- 输入 -->
<view class="input_box" v-if="item.cut == 0">
<p style="width: 45%;">每日可获取奖励次数:</p>
<input :class="change_id == item.id ? 'input_active' : ''" type="number" placeholder="1"
v-model.number="item.dayCount" :disabled="change_id == item.id & item.cut == 0 ? false : true" style="width: 395rpx;">
</input>
</view>
<view class="input_box" v-else>
<p>每日可获取奖励次数:</p>
<!-- <input type="number" :placeholder="item.cutInfo" disabled class="cut1" v-model="item.cutInfo">
</input> -->
<!-- 无限制是后端获取的字段cutInfo值使用 up-input组件 进行 组合 值 + 不可修改固定字样 -->
<!-- height: '40rpx' 改为 46 尽量不减少字体大小-->
<up-input v-model="item.cutInfo" disabled="true" disabledColor="#F4F5F6"
:customStyle="{
borderColor:'#ff0004 !important',
width: '100%',
height: '55rpx'
}"
fontSize="22rpx" color="#999999"
>
<template #suffix>
<view class="cut1">不可修改</view>
</template>
</up-input>
</view>
<!-- 第二个输入 -->
<view class="input_box">
<p>每次可获得校园币:</p><input type="number" :class="change_id == item.id ? 'input_active' : ''" placeholder="1"
v-model.number="item.rewards" :disabled="change_id == item.id ? false : true" style="width: 360rpx;"/>
</view>
<!-- 按钮 -->
<view class="item_btns" v-if="change_id == item.id">
<view class="btns_left" @click="cancel_change">
取消
</view>
<view class="btns_right" @click="queding_change(item)">
确认
</view>
</view>
<view class="item_btn" v-else @click="changetext(index, item.id)">
<image :src="adupdate" style="width: 32rpx; height: 30rpx; margin-right: 12rpx;"></image>
</view>
</view>
</view>
</template>
<script setup>
import { listCheckTask, getCheckTask, delCheckTask, addCheckTask, updateCheckTask } from "@/api/CheckTask/CheckTask";
import { useStore } from 'vuex'
import { useRouter } from 'vue-router'
import { ref, getCurrentInstance, reactive, toRefs } from 'vue';
import { getDicts } from "@/api/system/dict/data";
import { onShow, onLoad, onPullDownRefresh } from '@dcloudio/uni-app'
const { proxy } = getCurrentInstance();
const isOfficial = ref(true)
const store = useStore();
const gradeInfo = ref({})
const iconConfig = proxy.iconConfig;
const adupdate = iconConfig.adupdate;
var item_List = ref([])
const show1 = ref(false)
const content = ref('')
//等级列表
var change_id = ref(-1)
var if_focus = ref(-1)
const lively = ref([]);
const livelyCutInfo = ref([]);
onLoad(() => {
getDicts('lively').then(e => {
lively.value = e.data;
});
getDicts('lively_cut').then(e => {
livelyCutInfo.value = e.data;
});
listCheckTask().then(e => {
console.log("e2", e);
item_List.value = e.rows;
console.log("我是hahahahhahahhahhahah", e);
})
})
const getDictLively = (state) => {
const dict = lively.value.find((dict) => dict.dictValue === state);
return dict ? dict.dictLabel : '未知状态';
};
// 点击修改按钮
function changetext(index, id) {
change_id.value = id
}
// 点击取消修改按钮
function cancel_change() {
change_id.value = -1
}
function queding_change(item) {
proxy.$modal.loading("数据发送中");
change_id.value = -1
let form = {
id: item.id,
dayCount: item.dayCount,
rewards: item.rewards
}
updateCheckTask(form).then(e => {
if (e.code == 200) {
proxy.$modal.closeLoading();
proxy.$modal.msgSuccess("修改成功");
}
console.log(e);
})
}
</script>
<style>
page {
background-color: #ffffff;
}
.cut1 {
font-weight: 400;
font-size: 24rpx;
color: #FA3939;
}
.content {
padding-top: 32rpx;
}
.box_item {
width: 686rpx;
border-radius: 24rpx 24rpx 24rpx 24rpx;
box-shadow: 0rpx 0rpx 10rpx #efefef;
background: #ffffff;
margin: 0 auto;
padding: 24rpx;
margin-top: 24rpx;
}
.box_title {
font-weight: 600;
margin-bottom: 32rpx;
}
.input_box {
display: flex;
margin-bottom: 14rpx;
p {
font-size: 26rpx;
margin-right: 24rpx;
width: 258rpx;
}
input {
background-color: #F4F5F6;
border-radius: 8rpx 8rpx 8rpx 8rpx;
padding-left: 10rpx;
}
}
.input_active {
box-shadow: 0rpx 0rpx 0rpx 2rpx #6aa2ff;
}
.input_active2 {
box-shadow: 0rpx 0rpx 0rpx 2rpx #FA3939;
}
.item_btn {
width: 638rpx;
height: 80rpx;
border-radius: 16rpx 16rpx 16rpx 16rpx;
background: #6aa2ff;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-weight: 600;
margin-top: 36rpx;
}
.item_btns {
display: flex;
align-items: center;
justify-content: space-around;
margin-top: 36rpx;
.btns_left {
width: 300rpx;
height: 80rpx;
border-radius: 16rpx 16rpx 16rpx 16rpx;
background: #f4f5f6;
color: #999999;
font-weight: 600;
display: flex;
align-items: center;
justify-content: space-around;
}
.btns_right {
width: 300rpx;
height: 80rpx;
border-radius: 16rpx 16rpx 16rpx 16rpx;
background: #6aa2ff;
display: flex;
align-items: center;
justify-content: space-around;
color: #fff;
font-weight: 600;
}
}
.level_shezhi {
width: 686rpx;
height: 557rpx;
border-radius: 24rpx 24rpx 24rpx 24rpx;
background: #ffffff;
box-shadow: 0rpx 0rpx 10rpx #efefef;
margin: 48rpx auto;
padding-top: 24rpx;
h4 {
text-align: center;
font-size: 30rpx;
}
}
.shezhi_box {
width: 100%;
margin-top: 20rpx;
display: flex;
.left_shezhi_box {
width: 60rpx;
height: 60rpx;
font-size: 28rpx;
margin-right: 30rpx;
margin-left: 24rpx;
}
.center_shezhi_box {
width: 472rpx;
text-align: center;
}
}
.shezhi_box_else {
width: 100%;
display: flex;
margin-bottom: 20rpx;
.left_shezhi_box {
width: 60rpx;
height: 60rpx;
font-size: 28rpx;
margin-right: 30rpx;
box-shadow: 0rpx 0rpx 10rpx #efefef;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
margin-left: 24rpx;
border-radius: 6rpx;
}
.center_shezhi_box {
width: 472rpx;
text-align: center;
box-shadow: 0rpx 0rpx 10rpx #efefef;
border-radius: 8rpx 8rpx 8rpx 8rpx;
input {
height: 100%;
width: 100%;
border-radius: 6rpx;
}
}
.right_shezhi_box {
width: 60rpx;
height: 60rpx;
border-radius: 8rpx 8rpx 8rpx 8rpx;
background: #6aa2ff;
margin-left: 30rpx;
display: flex;
align-items: center;
justify-content: center;
image {
width: 37rpx;
height: 37rpx;
}
}
}
.add_level {
width: 654rpx;
height: 80rpx;
border-radius: 16rpx 16rpx 16rpx 16rpx;
display: flex;
align-items: center;
justify-content: center;
background: #6aa2ff;
margin-left: 24rpx;
margin-top: 32rpx;
color: #fff;
font-weight: 600;
}
</style>