productDev/dmMes.git

¶Ô±ÈÐÂÎÄ¼þ
			@@ -0,0 +1,1002 @@
			<template>
			<view>
			<workOrderInfo :orederMessage="{proUserList:[]}" />
			<view class="bg_cate">
			<view @click="clickIten(index)" :class="typeView == index ? 'bg_cate_item active' : 'bg_cate_item'"
			v-for="(item, index) in cate" :key="index">{{ item.name }}</view>
			</view>
			<div class="bg_list" v-if="typeView === 0">
			<div class="bg_list_item">
			<div class="bg_list_item_top">
			<div class="bg_list_item_top_left">
			<div class="bg_list_item_top_left_x bg_m"></div>
			<span>æææç»</span>
			</div>
			<div class="bg_list_item_top_right" @click="jumpTL">
			<!-- v-if="proxy.$auth('h5:workorderinput:create') && (info.bomType !== 1 \|\| info.bomType == 0 \|\| !info.bomType)" -->
			<!-- <img src="@/assets/icon/gongdan_ic_shoudong@2x.png" alt="" /> -->
			<!-- <img src="@/static/gongdan_ic_shoudong@2x.ong" alt="" /> -->
			<image src="../../static/gongdan_ic_shoudong@2x.png" class="img28" mode=""></image>
			<span class="cm">æ°å¢ææ</span>
			</div>
			</div>

			<template v-if="feedingData && feedingData.length > 0">
			<u-swipe-action>
			<u-swipe-action-item v-for="(item, index) in feedingData" :key="index" :options="options"
			@click="deleItem(item.id, 'T')">
			<div class="bg_list_item_h">
			<div class="bg_list_item_num">
			<div class="bg_list_item_num_item">
			<!-- <span>{{item.code}}</span> -->
			<div class="bg_list_item_num_item_wl">
			<span> {{ item.materialName \|\| 'å¢ä½ç ' }}{{ item.procedureName ? ` \| ${item.procedureName}` : ''
			}}</span>
			<div class="bg_list_item_num_item_wl_lx">
			<span class="green" v-if="item.qualityType == 0">åæ ¼ / </span>
			<span class="orange" v-if="item.qualityType == 1">ä¸è¯ / </span>
			<span class="red" v-if="item.qualityType == 2">æ¥åº / </span>
			<span>{{ item.locationName }}</span>
			<span>{{ item.batch ? ` / ${item.batch}` : '' }}</span>
			</div>
			</div>
			<div class="bg_list_item_num_item_sr">
			<!-- :disabled="!proxy.$auth('h5:workorderinput:update')" -->
			<!-- <view class="cY">
			<span>{{item.num}}{{ item.unitName }}</span>
			<image src="../../../static/ic_edit@2x.png" class="img48" mode=""></image>
			<span class="red">å é¤</span>
			</view> -->
			<view class="cY">
			<input v-model="item.num"
			@blur="change(item.id, item.num, 'T', item.maxNum, item, item.unitAttribute)"
			type="number" />
			<span class="cm">ä¿å</span>
			</view>

			</div>
			</div>
			</div>
			</div>
			</u-swipe-action-item>
			</u-swipe-action>

			</template>
			<template v-else>
			<div class="kong">
			<span>ææ æ°æ®</span>
			</div>
			</template>
			</div>
			<div class="bg_list_item">
			<div class="bg_list_item_top">
			<div class="bg_list_item_top_left">
			<div class="bg_list_item_top_left_x bg_m"></div>
			<span>äº§åºæç»</span>
			</div>
			</div>
			<div class="bg_list_item_h">
			<div class="bg_list_item_num">
			<div class="bg_list_item_num_item">
			<span>è¯åæ°{{ info.umodel ? `(${info.umodel.name})` : '' }}</span>
			<div class="bg_list_item_num_item_sr">
			<!-- :disabled="!proxy.$auth('h5:workorderoutput:update')" -->
			<!-- @blur="change(item.id, item.num, 'C', item.maxNum, item)" -->
			<input type="number" v-model="produceFrom.qualified"
			@blur="changeCC('0', produceFrom.qualified, produceFrom.qualifiedId)"
			placeholder="è¯·è¾å¥" />
			<span v-if="info.umodel">{{ info.umodel.name }}</span>
			</div>
			</div>
			</div>
			</div>
			<div class="bg_list_item_h">
			<div class="bg_list_item_num">
			<!-- @blur="change(item.id, item.num, 'C', item.maxNum, item)" -->
			<div class="bg_list_item_num_item">
			<span>ä¸è¯æ°{{ info.umodel ? `(${info.umodel.name})` : '' }}</span>
			<div class="bg_list_item_num_item_sr">
			<!-- :disabled="!proxy.$auth('h5:workorderoutput:update')" -->
			<!-- @blur="change(item.id, item.num, 'C', item.maxNum, item)" -->
			<input type="number" v-model="produceFrom.undesirable"
			@blur="changeCC('1', produceFrom.undesirable, produceFrom.undesirableId)"
			placeholder="è¯·è¾å¥" />
			<span v-if="info.umodel">{{ info.umodel.name }}</span>
			</div>
			</div>
			</div>
			</div>
			<div class="bg_list_item_h" v-if="produceFrom.undesirable > 0">
			<div class="bg_list_item_num">
			<div class="bg_list_item_num_item" @click="badShow = true">
			<span>ä¸è¯é¡¹</span>
			<div class="bg_list_item_num_item_sr">
			<span class="wulll" :style="{ color: form.defectiveName ? '#305ED5' : '' }">{{ form.defectiveName ?
			form.defectiveName : 'è®¾ç½®' }}</span>
			<image src="../../../static/ic_ar@2x.png" class="img_ar" mode=""></image>
			</div>
			</div>
			</div>
			</div>
			</div>
			<div class="bg_plan" @click="TimeShow = true">
			<div class="bg_plan_label">
			<span>æ¥å·¥æ¶é¿</span>
			</div>
			<div class="bg_plan_label_val">
			<span
			:style="{ color: form.durationName ? '#333' : '' }">{{ form.durationName ? form.durationName : 'è¯·éæ©' }}</span>
			<image src="../../../static/ic_ar@2x.png" class="img_ar" mode=""></image>
			</div>
			</div>
			<div class="bg_list_item" v-if="arrType && arrType.length > 0">
			<div class="bg_list_item_top">
			<div class="bg_list_item_top_left">
			<div class="bg_list_item_top_left_x bg_m"></div>
			<span>å·¥èµç»©æ</span>
			</div>
			</div>
			<div class="bg_list_item_h">
			<div class="bg_list_item_num">
			<div class="bg_list_item_num_item">
			<span>è®¡ä»¶æ¹å¼</span>
			<div class="bg_list_item_num_item_list">
			<div :class="form.index == index ? 'bg_list_item_num_item_list_item active' : 'bg_list_item_num_item_list_item'"
			v-for="(item, index) in arrType" :key="index"
			@click="clickPerformanceType(item, index)">
			{{ item.name }}
			</div>
			</div>
			</div>
			</div>
			<div class="bg_list_item_num">
			<div class="bg_list_item_num_item">
			<span>å·¥èµåä»·</span>
			<div class="bg_list_item_num_item_sr">
			<span class="color1">{{ (arrType[form.index].salary / 10 / 10).toFixed(2) }}å/{{ arrType[form.index].type ==
			0 ? 'ä»¶' : 'æ¶' }}</span>
			</div>
			</div>
			</div>
			<div class="bg_list_item_num">
			<div class="bg_list_item_num_item">
			<span>é¢è®¡å·¥èµ</span>
			<div class="bg_list_item_num_item_sr">
			<span class="color1">{{ expectedSalary }}å</span>
			</div>
			</div>
			</div>
			<div class="bg_list_item_num">
			<div class="bg_list_item_num_item">
			<span>è¾¾æ ç</span>
			<div class="bg_list_item_num_item_sr">
			<span class="color1">{{ complianceRate }}%</span>
			</div>
			</div>
			</div>
			</div>
			</div>

			</div>
			<div class="details_dj" v-if="typeView === 1">

			<div class="details_dj_list">
			<u-swipe-action>
			<u-swipe-action-item v-for="(item, index) in djData" :key="index" :options="options"
			@click="dele(item.id)">
			<div class="details_dj_list_item">
			<span>{{ item.attrName }}ï¼{{ item.val }}</span>
			<span>{{ item.userName }} {{ item.createTime }}</span>
			</div>
			</u-swipe-action-item>
			</u-swipe-action>
			</div>
			</div>
			<!-- v-if="info.status === 2 \|\| info.procedureNeedcheck === 1" -->
			<template>
			<div class="bh_zw"></div>
			<div class="bg_footer bg_f7">
			<div class="bg_footer_submit bg_m" v-if="typeView == 0" @click="submit">ç¡®è®¤æ¥å·¥</div>
			<!-- proxy.$auth('h5:workorder:processRecord') && -->
			<div class="bg_footer_submit1" @click="jumpdj" v-if="typeView == 1">
			<image src="../../../static/gongdan_ic_shoudong@2x.png" class="fornt-img" mode=""></image>
			<span>æ°å¢ç¹æ£</span>
			</div>
			</div>
			</template>
			<u-datetime-picker :show="TimeShow" @cancel="TimeShow=false" @confirm="timeConfirm" v-model="form.time"
			mode="time"></u-datetime-picker>
			<u-popup :show="badShow" @close="badShow=false" :round="8" closeable zIndex="20000">
			<view class="rp p40 contanir">
			<view class="c2 b tc">ä¸è¯é¡¹</view>
			<view class="content bl_list">
			<div class="bl_list_item" v-for="(item, i) in cateList" :key="i" @click="changeChecked(i)">
			<div class="bl_list_item_left">
			<u-checkbox-group>
			<u-checkbox :checked="item.active" :label="item.name"
			:name="item.name">
			</u-checkbox>
			</u-checkbox-group>
			</div>
			<div class="bl_list_item_right">
			<input type="number" @click.stop v-model="item.num" placeholder="0" />
			</div>
			</div>
			</view>
			<view class="flex ap tc bottom-view">
			<view class="fx1 ml20 ptb20 sbtn_green" @click="confirm">ç¡®å®</view>
			</view>
			</view>
			</u-popup>
			</view>
			</template>

			<script>
			import workOrderInfo from '@/components/workOrderInfo.vue'
			export default {
			components: {
			workOrderInfo
			},
			data() {
			return {
			cate: [{
			name: 'çäº§'
			},
			{
			name: 'ç¹æ£'
			}
			],
			form: {
			time: '',
			efective: [],
			defectiveName: '',
			durationName: '0å°æ¶0åé',
			duration: 0,
			type: 0,
			index: 0
			},
			TimeShow: false,
			badShow: false,
			typeView: 0,
			feedingData: [{
			id: 0,
			materialName: 'å¢ä½ç ',
			procedureName: 'åå¶',
			qualityType: 1,
			locationName: 'CP-01',
			batch: '20230713',
			num: 2,
			maxNum: 10,
			unitAttribute: 1,
			unitName: 'å'
			}],
			options: [{
			text: 'å é¤',
			style: {
			backgroundColor: 'red',
			}
			}],
			arrType: [{
			name: 'è®¡æ¶',
			type: 1,
			salary: 1000,
			},
			{
			name: 'è®¡ä»¶',
			type: 0,
			salary: 100
			},
			],
			// äº§åºåæ ¼/ä¸è¯
			produceFrom: {
			qualifiedId: '',
			qualified: '', // åæ ¼
			undesirableId: '',
			undesirable: 5 // ä¸è¯
			},
			djData: [{
			attrName: 'åºæ°´æ¶é´',
			val: '2022-05-28 16:3',
			userName: 'å¼ ä¸ ',
			createTime: '2022-05-28 16:32:'
			}],
			cateList: [{
			active: false,
			name: 'æ¯åº',
			num: 0
			}]
			};
			},
			computed: {
			expectedSalary() {
			if (this.arrType.length === 0) return 0;
			// æä»¶è®¡ç®
			if (this.arrType[this.form.index].type == 0) {
			if (!this.produceFrom.qualified) return 0
			if (this.arrType[this.form.index].unqualified == 1) { // æ¯å¦è®¡å¥ä¸è¯å
			let total = Number(this.produceFrom.qualified) + Number(this.produceFrom.undesirable)
			return (total * (this.arrType[this.form.index].salary / 100)).toFixed(2) \|\| 0
			} else {
			return (Number(this.produceFrom.qualified) * (this.arrType[this.form.index].salary / 100)).toFixed(
			2) \|\| 0
			}
			} else {
			if (!this.form.duration) return 0;
			let h = (this.form.duration / 60 / 60).toFixed(2)
			return (Number(h) * (this.arrType[this.form.index].salary / 10 / 10)).toFixed(2) \|\| 0
			}
			},
			complianceRate() {
			if (this.arrType.length === 0) return 0;
			if (!this.produceFrom.qualified && !this.produceFrom.undesirable) return 0;
			if (!this.form.duration) return 0;
			if (!this.arrType[this.form.index].num) return 0;
			// æä»¶è®¡ç®
			// if (infoBox.value.type == 0) {
			if (this.arrType[this.form.index].unqualified == 1) { // æ¯å¦è®¡å¥ä¸è¯å
			let a = ((Number(this.produceFrom.qualified) + Number(this.produceFrom.undesirable)) / (this.form
			.duration / 3600)).toFixed(2)
			let b = (this.arrType[this.form.index].num / (this.arrType[form.index].times / 3600)).toFixed(2)
			return ((Number(a) / Number(b)) * 100).toFixed(2)
			// let total = (Number(from.qualified) + Number(from.undesirable)) / ((from.duration * 60 * 60) * infoBox.value.num / )
			// return total * infoBox.value.salary;
			} else {
			let a = (this.produceFrom.qualified / (this.form.duration / 3600)).toFixed(2)
			let b = (this.arrType[this.form.index].num / (this.arrType[this.form.index].times / 3600)).toFixed(2)
			return ((Number(a) / Number(b)) * 100).toFixed(2)
			// return Number(from.qualified) * infoBox.value.salary;
			}
			}
			},
			methods: {
			click() {

			},
			clickIten(index) {
			this.typeView = index
			},
			timeConfirm({
			value
			}) {
			console.log(value)
			let h = Number(value.substring(0, 2))
			let m = Number(value.substring(3, 5))
			let s = 0
			if (h > 0) {
			s += h * 60 * 60
			}
			if (m > 0) {
			s += m * 60
			}
			this.form.duration = s
			this.form.durationName = `${h}å°æ¶${m}åé`
			this.TimeShow = false
			},
			// ç¼è¾ææ/äº§åº
			change(id, num, type, maxNum, item, unitAttribute) {
			let obj = item
			if (type === 'T') {
			if (unitAttribute == 0 && num != '') {
			if (!REGULAR.positiveInteger.test(num)) {
			obj.num = obj.ynum
			Toast({
			message: 'åªè½è¾å¥æ£æ´æ°'
			})
			return
			}
			}
			if (unitAttribute == 1 && num != '') {
			if (!REGULAR.number.test(num)) {
			Toast({
			message: 'åªè½è¾å¥æ£æ´æ°æå°æ°ï¼æå¤åä½ï¼'
			})
			obj.num = obj.ynum
			return
			}
			}
			if (num > maxNum) {
			obj.num = obj.ynum
			Toast.fail({
			message: 'è¶åºå·¥è£æ»æ°'
			})
			return
			}
			} else if (type === 'C' && num > info.value.planNum) {
			obj.num = obj.ynum
			Toast.fail({
			message: 'äº§åºæ°éä¸è½è¶è¿è®¡åæ°é'
			})
			return
			}
			// updateById({ id, num }).then(res => {
			// if (res.code === 200 && type === 'T') {
			// getOrocessRecords()
			// } else if (res.code === 200 && type === 'C') {
			// // getOrocessRecordCC()
			// }
			// })
			},
			clickPerformanceType(item, index) {
			this.form.index = index
			this.form.type = item.type
			},
			submit() {},
			jumpdj() {},
			pageDJs() {},
			dele(id) {
			// deletedj(id)
			// .then(res => {
			// if (res.code === 200) {
			// djData.value = []
			// finished.value = false
			// page.page = 1
			// djData.value = []
			// pageDJs()
			// }
			// })
			},
			confirm() {
			// console.log('confirm');
			this.badShow = false
			},
			changeChecked(i) {
			this.cateList[i].active = !this.cateList[i].active
			}
			}
			}
			</script>

			<style lang="scss" scoped>
			.bg_cate {
			width: 100%;
			height: 88rpx;
			background: #FFFFFF;
			display: flex;
			align-items: center;

			.active {
			box-sizing: border-box;
			color: #305ED5 !important;
			font-weight: 500;
			border-bottom: 3rpx solid #305ED5;
			}

			.bg_cate_item {
			flex: 1;
			height: 100%;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 30rpx;
			font-weight: 400;
			color: #555555;
			}
			}

			.bg_list {
			width: 100%;
			display: flex;
			flex-direction: column;
			margin-top: 30rpx;

			.bg_list_item {
			display: flex;
			flex-direction: column;
			// margin-bottom: 40rpx;
			border-bottom: 40rpx #f7f7f7 solid;

			.kong {
			text-align: center;
			padding: 30rpx 0;
			background: #ffffff;
			font-size: 25rpx;

			span {
			color: #474747;
			}
			}

			.bg_list_item_top {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding-left: 30rpx;
			padding-right: 30rpx;
			margin-bottom: 30rpx;

			.bg_list_item_top_left {
			display: flex;
			align-items: center;

			.left {
			margin-left: 12rpx;
			font-size: 28rpx;
			}

			.warning {
			width: 8rpx;
			height: 30rpx;
			border-radius: 2rpx;
			margin-right: 12rpx;
			// background: $nav-stateColor5 !important;
			}

			.error {
			width: 8rpx;
			height: 30rpx;
			border-radius: 2rpx;
			margin-right: 12rpx;
			// background: $nav-stateColor4 !important;
			}

			.bg_list_item_top_left_x {
			width: 8rpx;
			height: 30rpx;
			// background: $nav-color;
			border-radius: 2rpx;
			margin-right: 12rpx;
			}

			span {
			font-size: 32rpx;
			font-weight: 500;
			color: #222222;
			display: flex;
			align-items: center;
			}
			}

			.bg_list_item_top_right {
			display: flex;
			align-items: center;

			image {
			width: 28rpx;
			height: 28rpx;
			margin-right: 12rpx;
			}

			span {
			font-size: 28rpx;
			font-weight: 400;
			}
			}
			}

			.bg_list_item_h {
			width: 100%;
			padding: 0 30rpx;
			box-sizing: border-box;
			background: white;

			.bg_list_item_num {
			width: 100%;
			min-height: 98rpx;
			background: white;
			display: flex;
			justify-content: center;
			align-items: center;
			border-bottom: 1rpx solid #E5E5E5;

			&:last-child {
			border: none !important;
			}

			.kong {
			text-align: center;
			font-size: 25rpx;
			padding: 30rpx 0;
			background: #ffffff;
			}

			.bg_list_item_num_item {
			width: 100%;
			height: 100%;
			display: flex;
			align-items: center;
			// height: 118rpx;
			padding: 15rpx 0;
			box-sizing: border-box;
			justify-content: space-between;
			border-bottom: 1rpx solid #E5E5E5;

			&:last-child {
			border: none;
			}

			.bg_list_item_num_item_list {
			display: flex;
			align-items: center;

			.active {
			background: #305ED5 !important;
			color: #FFFFFF !important;
			}

			.bg_list_item_num_item_list_item {
			width: 116rpx;
			height: 62rpx;
			line-height: 62rpx;
			text-align: center;
			background: #F2F2F2;
			border-radius: 8rpx;
			font-size: 26rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #333333;
			margin-right: 20rpx;

			&:last-child {
			margin: 0 !important;
			}
			}
			}

			.bg_list_item_num_item_wl {
			flex-shrink: 0;
			display: flex;
			flex-direction: column;
			font-size: 34rpx;
			color: #222222;

			.bg_list_item_num_item_wl_lx {
			margin-top: 10rpx;
			color: #222222;
			font-size: 28rpx;
			}
			}

			// .warning {
			// color: $nav-stateColor5 !important;
			// }

			// .err {
			// color: $nav-stateColor4 !important;
			// }

			img {
			width: 12rpx;
			height: 24rpx;
			margin-left: 20rpx;
			}

			span {
			flex-shrink: 0;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;

			b {
			font-size: 30rpx;
			color: red;
			margin-right: 5rpx;
			}

			// .warning {
			// color: $nav-stateColor5 !important;
			// margin-right: 5rpx;
			// }

			// .err {
			// color: $nav-stateColor4 !important;
			// margin-right: 5rpx;
			// }

			&:nth-child(1) {
			font-size: 30rpx;
			font-weight: 400;
			color: #222222;
			}

			&:nth-child(2) {
			font-size: 28rpx;
			font-weight: 400;
			color: #333333;
			flex-shrink: 0;
			}
			}

			.bg_list_item_num_item_sr {
			flex: 1;
			display: flex;
			align-items: center;
			justify-content: flex-end;

			.color1 {
			font-size: 28rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #333333;
			}

			input::-webkit-input-placeholder {
			font-size: 28rpx;
			}

			input {
			text-align: right;
			width: 180rpx;
			height: 60rpx;
			border-radius: 8rpx;
			border: 1rpx solid #E5E5E5;
			margin-right: 20rpx;
			font-size: 28rpx;
			font-weight: 400;
			color: #333333;
			padding: 0 30rpx
			}

			.wulll {
			width: 400rpx;
			text-align: right;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			}

			span {
			font-size: 28rpx;
			font-weight: 400;
			color: #999999;
			}
			}
			}
			}
			}
			}
			}

			.bg_plan {
			width: 100%;
			// height: 98px;
			padding: 30rpx;
			box-sizing: border-box;
			background: #FFFFFF;
			margin-bottom: 40rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;

			span {
			font-size: 30rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #222222;

			b {
			color: red;
			}
			}

			.bg_plan_nr {
			display: flex;
			flex-direction: column;

			span {
			font-size: 24rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #666666;
			margin-top: 20rpx;

			&:first-child {
			font-size: 32rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: #333333;
			margin-top: 0 !important;
			}
			}
			}

			.bg_plan_label_val {
			display: flex;
			align-items: center;

			span {
			font-size: 28rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #999999;
			}


			}
			}

			.img_ar {
			width: 12rpx;
			height: 24rpx;
			margin-left: 20rpx;
			}

			.bh_zw {
			height: 160rpx;
			}

			.bg_footer {
			position: fixed;
			bottom: 0;
			left: 0;
			width: 100%;
			padding: 30rpx 30rpx 60rpx 30rpx;
			box-sizing: border-box;

			.bg_footer_submit1 {
			width: 690rpx;
			height: 76rpx;
			background: #FFFFFF;
			border-radius: 36rpx;
			border: 1rpx solid #E5E5E5;
			display: flex;
			align-items: center;
			justify-content: center;

			.fornt-img {
			width: 28rpx;
			height: 28rpx;
			margin-right: 12rpx;
			}

			span {
			font-size: 26rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #305ED5;
			}
			}

			.bg_footer_submit {
			width: 690rpx;
			height: 88rpx;
			box-shadow: 0 0 12rpx 0 rgba(0, 0, 0, 0.08);
			border-radius: 8rpx;
			font-size: 30rpx;
			font-weight: 500;
			color: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: center;
			}
			}

			.details_dj {
			display: flex;
			flex-direction: column;

			.details_dj_list {
			width: 100%;
			box-sizing: border-box;
			background: #ffffff;
			display: flex;
			flex-direction: column;

			.details_dj_list_item {
			display: flex;
			flex-direction: column;
			border-bottom: 1rpx solid #E5E5E5;
			padding: 30rpx;
			line-height: 42rpx;

			span {
			&:nth-child(1) {
			font-size: 28rpx;
			font-weight: 400;
			color: #222222;
			}

			&:nth-child(2) {
			font-size: 24rpx;
			font-weight: 400;
			color: #999999;
			}
			}
			}
			}

			.details_dj_title {
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 30rpx 30rpx;
			box-sizing: border-box;

			.details_dj_title_left {
			display: flex;
			align-items: center;

			span {
			font-size: 32rpx;
			font-weight: 500;
			color: #222222;
			}
			}

			}
			}

			.contanir {
			height: calc(env(safe-area-inset-bottom) + 720rpx);

			.content {
			margin-top: 20rpx;

			.type-style {
			width: 325rpx;
			margin-bottom: 20rpx;
			}
			}
			}

			.bottom-view {
			left: 40rpx;
			right: 40rpx;
			bottom: 0
			}

			.bl_list {
			width: 100%;
			height: calc(100% - 168rpx);
			overflow-y: scroll;
			margin-top: 30rpx;

			.bl_list_item {
			width: 100%;
			height: 96rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-bottom: 1rPX solid #E5E5E5;

			&:last-child {
			border: none !important;
			}

			.bl_list_item_left {
			flex: 1;
			display: flex;
			align-items: center;

			input {
			width: 30rpx;
			height: 30rpx;
			border: 1rpX solid #CCCCCC;
			margin: 0 !important;
			}

			span {
			font-size: 30rpx;
			color: #222222;
			margin-left: 10rpx;
			}
			}

			.bl_list_item_right {
			flex: 1;
			height: 50rpx;
			text-align: right;

			input {
			padding-left: 5rpx;
			width: 160rpx;
			height: 100%;
			padding: 0 30rpx;
			box-sizing: border-box;
			text-align: right;
			font-size: 28rpx;
			color: #333333;
			border-radius: 10rpx;
			border: 1rPX solid #CCCCCC;

			&::-webkit-input-placeholder {
			font-size: 28rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #999999;
			}
			}
			}
			}
			}
			</style>